jdaues
asked on
forms spacing
given the html below, how do i get the check boxes to be closer together vertically?
<html>
<head>
<title>forms - miscellaneous</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div id="Layer1" style="position:absolute; width:550px; height:260px; z-index:1; left: 98px; top: 31px">
<table width="533" border="0" cellspacing="0" cellpadding="0" height="392">
<tr>
<td>
<form name="form1" >
<input type="checkbox" name="checkbox" value="checkbox">
box1
</form>
</td>
</tr>
<tr>
<td>
<form name="form2" >
<input type="checkbox" name="checkbox2" value="checkbox">
box 2
</form>
</td>
</tr>
<tr>
<td>
<form name="form3" >
<input type="checkbox" name="checkbox3" value="checkbox">
box3
</form>
</td>
</tr>
<tr>
<td>
<form name="form4" >
<input type="checkbox" name="checkbox4" value="checkbox">
box4
</form>
</td>
</tr>
<tr>
<td>
<form name="form5" >
<input type="checkbox" name="checkbox5" value="checkbox">
box5
</form>
</td>
</tr>
<tr>
<td>
<form name="form6" >
<input type="checkbox" name="checkbox6" value="checkbox">
box6
</form>
</td>
</tr>
<tr>
<td>
<form name="form7" >
<input type="checkbox" name="checkbox7" value="checkbox">
box7
</form>
</td>
</tr>
</table>
</div>
<div id="Layer2" style="position:absolute; width:558px; height:45px; z-index:2; left: 98px; top: 441px">
<form name="form8" >
<input type="submit" name="Submit" value="Get Forms">
<input type="reset" name="Submit2" value="Reset">
</form>
</div>
</body>
</html>
<html>
<head>
<title>forms - miscellaneous</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div id="Layer1" style="position:absolute; width:550px; height:260px; z-index:1; left: 98px; top: 31px">
<table width="533" border="0" cellspacing="0" cellpadding="0" height="392">
<tr>
<td>
<form name="form1" >
<input type="checkbox" name="checkbox" value="checkbox">
box1
</form>
</td>
</tr>
<tr>
<td>
<form name="form2" >
<input type="checkbox" name="checkbox2" value="checkbox">
box 2
</form>
</td>
</tr>
<tr>
<td>
<form name="form3" >
<input type="checkbox" name="checkbox3" value="checkbox">
box3
</form>
</td>
</tr>
<tr>
<td>
<form name="form4" >
<input type="checkbox" name="checkbox4" value="checkbox">
box4
</form>
</td>
</tr>
<tr>
<td>
<form name="form5" >
<input type="checkbox" name="checkbox5" value="checkbox">
box5
</form>
</td>
</tr>
<tr>
<td>
<form name="form6" >
<input type="checkbox" name="checkbox6" value="checkbox">
box6
</form>
</td>
</tr>
<tr>
<td>
<form name="form7" >
<input type="checkbox" name="checkbox7" value="checkbox">
box7
</form>
</td>
</tr>
</table>
</div>
<div id="Layer2" style="position:absolute; width:558px; height:45px; z-index:2; left: 98px; top: 441px">
<form name="form8" >
<input type="submit" name="Submit" value="Get Forms">
<input type="reset" name="Submit2" value="Reset">
</form>
</div>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
this doesn't work for text fields, neither does absheight.
five points down the tube :(
five points down the tube :(
what's wrong? maybe i can help
ok thanks,
i have a background graphic and want to overlay form fields in a new layer on top that line up with the horizontal strips on the image:
it works for text/graphics, etc but the text fields have a larger space underneath that i can't find a tag for:
example row
<tr>
<td width="27%" absheight="36" valign="top" align=left>
<font face="Helvetica" size="+1" color="#101010" >van</font>
</td>
<td width="75%" absheight="36" valign="center">
<form action="url">
<input type="text" name="textfield3" size="30" value="janjansen@chello.nl
</form>
</td>
</tr>
i have a background graphic and want to overlay form fields in a new layer on top that line up with the horizontal strips on the image:
it works for text/graphics, etc but the text fields have a larger space underneath that i can't find a tag for:
example row
<tr>
<td width="27%" absheight="36" valign="top" align=left>
<font face="Helvetica" size="+1" color="#101010" >van</font>
</td>
<td width="75%" absheight="36" valign="center">
<form action="url">
<input type="text" name="textfield3" size="30" value="janjansen@chello.nl
</form>
</td>
</tr>
ok thanks,
i have a background graphic and want to overlay form fields in a new layer on top that line up with the horizontal strips on the image:
it works for text/graphics, etc but the text fields have a larger space underneath that i can't find a tag for:
example row
<tr>
<td width="27%" absheight="36" valign="top" align=left>
<font face="Helvetica" size="+1" color="#101010" >van</font>
</td>
<td width="73%" absheight="36" valign="top">
<form action="url">
<input type="text" name="textfield3" size="30" value="janjansen@chello.nl
</form>
</td>
</tr>
i have a background graphic and want to overlay form fields in a new layer on top that line up with the horizontal strips on the image:
it works for text/graphics, etc but the text fields have a larger space underneath that i can't find a tag for:
example row
<tr>
<td width="27%" absheight="36" valign="top" align=left>
<font face="Helvetica" size="+1" color="#101010" >van</font>
</td>
<td width="73%" absheight="36" valign="top">
<form action="url">
<input type="text" name="textfield3" size="30" value="janjansen@chello.nl
</form>
</td>
</tr>
Well, the only reason I can think of is cellspacing="0" cellpadding="0", which should help, but it may be browser dependent, but I really honestly don't know.
yes i,ve done that
thanks anyway
no problem
thanks anyway
no problem
<html>
<head>
<title>forms - miscellaneous</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div id="Layer1" style="position: absolute; width: 550; height: 171; z-index: 1; left: 98; top: 31">
<table width="533" border="0" cellspacing="0" cellpadding="0" height="148">
<tr>
<td height="22">
<form name="form1" >
<input type="checkbox" name="checkbox" value="checkbox">
box1
</form>
</td>
</tr>
<tr>
<td height="26">
<form name="form2" >
<input type="checkbox" name="checkbox2" value="checkbox">
box 2
</form>
</td>
</tr>
<tr>
<td height="19">
<form name="form3" >
<input type="checkbox" name="checkbox3" value="checkbox">
box3
</form>
</td>
</tr>
<tr>
<td height="17">
<form name="form4" >
<input type="checkbox" name="checkbox4" value="checkbox">
box4
</form>
</td>
</tr>
<tr>
<td height="16">
<form name="form5" >
<input type="checkbox" name="checkbox5" value="checkbox">
box5
</form>
</td>
</tr>
<tr>
<td height="24">
<form name="form6" >
<input type="checkbox" name="checkbox6" value="checkbox">
box6
</form>
</td>
</tr>
<tr>
<td height="24">
<form name="form7" >
<input type="checkbox" name="checkbox7" value="checkbox">
box7
</form>
</td>
</tr>
</table>
</div>
<div id="Layer2" style="position:absolute; width:558px; height:45px; z-index:2; left: 98px; top: 441px">
<form name="form8" >
<input type="submit" name="Submit" value="Get Forms">
<input type="reset" name="Submit2" value="Reset">
</form>
</div>
</body>
</html>