View Full Version : Forms and lists have space below them

10-04-2004, 05:35 PM
All my <form> tags and <li> tags seem to have an extra line of transparent space below them, but only in I.E.

Is this a regular occurence? How can I get rid of it?


#loginbar {
background-color: #B57B46;
width: auto;
padding: 1px;
font: bold 10px Arial, Helvetica, sans-serif;
color: #000000;
margin-bottom: 1px;
text-align: right;
height: 16px;
font-weight: bold;

input.loginbar {
background: #cccccc;
color: #000000;
border: 1px solid #000000;
font: bold 10px Arial, Helvetica, sans-serif;
height: 14px;
width: 50px;
vertical-align: middle;


<div id="loginbar">
<form name="login" method="post" action="index.php?process=login">
<input name="u" type="text" class="loginbar" />
<input name="p" type="password" class="loginbar" />
<input name="l" type="submit" class="loginbar" value="Login" />

10-04-2004, 09:54 PM
Try applying margin-bottom: 0; and padding-bottom: 0; to the elements.

10-05-2004, 04:51 PM
Hmmpft... Didn't work, If anyone is interested the site can be found at http://www.veneratiohq.org/index.php

I know the coding is probably terrible, and the page looks terrible... but its only for a few friends I know, so I'll pretty it up once it works.

Any other ideas?

10-05-2004, 04:54 PM
mysql error

Warning: mysql_connect(): Access denied for user: 'newmand2_arbiter@localhost' (Using password: YES) in /home/newmand/public_html/conn.php on line 5
Unable to connect to MySQL

10-05-2004, 05:05 PM
sorry about that... I was in the middle of switching servers - all works fine now


10-05-2004, 06:11 PM
IE mishandles whitespace on li elements.

Try removing whitespace after </li> like so:

<li>List Item</li><li>
List Item</li><li>
List Item</li><li>
List Item</li><li>
List Item</li><li>
List Item</li><li>
Last Item</li>

It's sort of ugly, but it works :)

10-05-2004, 06:43 PM
Thanks :) worked a treat...

Can I do anything about the <form> tag?

10-05-2004, 07:06 PM
The form tag's spacing is probably just a margin. Also, check that it's not the margin of a containing element that's pouring out.

If form { margin: 0; } doesn't fix it, but form * { margin: 0; } does, then it's something inside it.

10-05-2004, 07:28 PM
Thanks so much :)

however... i seem to have an extra 'thing' below the menu... the other blue bar thing? I'm guessing its the whitespace again?

10-05-2004, 07:47 PM
I left it as:


But you may want to make it


Might fix it?

10-05-2004, 08:02 PM
thanks - sorted it just as you posted :)

thanks for the help everyone