Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Can't get the vertical-align:top to work

Reply
Thread Tools

Can't get the vertical-align:top to work

 
 
tshad
Guest
Posts: n/a
 
      05-02-2005
I have the following code:
************************************************** **************************
*
<tr >
<td style="vertical-align:top" >By State:
<select name="ByState" onchange="__doPostBack('ByState','')"
language="javascript" id="ByState" columns="3">
<option selected="selected" value="ALL">All</option>
<option value="AL">AL</option>
<option value="AK">AK</option>
</select>
&nbsp;By City:
<select name="ByCity" size="3" multiple="multiple" id="ByCity"
style="width:160px; border-style:inset">
</select>
</td>
</tr>
************************************************** **************************
****

I am trying to get all the text and labels to go the top of the cell. The
problem is that they go to the bottom of the cell. The ByCity listbox is
the size of 3.

I tried this:

<td style="vertical-align:top" >

And I also tried:

<tr style="vertical-align:top" >

But neither one seems to work.

Thanks,

Tom


 
Reply With Quote
 
 
 
 
Els
Guest
Posts: n/a
 
      05-02-2005
tshad wrote:

> I have the following code:

[snip code snippet]
> I am trying to get all the text and labels to go the top of the cell. The
> problem is that they go to the bottom of the cell. The ByCity listbox is
> the size of 3.


How about a url so that we can see what you're doing wrong?

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -
 
Reply With Quote
 
 
 
 
tshad
Guest
Posts: n/a
 
      05-03-2005
"Els" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> tshad wrote:
>
>> I have the following code:

> [snip code snippet]
>> I am trying to get all the text and labels to go the top of the cell.
>> The
>> problem is that they go to the bottom of the cell. The ByCity listbox is
>> the size of 3.

>
> How about a url so that we can see what you're doing wrong?


Sorry, I thought that would be enough.

I also don't have that code as I worked around it to make it work. Here is
some other examples where I am having similar problems

http://www.payrollworkshop.com/samples/testalign2.htm
http://www.payrollworkshop.com/samples/testalign2.htm
>
> --
> Els http://locusmeus.com/
> Sonhos vem. Sonhos vo. O resto imperfeito.
> - Renato Russo -



 
Reply With Quote
 
tshad
Guest
Posts: n/a
 
      05-03-2005
"tshad" <(E-Mail Removed)> wrote in message
news:Q_Sde.1757$(E-Mail Removed). ..
> "Els" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
>> tshad wrote:
>>
>>> I have the following code:

>> [snip code snippet]
>>> I am trying to get all the text and labels to go the top of the cell.
>>> The
>>> problem is that they go to the bottom of the cell. The ByCity listbox
>>> is
>>> the size of 3.

>>
>> How about a url so that we can see what you're doing wrong?

>


I accidently hit the send button before I finished.

I also don't have that code as I worked around it to make it work. Here is
some other examples where I am having similar problems

http://www.payrollworkshop.com/samples/testalign2.htm
http://www.payrollworkshop.com/samples/testalign3.htm
http://www.payrollworkshop.com/samples/testalign4.htm
http://www.payrollworkshop.com/samples/testalign5.htm

The problem is only in IE. Mozilla and Netscape seem to handle it fine.

In these - the word "First:" is not lined up to the right of the Cell. It
seems either the row above or the row below seem to be affecting it. If I
take out the cell above or below it, it seems to line up fine. Taking out
the "nowrap"s helps, but doesn't solve the problem. I can increase the cell
by a lot and that and that seems to help.

The question is: if it is to be aligned right, why does it end up in the
middle of the cell (testalign2.htm), anyway?

Thanks,

Tom

>>
>> --
>> Els http://locusmeus.com/
>> Sonhos vem. Sonhos vo. O resto imperfeito.
>> - Renato Russo -

>
>



 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      05-04-2005
tshad wrote:

>>>> I have the following code:
>>> [snip code snippet]
>>>> I am trying to get all the text and labels to go the top of the cell.
>>>> The problem is that they go to the bottom of the cell. The ByCity
>>>> listbox is the size of 3.
>>>
>>> How about a url so that we can see what you're doing wrong?

