Alignment problem in the third row

liunx

Guest
I wanted to have the content of the third row, which is a button called "Go" to be on the extreme left edge of the column. So, I use <TD align="LEFT"> property. But the button won't move to the left. If I change the button to a text, it gives the desired affect.<br />
<br />
Any comments?<br />
<br />
<br />
<br />
<TABLE BGCOLOR="White" border=0 cellpadding=0><br />
<TR><br />
<TD COLSPAN=3><br />
<H2>&nbsp&nbsp&nbsp&nbsp&nbsp<U>Using this application you can access Avalon Patent database and:</U></H2><br />
</TD><br />
</TR><br />
<TR valign="TOP"><br />
<TD align="LEFT"><br />
<LI><H3>Search by Avalon Gene ID</H3></L1><br />
</TD><br />
<TD align="LEFT"><br />
<input type=text name="GeneID"><br />
</TD><br />
<TD align="LEFT"><br />
<input type="button" value="Go"><br />
</TD><br />
</TR><br />
</TABLE><!--content-->try this<br />
<TABLE BGCOLOR="White" border=0 cellpadding=0 width="711"><br />
<TR><br />
<TD COLSPAN=3 width="705"><br />
<H2>&nbsp&nbsp&nbsp&nbsp&nbsp<U>Using this application you can access Avalon Patent database and:</U></H2><br />
</TD><br />
</TR><br />
<TR valign="TOP"><br />
<TD align="LEFT" width="99"><br />
<LI><H3>Search by Avalon Gene ID</H3></L1><br />
</TD><br />
<TD align="LEFT" width="161"><br />
<input type=text name="GeneID" size="20" style="text-align: left"><br />
</TD><br />
<TD align="LEFT" width="437"><br />
<input type="button" value="Go" style="float: left; text-align: left"><br />
</TD><br />
</TR><br />
</TABLE><br />
<br />
its just an attempt ... lol if u dont need it nevemind LOL<!--content-->Well, this works and by manipulating the width="xx" numbers I can adjust the columns as well.<br />
<br />
But is there a way to get the same effect without hardcoding the numbers in the HTML code?<br />
<br />
Thanks.<!--content-->First of all, don't forget to quote all of your values (e.g. border="0").<br />
<br />
According to the code you posted, your "GO" button is aligned to the left as wished. Temporarily change the border value to "1" and you'll see it.<br />
<br />
Are you wanting the "GO" button to be aligned directly next to the text field?<br />
<br />
Gandalf<br />
:D<!--content-->Yes Gandalf. Thanks. So, now the question is how do I make the second column to be exactly the size of the text box.<br />
<br />
In other words <br />
"Are you wanting the "GO" button to be aligned directly next to the text field?" : YES.<!--content-->I haven't had my first cup of coffee yet, so you'll pardon me if I don't seem to bright, but how can you have a list item without having a list? That is what the <li></li> tag is for, isn't it? List items? <br />
<br />
And why bother left aligning a table? The default, the alignment you get when you don't chose an alignment, is "left". Isn't it? <br />
<br />
<sigh> Or have the changed the HTML rules **again**?<br />
<br />
Peg<!--content--><table bgcolor="white" border=0 cellpadding=0><br />
<tr><br />
<td colspan=3><br />
<h2><u>using this application you can access avalon patent database and:</u></h2><br />
</td><br />
</tr><br />
<tr align="left" valign="top"><br />
<td style="width:30%;" align="left"><br />
<li><h3>search by avalon gene id</h3></l1><br />
</td><br />
<td style="width:20%;" align="left"><br />
<input type=text name="geneid"><br />
</td><br />
<td style="width:50%;" align="left"><br />
<input type="button" value="go"><br />
</td><br />
</tr><br />
</table><br />
Red = What is the purpose? <br />
<br />
The bolded code is what I added, most of it being CSS.<!--content-->For more information on alignment issues for the <tr> and <td> and anything else checkout: <!-- m --><a class="postlink" href="http://www.w3schools.com">http://www.w3schools.com</a><!-- m --> <br />
<br />
But please keep posting here...it keeps some of us off the streets. =:O <br />
<br />
Gandalf<br />
:D<!--content-->Thanks all. Gandalf especially. <li> is probably to draw a dot in front of the text. But I am not sure, I think I picked it up from somewhere else. Obviously </l1> was a typo, sorry if I confused someone.<!--content-->If you want to keep the middle dot try this:<br />
<br />
<h3>&middot; search by avalon gene id</h3><br />
<br />
Glad, we could be of help.<br />
Gandalf<br />
:D<!--content-->Oops, that didn't work.<br />
<br />
<h3>&_middot; search by avalon gene id</h3><br />
<br />
Remove the underscore for it to work correctly.<!--content-->uhm i tried this that makes the text area exactly the size of the colum the middle one lol dunno if it helps but i was experimentin lol<br />
<br />
here it is:<br />
<br />
<br />
<table bgcolor="white" border=0 cellpadding=0><br />
<tr><br />
<td colspan=3> <br />
<h2><u>using this application you can access avalon patent database and:</u></h2><br />
</td><br />
</tr><br />
<tr align="left" valign="top"><br />
<td style="width:30%;" align="left"><br />
<li><h3>search by avalon gene id</h3></l1><br />
</td><br />
<td style="width:20%;" align="left"><br />
<input type=text name="geneid" style="width:100%"><br />
</td> <br />
<td style="width:50%;" align="left"><br />
<input type="button" value="go"><br />
</td><br />
</tr><br />
</table><!--content--><form><br />
<table bgcolor="white" border=1 cellpadding=0><br />
<tr><br />
<td colspan=3><h2><u>using this application you can access avalon patent database and:</u></h2></td><br />
</tr><br />
<tr valign="top"><br />
<td style="width:30%;"><ul><li>search by avalon gene id</li></ul></td><br />
<td style="width:20%;"><input type=text name="geneid"></td><br />
<td><input type="button" value="go"></td><br />
</tr><br />
</table><br />
</form><br />
<br />
you guys are forgetting the most important tags. the form tag and the <ul> tags. Peg is correct, by default it aligns left so no need to use it. and yes you have to specify a width if you want it to look the way you want.<br />
<br />
when ever in doubt on how a table looks always turn the borders on.<!--content-->
 
Back
Top