form styling...

[ToonMariner]

Ok this is boring me now....

here is the relevant html...
[code] <form action="/delegate_reg.php" method="post" enctype="application/x-www-form-urlencoded" name="delreg" id="delreg">
<div id="dcont">
<div class="deldiv" id="del0">
<label for="name[0]"><span class="req">*</span>Delegate Name:</label><input type="text" name="name[0]" id="name[0]" value="" /><br />
<label for="phone[0]"><span class="req">*</span>Telephone:</label><input type="text" name="phone[0]" id="phone[0]" value="" /><br />
<label for="fax[0]">Fax:</label><input type="text" name="fax[0]" id="fax[0]" value="" /><br />

<label for="email[0]"><span class="req">*</span>Email:</label><input type="text" name="email[0]" id="email[0]" value="" /><br />
<div style="clear:both">
<label for="address[0]"><span class="req">*</span>Postal Address:</label><textarea name="address[0]" id="address[0]"></textarea>
<label class="indent"><input type="radio" name="correspondee" value="0" checked="checked" />Use as Correspondee</label><br />
</div>
<label for="postcode[0]"><span class="req">*</span>Postcode:</label><input type="text" name="postcode[0]" id="postcode[0]" value="" /><br />

</div>
<div class="clear"></div>
</div>
<a href="javascript:tccAddDel();" title="Add Image">Add Another Delegate</a>
<br />
<input type="submit" class="bttn" name="submit" id="submit" value="Next" />
</form>[/code]
and here is the relevant css...
[code]form#delreg
{
width: 765px;
}

#delreg.deldiv
{
border: 1px solid #939598;
}

#delreg label ,
#delreg input ,
#delreg textarea
{
margin: 5px 10px;
clear: right;
}

#delreg label
{
float: left;
clear: left;
width: 130px;
text-align: right;
}

#delreg .bttn
{
margin: 10px;
}

label.indent
{
float: none;
display: inline;
}[/code]

what I want is the 'use as correspondee' radio button to display on the right of the textarea.

You will also notice that IE pushes the postcode text input down past the textarea and radio button where as FF doesn't.

Its driving me mad!!!

OH the url if you want a look
[url=http://www.buildingschools.co.uk/delegate_reg.php]http://www.buildingschools.co.uk/delegate_reg.php[/url]

[KevinM1]

This should work.  The 'Use as correspondee' text isn't quite even with the radio button, though.

CSS:
[code]
form#delreg{
  width: 765px;
}

fieldset{
  border: 1px solid #939598;
}

#delreg label, #delreg input, #delreg textarea{
  margin: 5px 10px;
  float: left;
}

#delreg label{
  float: left;
  width: 130px;
  text-align: right;
}

#delreg .bttn{
  margin: 10px;
}

p {
  clear: both;
  margin: 5px;
}
[/code]

HTML:
[code]
<?php
//to get around the security measures that make it hard to post html code on the board
?>

<form action="/delegate_reg.php" method="post" enctype="application/x-www-form-urlencoded" name="delreg" id="delreg">
  <div id="dcont">
      <fieldset>
        <p><label for="name[0]"><span class="req">*</span>Delegate Name:</label><input type="text" name="name[0]" id="name[0]" value="" /></p>
        <p><label for="phone[0]"><span class="req">*</span>Telephone:</label><input type="text" name="phone[0]" id="phone[0]" value="" /></p>
        <p><label for="fax[0]">Fax:</label><input type="text" name="fax[0]" id="fax[0]" value="" /></p>
        <p><label for="email[0]"><span class="req">*</span>Email:</label><input type="text" name="email[0]" id="email[0]" value="" /></p>
        <p><label for="address[0]"><span class="req">*</span>Postal Address:</label><textarea name="address[0]" id="address[0]"></textarea>
        <input type="radio" name="correspondee" value="0" checked="checked" />Use as Correspondee</p>
        <p><label for="postcode[0]"><span class="req">*</span>Postcode:</label><input type="text" name="postcode[0]" id="postcode[0]" value="" /></p>
      </fieldset>
  </div>
  <a href="javascript:tccAddDel();" title="Add Image">Add Another Delegate</a><br />
  <input type="submit" class="bttn" name="submit" id="submit" value="Next" />
</form>

<?php
//one more time for good measure
?>
[/code]

[ToonMariner]

can it be done woithout paragraph tags?

[KevinM1]

[quote author=ToonMariner link=topic=114122.msg464297#msg464297 date=1162916655]
can it be done woithout paragraph tags?
[/quote]

I dunno..maybe.  You could do the same thing by putting them into their own div if you want, but I believe they need some kind of containing element to get the floats to clear properly with everything properly positioned on each line.  And what difference does it make, anyway?  You can change the separation between inputs by playing around with the paragraph's margins.  It's not that much more markup (about the same as what you originally posted with some extraneous divs) and it behaves properly, with the exception of your radio button text being not quite level with the button itself.

[ToonMariner]

apologies for the 'extraneous' divs but they are required for the js that generates extra fields in the form.