Text aligning

T

tshad

I am curious as to why HTML doesn't line up the objects in a cell the way
you ask. Each object seems to be dependant on the other.

For example, in the following code:
********************************************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 transitional//EN">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body id="myBody">
<form name="addForm" method="post" action="resumeSubmit.aspx" id="addForm">
<table width="612" border="1" >
<tr>
<td style="vertical-align:top" nowrap>&nbsp;
Resume Title: <input name="ResumeTitle" type="text" value="DataBase
Administrator 3" size="45" id="ResumeTitle" />
</td>
</tr>
</table>
</form>
</body>
</html>
*******************************************************************

The way this seems to work is that the text is always in the middle of the
textbox. So the textbox goes to the top and the text will still be at the
middle of the textbox. If you delete the textbox, the text moves to the top
of the cell.

If you have an image, the bottom of the image will be at the bottom of the
text (which puts the text at the bottom of the image). The if there is a
text box, that will be a little bit lower (as the text is always at the
middle of the textbox).

Now you can change the valign (or vertical-align) to (top, bottom middle,
baseline etc) and all will move as one. If you say top, the image will go
to the top of the box and all the other objects will be in relation to the
image (as specified before). If you say valign="Bottom", the textbox will
go to the bottom (as it is the lowest object) and everything will move in
relation to that.

The problem is I want to put all all the objects in the middle so that the
text will be in the middle (but next to) the image and the text box at the
middle of the text box.

Is there anyway to do this without putting each in their own cell?

This is actually part of a data table where I want to put text and an image
as well as a text box for editing the data.

Thanks,

Tom
 
D

David Dorward

tshad said:
I am curious as to why HTML doesn't line up the objects in a cell the way
you ask. Each object seems to be dependant on the other.

For example, in the following code:
********************************************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 transitional//EN">

4.01 Transitional Doctype with no URL. This will trigger Quirks mode in many
browsers.
<td style="vertical-align:top" nowrap>&nbsp;

Rather pointless non-breaking space there.
Resume Title: <input name="ResumeTitle" type="text" value="DataBase
Administrator 3" size="45" id="ResumeTitle" />

Weird mix of XHTML and HTML style syntax here.
The way this seems to work is that the text is always in the middle of the
textbox. So the textbox goes to the top and the text will still be at the
middle of the textbox. If you delete the textbox, the text moves to the
top of the cell.

The text and the input are set out in a line. That line is an anonymous
inline box. It is that box which is aligned to the top of the cell.

The trick is to apply the vertical-align property to the input and position
it on the line (in that anonymous inline block).
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
474,000
Messages
2,570,252
Members
46,848
Latest member
CristineKo

Latest Threads

Top