SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How do I control margins on the wrapper?



    Hi From still now wet and cloudy Wakefiled UK...

    On this page http://www.pauserefreshment.co.uk/eastridingsshop.html
    I've added a wrapper and my question is can you control the margin around the wrapper so it looks even all the way round rather just the left and right as heighlighted in the screen grab red circles?

    Any insights welcome:

    And here's the wrapper css...

    #container_ers
    {
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom:20px;
    width: 770px;
    background:#fff;
    }
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  2. #2
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,278
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Well, people with wider screens are going to have more side-to-side space than vertical space, unless your wrapper can grow sideways (flex-width).

    One thing you could try is from the other direction: give the body % padding and let the #wrapper loose as far as width. like

    body {
    padding: 10%; /*or something*/
    background-image: url(java.jpg);
    }

    #wrapper {
    /*no width or margins*/
    background:#fff;
    }


    your vertical margins can be %'s as well. They don't have to be px.

  3. #3
    SitePoint Addict AtSea webdesign's Avatar
    Join Date
    May 2010
    Location
    Newark, Delaware
    Posts
    283
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Don't want to bag on your design (constructive criticism. )but you might want to re-think the body background image being so 'in your face'. Very distracting to the text in the middle and not sure what value it adds to the page.

    If you do decide to keep it google seamless background tiles to fix the hard edges of the repeating image.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •