469,336 Members | 5,286 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,336 developers. It's quick & easy.

How to Center a Fixed-width Element (not Text) Relative to Window?

For instance, if a style-sheet is defined as

..maintext {width:35em; background-color:white;}
body {background-color:gray;}

And the HTML is:

<div class="maintext">

some text

</div>

How do I get everything in (the white box) div element to
automatically center itself in the (gray) browser window, regardless
of size of window, zoom setting, etc.? I've tried margin and padding
percentages, but nothing works.
Jul 20 '05 #1
2 5103
On 28 Sep 2003 18:40:57 -0700, bs*****@mac.com (Ben Sharvy) wrote:
For instance, if a style-sheet is defined as

.maintext {width:35em; background-color:white;}
body {background-color:gray;}

And the HTML is:

<div class="maintext">

some text

</div>

How do I get everything in (the white box) div element to
automatically center itself in the (gray) browser window, regardless
of size of window, zoom setting, etc.? I've tried margin and padding
percentages, but nothing works.

Add this declaration to .maintext

margin: auto;

This will set allow a defined-width container to have equal left and
right margins, which will center it, at least in browsers that are
somewhat css-compliant.

Nick

--
Nick Theodorakis
ni**************@hotmail.com
nicholas_theodorakis [at] urmc [dot] rochester [dot] edu
Jul 20 '05 #2
Ben Sharvy wrote:
How do I get everything in (the white box) div element to
automatically center itself in the (gray) browser window, regardless
of size of window, zoom setting, etc.? I've tried margin and padding
percentages, but nothing works.


This should be simple, but MSIE has bugs, so it gets a little complicated.
http://dorward.me.uk/www/centre/ has the full story.

--
David Dorward http://dorward.me.uk/
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

32 posts views Thread by Axel Dahmen | last post: by
32 posts views Thread by Axel Dahmen | last post: by
7 posts views Thread by Petesman | last post: by
10 posts views Thread by Pierre Jelenc | last post: by
1 post views Thread by Henry Reardon | last post: by
9 posts views Thread by pout | last post: by
12 posts views Thread by Vincent Vinet | last post: by
4 posts views Thread by Harris Kosmidhs | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by haryvincent176 | last post: by
reply views Thread by Marylou17 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.