Verskil tüsken versys van "Mal:Vöärblad/styles.css"
Verwijderde inhoud Toegevoegde inhoud
Geen bewerkingssamenvatting |
Geen bewerkingssamenvatting |
||
| Regel 1: | Regel 1: | ||
.some-page-wrapper { |
|||
| ⚫ | |||
background-color: red; |
|||
| ⚫ | |||
.row { |
.row { |
||
display: flex; |
display: flex; |
||
flex-direction: row; |
|||
flex-wrap: wrap; |
|||
| ⚫ | |||
} |
} |
||
.column { |
.column { |
||
display: flex; |
|||
flex-direction: column; |
|||
flex-basis: 100%; |
|||
flex: 1; |
|||
} |
} |
||
| ⚫ | |||
/* Responsive layout */ |
|||
height: 100px; |
|||
@media screen and (max-width: 480px) { |
|||
| ⚫ | |||
| ⚫ | |||
| ⚫ | |||
} |
} |
||
| ⚫ | |||
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */ |
|||
height: 100px; |
|||
@media only screen and (max-width: 480px) { |
|||
| ⚫ | |||
| ⚫ | |||
| ⚫ | |||
} |
} |
||
@media |
@media screen and (min-width: 480px) { |
||
.column { |
|||
flex: 1 |
|||
| ⚫ | |||
} |
} |
||
Versy up 17:13, 3 jan 2020
.some-page-wrapper {
margin: 15px;
background-color: red;
}
.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
}
.column {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 1;
}
.left-column {
height: 100px;
}
.right-column {
height: 100px;
}
@media screen and (min-width: 480px) {
.column {
flex: 1
}
}