Forum Moderators: not2easy

Message Too Old, No Replies

Getting rid of white space before/after <ul>

looking for a css solution

         

Timmie

4:26 pm on Feb 26, 2004 (gmt 0)

10+ Year Member



Hi, I have a problem with this navigation table: i'm using the list tag to layout the table, but i get a lot of white space before or after every list. Any idea how I can get rid of this using css (see below)? Thanks a lot!

<tr>
<td>
<ul class="navhead">
<li>Voor Iedereen</li>
</ul></td>
</tr>
<tr>
<td>
<ul class="navlist">
<li><a href="#" class="nav2">Wat is de Federatie?</a></li>
<li><a href="#" class="nav2">Ik zoek een psycholoog</a></li>
<li><a href="#" class="nav2">Wetgeving en Ethiek</a></li>
<li><a href="#" class="nav2">Advertenties</a></li>
<li><a href="#" class="nav2">Links</a></li>
</ul></td>
</tr>

.navlist {
line-height: 15px;
letter-spacing: -1px;
list-style-type: none;
padding: 0;
margin-left: 10;

choster

5:29 pm on Feb 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Timmie, welcome to WebmasterWorld!

The whitespace derives from two things: <ul> is a block element, which renders in most browsers with a margin above and below, and you did not specify a unit for your margin-left, which may lead to unpredictable results-- a unit type is required unless it is zero. How does this CSS work for you?

.navlist, .navhead {
margin:0;
padding:0;}

.navlist {
line-height: 15px;
letter-spacing: -1px;
list-style-type: none;
margin-left: 10px;}

Timmie

6:00 pm on Feb 26, 2004 (gmt 0)

10+ Year Member



thanks a lot! It looks nicer now. I think I should read some more about margin/padding/margin-left etc... They seem to have some effects I didn't know of..

t.