-
Posts
-
i want to get a fore column row with equal height in between 768 and 1450px to a 2/2 column and than beneath the 768 (as it is set by default in your enfold) to a one column outlook.
on my site this works for the old column (before Enfold 3.2) but the equal hight is a nice feature and i want to do this for it too.Ok – i think i got it:
@media only screen and (min-width: 768px) and (max-width: 1450px) { #top .av-flex-placeholder {display: none} #top .flex_column_table_cell {display: block; float: left} .responsive .flex_column.av_one_fourth.flex_column_table_cell {width: 47.5% !important; margin: 0 2% 2% 0;} .flex_column.av_one_fourth.flex_column_table_cell:nth-child(4n+1) {clear: left} }the point was the av-flex-placeholder ( allthough i set it to display none – it counts as a neighbour div) so i have to clear left every 4th div – and the change from display table to block in some parts
perhaps it is better to use the :nth-of-type() selector
@media only screen and (min-width: 768px) and (max-width: 1450px) { #top .av-flex-placeholder {display: none} #top .flex_column_table_cell {display: block; float: left} .responsive .flex_column.av_one_fourth.flex_column_table_cell {width: 47.5% !important; margin: 0 2% 2% 0;} .flex_column.av_one_fourth.flex_column_table_cell:nth-of-type(4n+1) {clear: left} }Hey!
glad you could find the solution by yourself. Let us know in a new ticket in case you have some more questions related to the theme. We are happy to assist.
Regards,
AndyHi Support,
Im currently using the above code to controll 4x one-forth colums in ipad portait view.
How can i modify the code to add a custom class so that i can apply it to only certain elements within the site?
Many thanks!
Hi @danneeroy,
You can assign custom classes to all builder elements if you follow this: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Best regards,
Rikard
- You must be logged in to reply to this topic.