centering a website-.outer/inner not working

Discussion in 'Web Design and Development' started by pelsar, Apr 29, 2009.

  1. pelsar macrumors regular

    Joined:
    Apr 29, 2008
    Location:
    israel
    #1
    It shouldnt be a problem...just centering the site.....except its not centering. Perhaps a code conflict?

    this is what i am using within the CSS

    .outer {
    width:687px;
    margin:auto;
    display:table;
    }

    .inner {
    width:auto;
    margin:0px;
    display: table;

    _____

    and the code within the page....
    <div class="outer">
    <div class="inner">

    ----content-----

    </div>
    </div>



    and the site:

    http://www.spinnerdesign.co.il/
     
  2. design-is macrumors 65816

    design-is

    Joined:
    Oct 17, 2007
    Location:
    London / U.K.
    #2
    Hi :)

    Not looked extensively, but

    .outer {
    width:687px;
    margin: 0 auto;
    display:table;
    }

    might do the trick.

    Why have you got display:table on these classes?

    You have some bits of CSS in your head, is there a reason you haven't incorporated these into the attached stylesheet?

    /Doug
     
  3. TheCoupe macrumors member

    Joined:
    Mar 4, 2009
    Location:
    Northern Ireland
    #3
    Hi, I have only had a brief look at the css files and have noticed that you are using an awful lot of absolute positioning.

    if you remove the absolute position from your .outer, you will notice that your whole page moves to the right.

    Code:
    .outer {
    width:687px;
    margin:0px auto;
    position: absolute;
    }
    note, your margin should also read 0px auto. It could take me a while to go through all your css to make this work, but ultimately, start at the top and work your way through. Remember, you are currently using a method to 'absolutely' position elements on the page, rather than allowing them to be relatively positioned to their parent element.

    Hope this helps.

    Thanks

    Justin
     
  4. pelsar thread starter macrumors regular

    Joined:
    Apr 29, 2008
    Location:
    israel
    #4
    thanks for the hint.....

    we're now starting to clean it up...all of those css bits in the header were a result of many experimentations, etc, rather than mess up the style sheet with junk code....

    (us graphic designers tend to start with pics/images/placement etc first and deal with coding "after the fact")

    anyways will start the fix up
     

Share This Page