>
> I also don't have that code as I worked around it to make it work. Here is
> some other examples where I am having similar problems
>
> http://www.payrollworkshop.com/samples/testalign2.htm
> http://www.payrollworkshop.com/samples/testalign3.htm
> http://www.payrollworkshop.com/samples/testalign4.htm
> http://www.payrollworkshop.com/samples/testalign5.htm
>
> The problem is only in IE. Mozilla and Netscape seem to handle it fine.
>
> In these - the word "First:" is not lined up to the right of the Cell. It
> seems either the row above or the row below seem to be affecting it. If I
> take out the cell above or below it, it seems to line up fine. Taking out
> the "nowrap"s helps, but doesn't solve the problem. I can increase the cell
> by a lot and that and that seems to help.
>
> The question is: if it is to be aligned right, why does it end up in the
> middle of the cell (testalign2.htm), anyway?


Why don't you use CSS instead of inline HTML styles?
Even if only to apply this rule *{border:1px solid red;}, which shows
that the word First is right aligned in the DIV that you put inside
that TD.
I don't do HTML table layouts, and at first sight I can't figure out
why the DIV doesn't stretch to the right of the TD, but I think it has
to do with a DIV being a block element and leaving some space to the
right of it. If I use CSS to set the width of the DIVs to any size at
all (except %), it instantly stretches to fill the TD.

If you were using CSS, this would be easy (for me)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -
 
Reply With Quote
 
tshad
Guest
Posts: n/a
 
      05-04-2005

"Els" <(E-Mail Removed)> wrote in message
news:14v8o82rg70zw$.eizfxjze7b4d$(E-Mail Removed).. .
> tshad wrote:
>
>>>>> I have the following code:
>>>> [snip code snippet]
>>>>> I am trying to get all the text and labels to go the top of the cell.
>>>>> The problem is that they go to the bottom of the cell. The ByCity
>>>>> listbox is the size of 3.
>>>>
>>>> How about a url so that we can see what you're doing wrong?

>>
>> I also don't have that code as I worked around it to make it work. Here
>> is
>> some other examples where I am having similar problems
>>
>> http://www.payrollworkshop.com/samples/testalign2.htm
>> http://www.payrollworkshop.com/samples/testalign3.htm
>> http://www.payrollworkshop.com/samples/testalign4.htm
>> http://www.payrollworkshop.com/samples/testalign5.htm
>>
>> The problem is only in IE. Mozilla and Netscape seem to handle it fine.
>>
>> In these - the word "First:" is not lined up to the right of the Cell.
>> It
>> seems either the row above or the row below seem to be affecting it. If I
>> take out the cell above or below it, it seems to line up fine. Taking
>> out
>> the "nowrap"s helps, but doesn't solve the problem. I can increase the
>> cell
>> by a lot and that and that seems to help.
>>
>> The question is: if it is to be aligned right, why does it end up in the
>> middle of the cell (testalign2.htm), anyway?

>
> Why don't you use CSS instead of inline HTML styles?
> Even if only to apply this rule *{border:1px solid red;}, which shows
> that the word First is right aligned in the DIV that you put inside
> that TD.
> I don't do HTML table layouts, and at first sight I can't figure out
> why the DIV doesn't stretch to the right of the TD, but I think it has
> to do with a DIV being a block element and leaving some space to the
> right of it. If I use CSS to set the width of the DIVs to any size at
> all (except %), it instantly stretches to fill the TD.
>

Ok.

Here are 3 new pages.

In http://www.payrollworkshop.com/samples/testalign6.htm, I took out the
<div> and I added it to "Last Name". Same result: "First Name" is not right
justified and "Last Name" is.

In http://www.payrollworkshop.com/samples/testalign7.htm, I cut out a bunch
of text from the paragraph and now it lines up. But what is really
happening is that "First Name" is in the same place (like it was absolute
positioned or something) and the cell just got smaller.

In http://www.payrollworkshop.com/samples/testalign8.htm, I used CSS for the
"First Name":

style="text-align:right; vertical-align:bottom"

No affect.

All these pages work correctly (or how I would have expected). I am only
having the problem with IE.

Thanks,

Tom

> If you were using CSS, this would be easy (for me)
>
> --
> Els http://locusmeus.com/
> Sonhos vem. Sonhos vo. O resto imperfeito.
> - Renato Russo -



 
Reply With Quote
 
