Computer Science Canada

Question on relative positioning of <div>s

Author:  HazySmoke)345 [ Sat Feb 10, 2007 12:07 am ]
Post subject:  Question on relative positioning of <div>s

I designed a webpage under 800x600 resolution. I used lots of <div> tags and used absolute positioning. It looks wonderful under that resolution.

However, when I switched to 1024x768 resolution, the webpage looks horrendous because all its contents were on the left and there's a HUGE blank space on the right.

Is it possible to make the divisions display in the centre instead?

Author:  Amailer [ Sat Feb 10, 2007 12:13 am ]
Post subject:  RE:Question on relative positioning of <div>s

Make a main div, put all your content in it and for that div give it:
css:

margin-right: auto;
margin-left: auto;


That should center your content. You can do it for each individual section too (header, body, footer etc) up to you :/

Author:  HazySmoke)345 [ Sat Feb 10, 2007 1:06 am ]
Post subject:  Re: Question on relative positioning of <div>s

No luck. Sad
code:
div{
        border: 1px solid black;
        background-color: #ffd2a6;
        margin-right: auto;
        margin-left: auto;
        padding: 0px;
}
#title{
        width: 750px;
        height: 160px;
}
...
<div id = "title">
...

That's what I wrote... and my Internet explorer is still justifying it to the left.

Author:  Amailer [ Sat Feb 10, 2007 1:10 am ]
Post subject:  RE:Question on relative positioning of <div>s

Don't do it for all the divs, do it for one main div id that encompasses the rest of the divs you want centered example:
HTML:

<div id="main">
 
<div id="top">
</div>
<div id="middle">
</div>
<div id="bottom">
</div>

</div>


Then your css for #main would have:
css:

#main {
margin-right: auto;
margin-left: auto;
}

Author:  Tony [ Sat Feb 10, 2007 2:20 pm ]
Post subject:  RE:Question on relative positioning of <div>s

Also, something like 5% use 800x600 resolution

Though then again designing for any particular resolution assumes the full-screen browser window.

Liquid CSS design for the win! (using relative widths)

Author:  HazySmoke)345 [ Sun Feb 11, 2007 12:03 am ]
Post subject:  Re: Question on relative positioning of <div>s

Thanks so much, Amailer. You helped me so much so far. You deserve some karma applauds.

Author:  Amailer [ Sun Feb 11, 2007 1:19 am ]
Post subject:  RE:Question on relative positioning of <div>s

Thanks Very Happy


: