Dear Kriesi,
Since updating to Enfold 3, I am losing the gap between the two half width columns, for instance on my home page, when the browser is sized down below the 990px threshold.
I previously made the following adjustments to my column sizes, with your help, which worked fine before:
@media only screen and (max-width: 990px) {
div .av_one_third, div .av_two_third {
margin-left: 0%;
width: 50%;
}}
@media only screen and (max-width: 767px) {
#top .isotope-item.av_one_third {
width: 100% !important
}
}
@media only screen and (min-width: 767px) {
#top .isotope-item.av_one_third {
width: 28% !important
}
#top .isotope-item.av_one_third {
margin-bottom: 52.4px;
}
}
@media only screen and (min-width: 989px) {
#top .isotope-item.av_one_third {
margin-bottom: 72.4px;
}
}
@media only screen and (min-width: 1139px) {
#top .isotope-item.av_one_third {
margin-bottom: 82.4px;
}
}
Hey Richard!
Thank you for using Enfold.
Please replace this code:
@media only screen and (max-width: 990px) {
div .av_one_third, div .av_two_third {
margin-left: 0%;
width: 50%;
}}
With:
@media only screen and (max-width: 990px) {
div .av_one_third, div .av_two_third {
margin-left: 3%;
width: 47%;
}
}
Cheers!
Ismael
This is great, many thanks Ismael