CSS Problemchen bei Kategorienanzeige

[catrist]

Meine Navigation wird per CSS gesteuert, und sieht momentan so aus, dass die Kategorien und Unterkategorien direkt untereinander stehen.

Ich hätte es aber gerne einfach ein Stück eingerückt, so dass man sieht, dass die Unterkategorie zur Hauptkategorie gehört.

Die Unterkategorie soll also einfach im Vergleich zur Hauptkategorie z.B. 2 Zeichen nach rechts gerückt sein.

Kann ja eigentlich nicht so schwer sein, aber ich kämpfe seit einer Woche mit folgendem CSS rum, um es so hinzubekommen:

#nav-secondary, #nav-secondary ul {position:static}

#nav-secondary, #nav-secondary li {list-style: none;margin:0;padding:0;background:#fff}

#nav-secondary {padding-top:0;border-top: 1px solid #ccc;margin-top: 1px}

#nav-secondary a {line-height:1.8;padding: 5px 0 5px 23px;background: #fff url("img/sprites.gif") no-repeat 10px -695px;font: bold 86% arial;display:block}

#nav-secondary a, #nav-secondary a:link, #nav-secondary a:visited, #nav-secondary a:hover, #nav-secondary a:active {text-decoration:none;cursor:pointer}

#nav-secondary a:link {color:#000}

#nav-secondary a:visited {color:#000}

#nav-secondary a:hover {color:#c00;background: #fee url("img/sprites.gif") no-repeat 10px -695px}

#nav-secondary li.active a:link, #nav-secondary li.active a:visited, #nav-secondary li.active a:hover, #nav-secondary li.active a:active {color:#cff}

#nav-secondary li {border-top: 1px solid #fff;border-bottom: 1px solid #ccc}

#nav-secondary ul {margin: 0 0 1em 23px;padding:0}

#nav-secondary li.active li a, #nav-secondary li.active li a:link, #nav-secondary li.active li a:visited {line-height:1.5;background: #fff url("img/sprites.gif") no-repeat 0 -798px;padding:0 0 0 12px;font-weight:normal;width:auto;color:#000;width:130px;display:block}

#nav-secondary li.active li a:hover, #nav-secondary li.active li a:active {color: #c00}

#nav-secondary li.active li {border: none;margin:0}

#nav-secondary li.active li.active a:link,

#nav-secondary li.active li.active a:visited,

#nav-secondary li.active li.active a:hover,

#nav-secondary li.active li.active a:active {font-weight:bold}

#nav-secondary ul ul {margin: 0 0 1em 13px;padding:0}

#nav-secondary li.active li.active li a, #nav-secondary li.active li.active li a:link, #nav-secondary li.active li.active li a:visited {width:117px}

#nav-secondary li.active li.active li a:link,

#nav-secondary li.active li.active li a:visited,

#nav-secondary li.active li.active li a:hover,

#nav-secondary li.active li.active li a:active {font-weight:normal}

#nav-secondary li.active li.active li.active a:link,

#nav-secondary li.active li.active li.active a:visited,

#nav-secondary li.active li.active li.active a:hover,

#nav-secondary li.active li.active li.active a:active {font-weight:bold}

#nav-secondary ul ul ul {margin: 0 0 1em 13px;padding:0}

#nav-secondary li.active li.active li.active li a, #nav-secondary li.active li.active li.active li a:link, #nav-secondary li.active li.active li.active li a:visited {width:104px}

#nav-secondary li.active li.active li.active li a:link,

#nav-secondary li.active li.active li.active li a:visited,

#nav-secondary li.active li.active li.active li a:hover,

#nav-secondary li.active li.active li.active li a:active {font-weight:normal}

#nav-secondary li.active li.active li.active li.active a:link,

#nav-secondary li.active li.active li.active li.active a:visited,

#nav-secondary li.active li.active li.active li.active a:hover,

#nav-secondary li.active li.active li.active li.active a:active {font-weight:bold}

Kann mir jemand einen Tipp geben, wo ich da ansetzen muss???