Preserved Topic: css stuff... for IE only. (Page 1 of 1)

threep wanders back into the forum, this time with a question:
"i have this chunk of css:

A.button, A.buttonHL       {

		width: 150px;

		height: 40px;

		border: 1px solid #000000; 

		TEXT-DECORATION: none; 

		font-family: arial;

		font-weight: bold;

		font-size:14px;

		background-color: #ccc; 

		COLOR: #000; 

		text-align:center;

		padding: 3px 5px;

		margin: 5px 5px;}

...which basically makes a link look like a button (it also has hover properties). yes, it IS only supposed to work in IE.
now... the text within this box, if it is 2 lines, looks fine, but if it is one line, sticks to the top half of the 150 x 40 px box.
how can i align the text within this box to centre?"
hoping someone can help him, he wanders off to tinker himself.

edit: threep quickly adds "don't worry yourselves about this one, i have found a cheat workaround, but if anyone knows the solution offhand, i would like to know the legit way of doing it! "



[This message has been edited by 3rdperson (edited 09-06-2001).]

Can't you use vertical-align: middle?

I would think the vertical align: middle would work, but it may not be perfect...

Just for giggles...if you want it to look more like a button, change the border from solid to outset.

Check out the CSS they use for the cool button effect here (its probably the best of its kind available online):
http://webfx.eae.net/dhtml/coolbutton2/cb2.html

Emps

You could avoid setting the height of it, which would shrink the edges to fix around the text, if you wanted.

threep returns, once again seeking a solution:
"hey, im back!
i have this box:

#midcircle {	position:absolute;

		left: 142px;

		top: 165px;

		width: 170px;

		height: 170px;

		border: 1px solid black;

		text-align: center;

		color: ff6400;

		font-size: 20px;

		font-family: verdana, arial, sans-serif;

		}

...and what i would love to have is the text centered both horizontally and vertically in this box.
does anyone have any ideas?
thanks in advance!"

vertical-align: middle;
text-align: centre;

This should work - in other browsers setting the margins to auto is said to be the way to centre things but doesn't work in IE5.5/Win.

Emps

"I like long posts, that's why i admire Emperor Posts!!" (Wakkos)