Tagged: layout, mobile, responsive
Hello,
My website homepage has a large scrolling image with a section of text to the right.
http://www.kingsmeadfield.org.uk
This displays fine on the desktop and converts nicely on the mobile.
However, on the ipad mini the layout looks very odd because the images are so small compared with the text. There just isn’t enough width to make this layout work. Is it possible to force this media size to default to the mobile layout? It already has a mobile menu as I’ve set that for smartphones and tablets.
Whilst I can control various elements in css for certain media sizes, the page uses your layout grids so I’m not sure how to go about repositioning those.
Any help you can give me is much appreciated.
Many thanks,
Yvonne.
Hey sentinelchicken,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
@media only screen and (max-width: 990px) {
.flex_column { width: 100% !important; margin-left: 0 !important; }}
Best regards,
Yigit
HI I’m hoping you can give me any advice on forcing screen layout to go to mobile version on ipad? I have 3 icons with headings in a row on the home page and the headings over lap on ipad portrait layout. Mobile layout moves the icons into a single column vertical layout and I’m hoping I can force the ipad to do the same.
Cheers
Josh
Sorry I got it figured out. I used your suggested css edit and changed the 990 value to 1200.
cheers!
Hi,
Glad it is sorted!
To know more about enfold features please check – http://kriesi.at/documentation/enfold/
Thank you for using Enfold :)
Best regards,
Vinay