Does anybody know a way to center a block using just css?
so far the only thing I've found was
.block{
width: 90%;
margin-left: 5%;
margin-right: 5^%;
}
but that results in some browser issues...
Margin: auto will center a block element as long as the width is set.
.block { width: 90%; margin: auto; }
have you got a working example, because I can't get it to work :-/
Do you have a valid DOCTYPE? If not, the browser will default to tag soup mode (for old and non-standards compliant pages). It also keeps margin: auto from working.
http://www.w3schools.com/tags/tag_doctype.asp
yah, I know how to do valid html ;)
they should really put an align statement in css :-\
That's something I've always felt was missing from CSS 2. There's no vertical align and the horizontal one is "text-align" which doesn't fit everything...
-[Unknown]
Here's an example (http://www.cybersewer.com/test.html).
Probably only works in IE...
-[Unknown]
Works perfectly fine for me in Mozilla and Opera.
tried it in IE aswell, and it seems to work :-/
I should warn you, however, that IE5 won't like it. Luckily, though, it screws up the CSS standard by horizontally aligning both inline and block elements with text-align. So you'll want to add the following to your stylesheet (I updated the previously linked example to account for this):
body { text-align: center; }
body * { text-align: left }
minor point: the width is 70% not 90%, I was a little scared when it claimed to be 90% wide... :)
Quote from: [Unknown] on August 04, 2003, 03:06:13 PM
That's something I've always felt was missing from CSS 2. There's no vertical align and the horizontal one is "text-align" which doesn't fit everything...
-[Unknown]
No vertical align? and what about the property verical-align ?
I'll eat my hat. I swear I'd looked for that before and not found it.
-[Unknown]
here ya go
http://www.w3.org/TR/REC-CSS2/propidx.html
or
http://www.w3.org/TR/REC-CSS2/visudet.html#propdef-vertical-align
The way I read the definition :
QuoteThis property affects the vertical positioning inside a line box of the boxes generated by an inline-level element. The following values only have meaning with respect to a parent inline-level element, or to a parent block-level element, if that element generates anonymous inline boxes; they have no effect if no such parent exists.
is that it affects the alignment of the content of the block, not the position of the block itself.
The same with text-align. They are both applied to the contents.
-[Unknown]
Quote from: [Unknown] on August 25, 2003, 10:11:04 PM
The same with text-align. They are both applied to the contents.
-[Unknown]
yes it seems so.. i just encountered the same problem myself >:( :P