View Single Post
  #1  
Old 03-12-2006, 12:23 PM
 
cotc2001 cotc2001 is offline
 

X-Man
  
Join Date: Feb 2003
Location: Shrewsbury, UK
Posts: 2,351
 

Default Aligning two forms next to each other

Ok its sunday and I have got brain drain.

What im trying to do is align two differnent forms with one drop down field in them next to each other on the same line.

If you look at http://www.justhom.com and see "choose a size" OR "choose a range" you will see that they are aligned correctly

it works but im trying to make it so that it is valid html which at the moment it's not

this is the code

Code:
<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <form name="form_sizes" method="post" action="sizes.php"> <td width="90%" align="right" valign="middle"> <select name="size_variant" onchange="if (this.value !== '0' )(document.location.href='http://www.justhom.com/sizes.php?size='+this.value)"> <option value="0">Choose your size</option> <option value="w30" {if $size_xx=='w30'}selected{/if}>waist 30 (XS)</option> <option value="w32" {if $size_xx=='w32'}selected{/if}>waist 32 (S)</option> <option value="w34" {if $size_xx=='w34'}selected{/if}>waist 34 (M)</option> <option value="w36" {if $size_xx=='w36'}selected{/if}>waist 36 (L)</option> <option value="w38" {if $size_xx=='w38'}selected{/if}>waist 38 (XL)</option> <option value="w40" {if $size_xx=='w40'}selected{/if}>waist 40 (XXL)</option> <option value="c38" {if $size_xx=='c38'}selected{/if}>chest 38 (XS)</option> <option value="c40" {if $size_xx=='c40'}selected{/if}>chest 40 (S)</option> <option value="c42" {if $size_xx=='c42'}selected{/if}>chest 42 (M)</option> <option value="c44" {if $size_xx=='c44'}selected{/if}>chest 44 (L)</option> <option value="c46" {if $size_xx=='c46'}selected{/if}>chest 46 (XL)</option> <option value="c48" {if $size_xx=='c48'}selected{/if}>chest 48 (XXL)</option> </select> OR </td> </form> <td width="0" align="right"> <form name="form_manuf" method="get" action="manufacturers.php" style="margin-bottom:0;"> <select name="manufacturerid" onChange="document.form_manuf.submit()"> <option value="0" selected>Choose a Range</option> {section name=mid loop=$manufacturers_menu} <option value="{$manufacturers_menu[mid].manufacturerid}" {if $manufacturerid==$manufacturers_menu[mid].manufacturerid} selected {/if}>{$manufacturers_menu[mid].manufacturer}</option> {/section} </select> </form> </td> </tr> </table>

As you can see the first part puts the form before the opening TD which is not correct (validation wise) but if I put it after the first <TD> then it throws the alingments of the forms out of sync and places one on the same line but higher than the other.

I know i've worked this out before (i think it was with CSS) but can't remember for the life of me how I did it.

Anyone got any clues??? im just working through the validation step by step and im stuck at this point
__________________
x-cart 4.0.5 (live and heavily modded)
Server: freebsd
Reply With Quote