Hey everyone! Newby CSS problem for ya . Im using a template for a classic three column css layout. Everything works fine but when I remove the left column and resize the middle column then the right column no longer has everything locked to the top.

vertical-align:top doesnt seem to work to make everything in the right column (atm just a search bar) stay at the top. Any suggestions? I also tried top: 160px;

Thnx

vertical-align:top doesnt seem to work to make everything in the right column (atm just a search bar) stay at the top.

That's because it doesn't work like it does in tables, it refers to the baseline of text only.

top:160px would only work if the element was relatively or absolutely positioned.

W/o see all the code, it's impossible to figure out what's wrong.

Thanks for the comments. Heres some related code:

<div class="floatRight width25">
<form name="contactform" action="search.php" method="get">
<b>Search our database.</b>
<input type="text" name="searchfield" style="width:100%">
<input type="submit" name="search">
</form>
</div>

.width25 {
  width: 24%;
}
.floatRight {
  float: right;
}

Hope that helps deciphering my problem. Thanks

and vertical-align applies to inline elements only

http://www.candsdesign.co.uk/referen...ertical-align/

Oooo ok. That makes sense. But if I cant use "top" and I cant use vertical-align what would I use?

Without seeing more markup or an example page, I'm guessing that it is a float issue. I know if you have the right column floated, but nothing else floated, the right column would go to the top.

Ok I will look into that thanks.