Show sourcecode
The following files exists in this folder. Click to view.
public_html/gamla-kurser/webbutv1/ovningar/css/
bento_grid.css
css_ovning-flexbox.css
css_ovning10.css
css_ovning11.css
css_ovning3.css
css_ovning8a.css
css_ovning8b.css
css_ovning9.css
css_ovning9_alt.css
css_ovning8a.css
117 lines ASCII Windows (CRLF)
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
.title {
color: white;
font-family: Arial, Helvetica, sans-serif;
font-size: 2em;
text-align: center;
font-weight: bold;
padding: 0;
margin-top: 15px;
}
.undertitle {
color: black;
font-family: Arial, Helvetica, sans-serif;
font-size: 1.5em;
margin-top: 10px;
margin-left: 5px;
}
.container {
width: 800px;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-rows: 75px 50px 200px 50px 250px 75px;
border: 1px solid black;
}
#item1 {
background-color: rgb(95, 95, 95);
grid-row-start: 1;
grid-row-end: 1;
grid-column-start: 1;
grid-column-end: 7;
}
#item2 {
grid-row-start: 2;
grid-row-end: 2;
grid-column-start: 1;
grid-column-end: 7;
background-color: lightgray;
}
#item3 {
grid-row-start: 3;
grid-row-end: 3;
grid-column: 1/3;
}
#item4 {
grid-row-start: 3;
grid-row-end: 3;
grid-column: 3/5;
}
#item5 {
grid-row-start: 3;
grid-row-end: 3;
grid-column: 5/7;
}
#item6 {
background-color: lightgray;
grid-row-start: 4;
grid-row-end: 4;
grid-column: 1/7;
}
#item7 {
grid-row-start: 5;
grid-row-end: 5;
grid-column: 1/4;
}
#item8 {
grid-row-start: 5;
grid-row-end: 5;
grid-column: 4/7;
}
#item9 {
grid-row-start: 6;
grid-row-end: 6;
grid-column: 1/7;
background-color: rgb(149, 149, 149);
text-align: center;
}
div {
border: 2px solid black;
}
.titlebox {
text-align: center;
width: 100%;
border: 2px solid black;
}
h1,h2,h3,p {
margin:5px;
padding:0px;
font-family: Arial, Helvetica, sans-serif;
}
.bigletter {
font-size: 3em;
}
img {
height: 50px;
}
body {
display: flex;
justify-content: center;
}