More actions
Content deleted Content added
m hide drop cap |
m flex box with border |
||
Line 398: | Line 398: | ||
* Adapted CSS from W3 |
* Adapted CSS from W3 |
||
******************************/ |
******************************/ |
||
* { |
|||
box-sizing: border-box; |
box-sizing: border-box; |
||
} |
} |
||
Line 413: | Line 413: | ||
flex: 65%; |
flex: 65%; |
||
background-color: #f7f7f7; |
background-color: #f7f7f7; |
||
border:1px solid #ccc; |
|||
padding: 10px; |
padding: 10px; |
||
margin: 5px; |
margin: 5px; |
||
Line 422: | Line 423: | ||
flex: 25%; |
flex: 25%; |
||
background-color: #f7f7f7; |
background-color: #f7f7f7; |
||
border:1px solid #ccc; |
|||
padding: 10px; |
padding: 10px; |
||
margin: 5px; |
margin: 5px; |
||
Line 427: | Line 429: | ||
} |
} |
||
/* Responsive layout - when the screen is less than |
/* Responsive layout - when the screen is less than 900px wide, make the two columns stack on top of each other instead of next to each other */ |
||
@media screen and (max-width: 900px) { |
@media screen and (max-width: 900px) { |
||
.row { |
.row { |