CSS Forum

**raptrex** · 08-04-2007, 01:54 PM

i have a list that i want padded, but it also adds padding above the h3 which i dont want

HTML Code:

<div id="primary" class="sidebar">
<li id="pages" class="box">
                <h3>Pages</h3>

                <ul>
<li class="page_item"><a href="http://localhost/wordpress/index.php/about/" title="About">About</a></li>
<li class="page_item"><a href="http://localhost/wordpress/index.php/test/" title="test">test</a></li>
                </ul>
            </li>
        </div>

HTML Code:

div.sidebar div,div.sidebar h3,div.sidebar ul,div.sidebar li{margin:0;padding:0;}
div.sidebarinner{width:150px}
div.sidebar h3{font-size:1.2em;background-color:#2d2d2d;text-align:center;padding:3px 0 3px 0;}
div.sidebar input#s{width:7em;}
div.sidebar li{list-style:none;margin:0 0 1em;background-color:#404040;padding:5px 0 5px 0;}
div.sidebar li form{margin:0.2em 0 0;padding:0;}
div.sidebar ul ul{margin:0 0 0 1em;}
div.sidebar ul ul li{list-style: none;margin:0;}
div.sidebar ul ul ul{margin:0 0 0 0.5em;}
div.sidebar ul ul ul li{list-style-type: disc;}
div.sidebar .box{border:1px solid #202020;}

is there any way i can get rid of the padding above the h3

**JamieLewis** · 02:59 PM

Use the correct tags!!! Try using this HTML instead:

Code:

<div id="primary" class="sidebar">
<div id="pages" class="box">
                <h3>Pages</h3>

                <ul id="pagesList">
<li class="page_item"><a href="http://localhost/wordpress/index.php/about/" title="About">About</a></li>
<li class="page_item"><a href="http://localhost/wordpress/index.php/test/" title="test">test</a></li>
                </ul>
            </div>
        </div>

and for the CSS just use:

Code:

#pagesList{
padding: 3px;
}

Or however much padding you need

**tripy** · 08-04-2007, 02:58 PM

Just one tiny adjustement; it's <ul id=; not <ul if=

Code:

<div id="primary" class="sidebar">
<div id="pages" class="box">
                <h3>Pages</h3>

                <ul id="pagesList">
<li class="page_item"><a href="http://localhost/wordpress/index.php/about/" title="About">About</a></li>
<li class="page_item"><a href="http://localhost/wordpress/index.php/test/" title="test">test</a></li>
                </ul>
            </div>
        </div>

**JamieLewis** · 08-04-2007, 02:59 PM

So it is, nice spot. I really am no good at proof reading.

Jamie

**raptrex** · 08-04-2007, 03:13 PM

thx guys it works!