Solved

forms spacing

Posted on 2000-04-14
8
193 Views
Last Modified: 2010-04-09
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>
0
Comment
Question by:jdaues
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
8 Comments
 
LVL 11

Accepted Solution

by:
thunderchicken earned 50 total points
ID: 2716748
use td height...

---------------------------------------
<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>
0
 
LVL 11

Expert Comment

by:thunderchicken
ID: 2716750
sorry... pasted the wrong thing  =)

<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>


0
 

Expert Comment

by:we_evil
ID: 2954031
this doesn't work for text fields, neither does absheight.

five points down the tube :(

0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 11

Expert Comment

by:thunderchicken
ID: 2954045
what's wrong?  maybe i can help
0
 

Expert Comment

by:we_evil
ID: 2954091
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>  
0
 

Expert Comment

by:we_evil
ID: 2954105
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>  
0
 
LVL 11

Expert Comment

by:thunderchicken
ID: 2954161
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.
0
 

Expert Comment

by:we_evil
ID: 2954183
yes i,ve done that
thanks anyway
no problem
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

737 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question