Hi,

I have a basic unordered list in my site map, with a few sub-indentations:

<ul>


<li>item1</li>
<li>item2</li>
<li>item3</li>
<ul>
<li>sub-itemA</li>
</ul>
<li>item4</li>
<li>item5</li>


</ul>

My problem is that I have a space/break in between sub-item A and regular line item 4. I can't seem to close the space.

My css is simple:

#site-map li {margin-bottom: 0;margin-top: 0 }

What am I missing?

Any help is much appreciated! Thanks!

Member Avatar for ingeva

Hi,

I have a basic unordered list in my site map, with a few sub-indentations:

<ul>
<li>sub-itemA</li>
</ul>

My problem is that I have a space/break in between sub-item A and regular line item 4. I can't seem to close the space.

My css is simple:

#site-map li {margin-bottom: 0;margin-top: 0 }

What am I missing?

I think you should take a look at the margins defined for <ul> as well as <li>.

therefore the padding value might be something other than 0

<ul>
<li>item1</li>
<li>item2</li>
<li>item3
<ul>
<li>sub-itemA</li>
</ul>
</li>
<li>item4</li>
<li>item5</li>
</ul>

This is the rightway of indenting your list. Whenever you have a child-level of a list element, place the child list inside the parent list item.

A ul tag cannot be the direct child of another ul tag. The browser goes into quirks mode if it finds this.

why dont u use this style in the css it will work
ul{margin:0;}
li{margin:0;}

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.