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

Home Forums CSS [Solved] Iphone responsive design not working

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

    I’ve been battling this problem now for what seems like ages. You can reproduce the problem at I have a “main image” there that sizes itself for all the browsers I’ve tested with using background-size: cover; No problem there.

    The problem is no matter what I do I cannot change it or make it work and be responsive for an iPhone.

            <a href="Cloud/Getting-Started/default.html#FreeStore">
            <img alt="Forever Free Ecommerce" src="Cloud/images/warehouse2.png" class="centerImage" style="border-width: 0px; " id="MainBanner" />
         .centerImage {
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
         background-size: cover; 
         background-repeat: no-repeat;
         /* text-align: center; */
         width: 100%;
         height: 100%;

    This is my latest CSS attempt to load a different image. Nothing CHANGE!

         @media only screen and (orientation: portrait) and (device-width: 320px), (device-width: 768px) {
         #MainBanner {
         /*display:none !important */
         background-size: 500px 373px;
         -moz-background-size: 500px 373px;
         -webkit-background-size: 500px 373px;
         background-attachment: fixed;

    I really could use some help on how to solve this.

    Ward Larson

    throw !important after your background-size properties under #MainBanner?

    Ward Larson

    You’ll need to place !important within the semicolon, not outside it. Try: background-size: 640px 426px !important;


    The problem is that the styles in your media query are fully ignored. No amount of !important tags will change that.

    Remove the closing bracket from line 592 or 594 (only one of them), and things should work.

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