Hi all,
I am new to CSS (and web technologies in general) and trying to do some
basic stuff with it. For example, I'd like to position a block element
centered in a page: the text inside this block should be also centered.
Here is what I tried:
<html>
<head>
<style type="text/css">
<!--
body, ul, div {
margin: 0 ;
padding: 0 ;
}
..test {
text-align: center ;
width: 95% ;
margin: 1em auto ;
border: #3333ff 1px solid ;
}
-->
</style>
</head>
<body>
<div class="test">test</div>
</body>
</html>
In Mozilla, what I get is a blue rectangle around the div that's 95%
wide as the body, with some space left and right (presumably 2.5% each
side), plus text centered in this rectangle. Exactly what I want.
In IE6, the div pushed to left side, i.e. it's not centered at all. The
strange thing (to me) is that if I replace the div by an ul, then I get
what I want. Can you explain that ?
And can you explain me how to center the div (I don't need any ul here,
actually I want to have an address element, but it behaves just the same
as the div...) ?
