Heya people, I am looking for help on how to center a div of unset size in a div of unset size.
<div id="one" width="100%"> //Width of Moniter
<div id="two"> //Div needs to be centered
La la la //Unsetsize
</div>
</div>
If you need to see my real code to get a idea of what i mean(I am even confushed looking at that example) go Here (<!-- m --><a class="postlink" href="http://www.gslc.qld.edu.au/Newpage/GSLC(CSSMenu">http://www.gslc.qld.edu.au/Newpage/GSLC(CSSMenu</a><!-- m -->)/index.htm)
Thanks for any help.
WofenThe contained div has to have a size.The contained div has to have a size.
Just to clarify-- it doesn't have to be a size in pixels, it just has to be some size, in ems, %, whatever.
#two { margin: 0 auto 0 auto; }
That's the proper way to center in IE6 and Moz. To support IE5, you do this:
#one { text-align: center; }
#two { margin: 0 auto 0 auto; text-align: left; }
Now, if you want an element to "shrink wrap" a block of text, you have to either a) declare it as display:inline, or b) float it. You can center an inline element, but then you can't reliably set its height. (You sort of can, using a combination of line-spacing and padding, but it's quirky) But I haven't yet figured out a way to properly center a float.
Hope that's of some use.Just to clarify-- it doesn't have to be a size in pixels, it just has to be some size, in ems, %, whatever.Yea, I had already done a little example with a percentage width before it sunk in he said "unset size" in the question.When i ment unset size, the size would be set, but I would not know what the size would be, as it is in Em's and % and is quite nastie.
Thanks for the solutions, but sadly we have given up on that idea, as the head Exec changed his mind AGAIN. Always happens
.
Thanks, I will place this in my bank of ideas.
Wofen
<div id="one" width="100%"> //Width of Moniter
<div id="two"> //Div needs to be centered
La la la //Unsetsize
</div>
</div>
If you need to see my real code to get a idea of what i mean(I am even confushed looking at that example) go Here (<!-- m --><a class="postlink" href="http://www.gslc.qld.edu.au/Newpage/GSLC(CSSMenu">http://www.gslc.qld.edu.au/Newpage/GSLC(CSSMenu</a><!-- m -->)/index.htm)
Thanks for any help.
WofenThe contained div has to have a size.The contained div has to have a size.
Just to clarify-- it doesn't have to be a size in pixels, it just has to be some size, in ems, %, whatever.
#two { margin: 0 auto 0 auto; }
That's the proper way to center in IE6 and Moz. To support IE5, you do this:
#one { text-align: center; }
#two { margin: 0 auto 0 auto; text-align: left; }
Now, if you want an element to "shrink wrap" a block of text, you have to either a) declare it as display:inline, or b) float it. You can center an inline element, but then you can't reliably set its height. (You sort of can, using a combination of line-spacing and padding, but it's quirky) But I haven't yet figured out a way to properly center a float.
Hope that's of some use.Just to clarify-- it doesn't have to be a size in pixels, it just has to be some size, in ems, %, whatever.Yea, I had already done a little example with a percentage width before it sunk in he said "unset size" in the question.When i ment unset size, the size would be set, but I would not know what the size would be, as it is in Em's and % and is quite nastie.
Thanks for the solutions, but sadly we have given up on that idea, as the head Exec changed his mind AGAIN. Always happens
.Thanks, I will place this in my bank of ideas.
Wofen