Responsive theme suggestion: flexible margins on container and footer elements

  1. galeroy

    Suggestion for the WordPress Responsive theme template.

    When the browser window width reduces in size to the point that the container and footer start scaling, it would be good to also scale the left and right margins on the container and footer elements.

    Currently the theme uses a fixed width of 25px for the left and right margins of these elements.

    For smaller sized mobile phones in portrait mode, 50 pixels of left/right margins = 15% of the entire content area (i.e. a lot).

    Here's what I did..

     1010px = (960 container with) + (25 left margin) + (25 right margin)
     In other words, when the browser window width is less than 1010px,
     the container and footer begin scaling down in size by default, so
     why not scale the margins as well?
     2.47524752475248% = 25 / 1010 * 100 = scaling factor
    @media screen and (max-width: 1010px)
        #container, #footer {
            padding: 0px 2.47524752475248%
    Posted: 5 years ago #

RSS feed for this topic


You must log in to post.

  • Rating

    0 Votes
  • Status

    This is theme territory