solitaire
Guest
Posts: n/a
 
      05-09-2005
tshad wrote:
> I have the following code:
> ************************************************** **************************
> *
> <tr >
> <td style="vertical-align:top" >


<td valign=top>

KISS rule in effect.
 
Reply With Quote
 
tshad
Guest
Posts: n/a
 
      05-10-2005
"solitaire" <(E-Mail Removed)> wrote in message
news:6nyfe.3459$941.1627@trnddc08...
> tshad wrote:
>> I have the following code:
>> ************************************************** **************************
>> *
>> <tr >
>> <td style="vertical-align:top" >

>
> <td valign=top>
>
> KISS rule in effect.


This is what I usually do.

The problem is that whenever I do, someone is telling me I should use CSS
styles instead.

I'm not really sure where I should be using CSS and where not.

Tom


 
Reply With Quote
 
Adrienne
Guest
Posts: n/a
 
      05-10-2005
Gazing into my crystal ball I observed "tshad"
<(E-Mail Removed)> writing in
news:n36ge.1150$(E-Mail Removed) :

> "solitaire" <(E-Mail Removed)> wrote in message
> news:6nyfe.3459$941.1627@trnddc08...
>> tshad wrote:
>>> I have the following code:
>>> ************************************************** ********************
>>> ****** * <tr >
>>> <td style="vertical-align:top" >

>>
>> <td valign=top>
>>
>> KISS rule in effect.

>
> This is what I usually do.
>
> The problem is that whenever I do, someone is telling me I should use
> CSS styles instead.
>
> I'm not really sure where I should be using CSS and where not.
>
> Tom
>
>
>


If you remove all the presentation from your markup, then it's pretty easy
to use CSS to style that markup. Of course, the markup has to be valid for
that to work, but that's not that difficult either.

I use two stylesheets, one for positioning, and one for colors. That way,
changing the theme of a site is really, really easy.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
 
Reply With Quote
 
edwatki edwatki is offline
Junior Member
Join Date: Jul 2006
Posts: 1
 
      07-27-2006
Hi,

Ok the problem is your specifying the td width of the firstname field. You need to delete the width.

Change the code to be:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>:: Staffing Workshop ::</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
margin-top: 31px;
}
.style1 {
font-size: 18px;
font-weight: bold;
}
-->
</style>

<style type="text/css">
<!--
.style2 {color: #FF0000}
.style3 {color: #D4D0C8}
.leftlink{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #5C5C5C;
text-decoration: none;
font-weight:bold;
}
.errorMessage{
font-size:8pt;
font-weight:bold;
color:red;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
-->
</style>

</head>

<body>
<table border="0" cellspace="0" cellpadding="0" width="569" >
<tr valign="baseline">
<td colspan="2"><blockquote>
<div align="justify">Please provide us with the following information so that we may create your account. Once you successfully submit the information to StaffingWorkshop, you will receive an email with your temporary login credentials. </div>
</blockquote></td>
</tr>
<tr valign="baseline">
<td align="right" valign="baseline" >First Name:</td>
<td width="420" align="left" >
<input name="firstName" type="text" size="20" id="firstName" />
</td>
</tr>


<div id="Password"> </div>
<div id="retypePassword">
<tr valign="baseline">
<td align="right" valign="middle" ><span class="style2">*</span> Retype Password:</td>
<td align="left" >
<input name="password2" type="password" size="20" id="password2" />
</td>
</tr>
</div>
</table>
</body>
</html>
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
RE;Kontki if you delete kontiki any program you loaded with it in it 'will not work I have tried it with three programs and none work anymore (if you se it just stop download) 1-Twitch Computer Support 5 04-23-2009 02:45 PM
MS work around on text wrapping in a datagrid does not work TB ASP .Net 2 02-22-2006 10:34 PM
Hi I am new to asp i can not get it to work on xp pro sp2 even though the localhost work but asp pages dont so can some one help craig dicker ASP .Net 9 07-07-2005 11:52 AM
Mechanize: Can't get it to work. Can I help make it work next week? Xeno Campanoli Ruby 1 07-01-2005 10:32 PM



Advertisments