Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • July 19, 2014 at 7:01 pm #293430
    PAULCNET

    Hello, I am trying to implement spacing or margins around my overall layout. I am currently used the boxed and fixed layout, and compared to other sites that does not have responsive themes, their layouts seems to have small margins surrounding their site, so when viewed on a smaller screen such as a mobile you can see the entire layout with some background visible.

    My current situation is that when I tried to use this code

    .boxed#top {
    margin: 40px auto;
    }

    It does increase the margin from the top and bottom, and shows the spacing in mobile devices, but does not increase the margin from left and right. If I tried to use margin-right and margin-left with the same amount of pixels it shifts the entire layout to the left, but what I want to do is have some spacing around the layout, because without some form of spacing the layout stretches the entire screen from left to right.

    I don’t know if margins is the method I should be looking for, but what I am trying to achieve is a fixed boxed layout shows my entire layout with some background showing using any type of screen size. If the screen size is too small, it becomes stretched, thus defeating the purpose of a boxed layout in smaller screens.

    Thank you :)

    July 20, 2014 at 11:28 pm #293657
    PAULCNET

    Any help is much appreciated because I would like the user to see the overall boxed layout instead of the layout been stretched in smaller screens even though it is a fixed boxed layout?

    Thank you

    July 21, 2014 at 9:36 am #293753
    Ismael

    Hi!

    Thank you for using the theme.

    Try to set the width of the boxed layout to 90% when viewing on smaller screens. Add this on Quick CSS or custom.css:

    @media only screen and (max-width: 767px) {
  .responsive .boxed#top {
    width: 90%;
  }
}

    Adjust the width if necessary.

    Regards,
    Ismael

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.