The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Wraps not working on mobile browsers

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #200737

    Hey guys, I’ve been searching around for ways to fix this issue I’m having, but not having any luck. If you visit on either an android or iphone, 50% of the container wraps are cut off. It seems like it would be a simple fix, but I’ve been at it for hours and not coming up with anything. Would one of you css experts be so kind as to have a look at the site on your mobile, and on your browser, so you can see what it’s suppose to look like. It would be very much appreciated. Thank you.


    checkout the widths of #main, #hero and so on… you will find that all those div have a width 978px. That’s the reason you are seeing scrollbar on the page.


    You may want to think about adding some media queries to your CSS, which will allow you adjust the site depending on the size of the device


    What is going on is you haven’t set a max-width for your wrappers and you have set the width’s to a fixed width (ie: px instead of em’s or %).

    What I would suggest is setting your wrappers and to max-width: 100%. This will keep the wrapper contained within the window.

    Next, you may want to adjust the left positioning of #step2 and #step3 divs. They are positioned outside of the wrapper when the window is resized to a smaller width.

    I would definitely recommend using media queries. To me, they are the main tool behind RWD.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.