Hi,

I defined custom css in wp-damin/specular/general options:

@media all and (max-width: 980px) {
/*** wrap row in a flex box ***/
.custom_row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
-webkit-flex-wrap: wrap; /* Safari 6.1+ */
flex-wrap: wrap;
}
 
/*** custom classes that will designate the order of columns in the flex box row ***/
.first-on-mobile {
-webkit-order: 1;
order: 1;
}
 
.second-on-mobile {
-webkit-order: 2;
order: 2;
}
 
.third-on-mobile {
-webkit-order: 3;
order: 3;
}
 
.fourth-on-mobile {
-webkit-order: 4;
order: 4;
}
/*** add margin to last column ***/
.custom_row:last-child .et_pb_column:last-child {
margin-bottom: 30px;
}
 
}

Then I added the classes on my draft page “Produkt-Detail-Vorlage” to

1. row
Extra Class Name: “custom_row”

2. column
Column 1 – Extra Class Name: “second-on-mobile”
Column 2 – Extra Class Name: “first-on-mobile”

I’ve done this to show columns in another order on mobile devices.
But CSS is not working?!

As you’re able to access our site (credentials are at your site already), I’ll be fine if you’d have a look on it.

Any glue why my classes are not recognized?

Thanks in advance.

• This topic was modified 3 years, 5 months ago by reutli.
• This topic was modified 3 years, 5 months ago by reutli.
• This topic was modified 3 years, 5 months ago by reutli.
• This topic was modified 3 years, 5 months ago by reutli.