1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

CSS help centering page

Discussion in 'CSS' started by Finn6107, Mar 19, 2017.

  1. #1
    I am trying to make the background colour of my container fill the whole page, and still have the container with my text and photos be centered in the page. When I changed the width to 100% the colour filled the page.
    <div id=container "width: 100%">
    Inside that div I made a div container2 with all my data. It is currently at the left side of the page, but I would like it to stay in the center. Is there a class or style that I can apply to this div to do this?

    I am not a web designer and I'm only doing this on a family business website, so please be kind.
    Thank you
     
    Solved! View solution.
    Finn6107, Mar 19, 2017 IP
  2. #2
    Simplest way? Put your background color on the body element.
    
    body {
        background-color: #eee;
        margin: 0; }
    Code (markup):
    We zero the body's margin to kill the 8px default margin on body.

    For the container element, set a proportional width with a maximum.
    
    #container {
        margin: 0 auto;
        max-width: 48em; /*this is reasonable for a two column page; just don't let it get too wide
                           to comfortably read*/
        width: 95%; /*gives a minimum spacing on either side of the content block*/ }
    Code (markup):
    gary
     
    kk5st, Mar 19, 2017 IP
  3. mike30

    mike30 Well-Known Member

    Messages:
    883
    Likes Received:
    34
    Best Answers:
    0
    Trophy Points:
    140
    #3
    Send me the link of your page I can help you with that. (to have a better idea of what you are trying to achieve)
     
    mike30, Mar 19, 2017 IP
  4. Finn6107

    Finn6107 Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #4
    Thank you Gary. That worked perfectly and I appreciated the simplicity.
    Nancy
     
    Finn6107, Mar 19, 2017 IP