vertical-align in absolutely positioned element

Forum Moderators: not2easy

Message Too Old, No Replies

vertical-align in absolutely positioned element

hbmehta

10:14 pm on Mar 15, 2010 (gmt 0)

Hi,

I have an absolutaly positioned TD and vertical-align, valign nothing works to make text vertically aligned in middle except padding. If TD is not absolutaly aligned then there is no problem. Is there any other way than using padding to vertically align the text?

Thanks in advance.

Can refer this sample code.

[codes]
<html>
<body>
<table width="200px" height="200px">
<tr width="100%" height="100px">
<td width="100%" height="100%" style="position:absolute;top:200;left:400;border:1px solid black;vertical-align:middle" valign="center">
HI
</td>
</tr>
<tr width="100%" height="100px">
<td width="100%" height="100%" style="border:1px solid black">
Hello
</td>
</tr>

</table>
</body>
</html>
[/codes]

TheJAG

8:15 pm on Mar 17, 2010 (gmt 0)

I'm not sure what your trying to do but there is no center value to the valign attribute.
The vertical-align:middle; css works just fine for aligning the text vertically.
It's the same as using valign="middle".

If you wanted the text centred horizontally just use text-align:center; in css or align="center" attribute.

There is no need to use both css and html attributes.

hbmehta

8:31 pm on Mar 17, 2010 (gmt 0)

Thanks for the reply. I know that value is middle for valign. May be I didnt wrote the question clearly.

Whenever we use any element with absolute positioning. valign, vertical-align dont work with that(Child elment always stays on Top by default). If we want to vertically align its child element to middle, we have use either padding or margin. I just wants to know if there is any other way than padding or margin as sometimes it affects other element's text also.

Thanks and Regards,
Hardik

TheJAG

9:11 pm on Mar 17, 2010 (gmt 0)

Okay, I see.
Just let me say: "How odd..."
I've never encountered a problem like that before, it was almost shocking when I saw it. I'm sorry to say however that I have no idea how to fix it other then using margin or padding. Sorry I couldn't be of any help.

hbmehta

9:27 pm on Mar 17, 2010 (gmt 0)

Thats ok...no need to say sorry...I was just trying to figure out if there is any better way...