Dear support,
in mobile-view the logo-element 3 columns changes to one big logo in the first row and two smaller Logos in the second-row. What is the correct css to keep the 3 Columns on mobil-view as well?
I tried this code with no effect:
@media only screen and (max-width: 479px) {
.responsive #top #wrap_all .avia-logo-element-container .slide-entry {
width: 33%!important;
flex-basis: 33%;
}
}
Hey,
Thanks for contacting us!
Please add following code to Quick CSS field in Enfold theme options > General Styling tab
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.slide-parity-even {
margin-left: 4%;
}
.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.first {
width: 33%;
}
#top .avia-logo-grid .slide-entry-wrap {
display: flex;
}
}
Best regards,
Yigit
Hey, Yigit,
thanks for your help!
I added the css, now the first logo is slightly smaller on mobile-view.
Also the following socialmedialinks (Icon-raster-element) a not really centered on mobile-view. There is a padding on the left. Is there a solution for that?
Hey!
Could you please replace the previous code with following one?
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.slide-parity-even {
margin-left: 4%;
}
.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.first,
.responsive #top #wrap_all .slide-entry {
width: 33%;
}
#top .avia-logo-grid .slide-entry-wrap {
display: flex;
}
}
@media only screen and (max-width: 480px) {
#avia-icongrid-61def0d63b5fe.avia-icongrid-tooltip li article {
padding: 4em 0;
}}
That should fix social media links on mobile as well :)
Regards,
Yigit
Awesome support Yigit!
Thank so very much :-)