WordPress.org

Ready to get started?Download WordPress

Ideas

Responsive theme suggestion: flexible margins on container and footer elements

  1. galeroy
    Member

    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: 10 months ago #

RSS feed for this topic

Reply

You must log in to post.

  • Rating

    12345
    0 Votes
  • Status

    This is theme territory