column 1/2
@media (max-width:980px){
.row1, .row2 {
display:flex;
}
.row1 .et_pb_column,
.row2 .et_pb_column {
margin-right:5%;
}
}
column 2/2
@media (max-width:980px){
.row1, .row2 {
display:flex;
}
.row1 .et_pb_column,
.row2 .et_pb_column {
margin-right:5%;
}
}
Hieronder wat mogelijkheden om colommen te wijzigen voor ipad en/of phone. Voor beide gebruik je
@media (max-width:980px)
voor alleen pad gebruik je
@media (min-width:768) and (max-width:980)
column 1/3
@media (max-width:980px){
.row1, .row2 {
display:flex;
}
.row1 .et_pb_column,
.row2 .et_pb_column {
margin-right:5%;
}
}
column 2/3
@media (max-width:980px){
.row1, .row2 {
display:flex;
}
.row1 .et_pb_column,
.row2 .et_pb_column {
margin-right:5%;
}
}
column 3/3
@media (max-width:980px){
.row1, .row2 {
display:flex;
}
.row1 .et_pb_column,
.row2 .et_pb_column {
margin-right:5%;
}
}
column 1/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 2/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 3/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 4/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 1/4
in deze rij gaan we de laatste 4-4 op plek 1 zetten
hiervoor gebruiken we de nth-child en daarmee zie je dat de vierde naar de eerste plaats verhuist
.row3 .et_pb_column:nth-child(4n) {
order:-1:;
}
column 2/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 3/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 4/4
.row3 .et_pb_column {
width:100%;
flex-basis:30%;
margin-right: 5%!important;
}
.row3 .et_pb_column:nth-child(3n) {
margin-right:0!important;
}
column 1/5
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 2/5
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 3/5
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 4/5
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 5/5
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 1/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 2/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 3/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 4/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 5/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 6/6
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
column 1/7 klein
Your content goes here. Edit or remove this text inline or in the module Content settings.
column 2/7 lang
.row7 {
justify-content:space-between;
}
.row7 .et_pb_column:nth-child(1) {
flex-basis:30%;
}
.row7 .et_pb_column:nth-child(2) {
flex-basis:65%;