CSS styling af <ul> og <li>

Hej,

Jeg er løbet ind i lidt problemer. Hvordan undgår jeg at min "kasse" bliver rykket ind når jeg bruger <ul> <li>? Jeg tror jeg styler det lidt forkert... 

Min HTML kode:

<li class="cat">
<ul>
<?php wp_list_categories('title_li='); ?>
</ul>
</li>

---------------------------------------------------------

Min CSS:

.cat li {list-style:none; border-bottom:4px solid #FFFFFF;}

.cat li a:link, .cat li a:visited {
    background:#f0f7ef;
    display:block;
    padding:4px 4px 4px 6px;
    border-right:4px solid #bed4bb;}
       
.cat li a:hover, .cat li a:active {background:#e7f1e6;}

.cat li li a:link, .cat li li a:visited {border-left:none}