---
title: "Probleme mit der Navi"
url: "https://www.typo3.net/d/53365-probleme-mit-der-navi"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage","HTML & CSS"]
created: "2006-11-14"
last_reply: "2006-11-16"
replies: 13
solved: false
page: 1
pages: 1
lang: "de"
---

# Probleme mit der Navi

TYPO3 › Menüs · 13 Antworten · gestartet 2006-11-14

## Eröffnungsbeitrag

**miami_vice** · 2006-11-14 · [Beitrag #1](https://www.typo3.net/d/53365-probleme-mit-der-navi/1)

möchte eine Navi erstellen...leider hab ich jetzt zwischen dem Bild und dem verlinktem text einen Absatz drin an was kann das liegen???
eigentlich soll der Pfeil direkt an den Text
**hier das Bild:**

[Bild: de-kunde.de/navi_neu.jpg](http://www.de-kunde.de/navi_neu.jpg)

hier **TS**:

```typoscript
tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
  wrap = <div id="mainnavcontainer"> | </div>
  excludeUidList = 7
  1 = TMENU
  1 {
    wrap = <ul> | </ul>
    NO = 1
    NO.linkWrap = <img src="fileadmin/pfeil_white.gif" alt="" />
  }
}
```

und hier das fertige **HTML**

```html
<td width="151" valign="top" class="left_column">
<div id="mainnavcontainer">
<ul>
<img src="fileadmin/pfeil_white.gif" alt="" />
<a href="index.php?id=23" onfocus="blurLink(this);">company</a>
<img src="fileadmin/pfeil_white.gif" alt="" />
<a href="index.php?id=22" onfocus="blurLink(this);">applications</a>
<img src="fileadmin/pfeil_white.gif" alt="" />
<a href="index.php?id=21" onfocus="blurLink(this);">products</a></ul></div>
```

hmm kann hier keinen Absatz erkennen  #paralyzed# und so sollte es eigentlich aussehen...

[Bild: de-kunde.de/navi_neu_1.jpg](http://www.de-kunde.de/navi_neu_1.jpg)

## Antworten

### [#2](https://www.typo3.net/d/53365-probleme-mit-der-navi/2) · just2b · 2006-11-14

Hallo,

wo ist dein li-Tag?!?
NO.wrapItemAndSub = <li>|</li>

dann ists nur noch eine frage vom css. auch den pfeil könnte man als Background vom Link selbst machen

georg

### [#3](https://www.typo3.net/d/53365-probleme-mit-der-navi/3) · miami_vice · 2006-11-14

oha den NO.wrapItemAndSub = <li>|</li> hab ich vergessen ...hat aber keine Auswirkung auf die Darstellung.

Wo geb ich bzw. definiere ich das in der CSS ??

hier mal die CSS

```html
#mainnavcontainer {
	width: 151px;
}

#mainnavcontainer ul
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	
	font-color:#004785;
}
#mainnavcontainer ul li
{
	margin: 0;
	padding: 0;
}

#mainnavcontainer a
{
	display: block;
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	width: 151px;
	border-bottom: 2px solid #fff;
}

html>body #mainnavcontainer a {
	width: 131px;
}


#mainnavcontainer a:link, #mainnavcontainer a:visited
{
	color: #004785;
	text-decoration: none;
}

#mainnavcontainer a:hover
{
	color: #004785;
	font-weight: bold;
	font-size: 12px;
}

#mainnavcontainer a#current{
	background-color: #E7E7E7;
}
```

frag mich nur warum er den Text mittig setzt die Pfeile aber nicht ?

### [#4](https://www.typo3.net/d/53365-probleme-mit-der-navi/4) · just2b · 2006-11-14

in

> #mainnavcontainer a:link, #mainnavcontainer a:visited {
> background:url(...../arrow.gif) no-repeat left;

aber das hat nichts mehr mit typo3 zu tun

georg

### [#5](https://www.typo3.net/d/53365-probleme-mit-der-navi/5) · miami_vice · 2006-11-14

super danke funktioniert jetzt thx.....

wenn ich jetzt die Navi um eine Ebene erweitern möchte also wie hier zu sehen:

[Bild: de-kunde.de/navi_ebene.jpg](http://www.de-kunde.de/navi_ebene.jpg)

wie funktioniert das ???

```typoscript
tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
  wrap = <div id="mainnavcontainer"> | </div>
  1 = TMENU
  1 {
    wrap = <ul> | </ul>
    entryLevel = 1
    NO = 1
    NO.wrapItemmAndSub = <li> | </li>
    ACT = 1
    ACT < .NO
    ACT.ATagParams = id=current
  }
  
  2 < .1
}
```

denn über den **entryLevel** gibt er mir gar nichts aus ???

### [#6](https://www.typo3.net/d/53365-probleme-mit-der-navi/6) · miami_vice · 2006-11-14

funktioniert doch....hatte nur die falschen Ebenen.
Jetzt fehlt mir aber noch ein Einzug so sieht es nämlich {zensiert} aus....

[Bild: de-kunde.de/ebene2.jpg](http://www.de-kunde.de/ebene2.jpg)

und so sollte es aussehen

[Bild: de-kunde.de/navi_ebene.jpg](http://www.de-kunde.de/navi_ebene.jpg)

hier mal das TS:

```typoscript
tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
  wrap = <div id="mainnavcontainer"> | </div>
  1 = TMENU
  1 {
    wrap = <ul> | </ul>
    entryLevel = 2
    NO = 1
    NO.wrapItemmAndSub = <li> | </li>
    ACT = 1
    ACT < .NO
    ACT.ATagParams = id=current
  }
  
  #Die zweite Ebene als kopie der ersten Ebene beschreiben
  2 < .1
  2.NO {
    10.fontSize = 9
    10.fontColor = #061467
    }
  
}
```

und die Schrift macht er mir auch nicht kleiner was er ja eigentlich mit 10.fontSize = 9 machen müsste ???

kann ich eigentlich für die neue Ebene ein extra CSS id anlagen ??
denn

```typoscript
tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
  wrap = <div id="mainnavcontainer"> | </div>
  1 = TMENU
  1 {
    wrap = <ul> | </ul>
    entryLevel = 2
    NO = 1
    NO.wrapItemmAndSub = <li> | </li>
    ACT = 1
    ACT < .NO
    ACT.ATagParams = id=current
  }
  
  #Die zweite Ebene als kopie der ersten Ebene beschreiben
  2 < .1
  wrap = <div id="ebene"> | </div>
  2.NO {
    10.fontSize = 9
    10.fontColor = #061467
    }
  
}
```

zeigt er mir gar nichts an ??

### [#7](https://www.typo3.net/d/53365-probleme-mit-der-navi/7) · miami_vice · 2006-11-15

weiß keiner wie ich in der zweiten Navi Ebene eine neue CSS id einfüge ???? :'(

### [#8](https://www.typo3.net/d/53365-probleme-mit-der-navi/8) · just2b · 2006-11-16

Hallo,

in deinem letzten Code, zeile 17... das sollte wohl heißen:

```typoscript
2.wrap = <ul id="ebene2">|</ul>
```

aber du hättest das ganze auch machen können rein per CSS:
#mainnavcontainer ul { = 1. ul)
#mainnavcontainer ul li ul ( = 2.ul)

georg

### [#9](https://www.typo3.net/d/53365-probleme-mit-der-navi/9) · miami_vice · 2006-11-16

danke thx, er setzt mir jetzt zwar die neue CSS id ebene aber wenn ich an dieser was ändere übernimmt er das irgendwie nicht:

```html
<div id="mainnavcontainer">
<ul>
<a href="index.php?id=23" onfocus="blurLink(this);">company</a>
<a href="index.php?id=22" onfocus="blurLink(this);">applications</a>
<a href="index.php?id=21" onfocus="blurLink(this);" id=current>products</a>
<div id="ebene">
<a href="index.php?id=30" onfocus="blurLink(this);">scan head series</a>
<a href="index.php?id=29" onfocus="blurLink(this);">plug & play</a>
<a href="index.php?id=28" onfocus="blurLink(this);">software</a>
</div>
<a href="index.php?id=20" onfocus="blurLink(this);">download area</a>
<a href="index.php?id=19" onfocus="blurLink(this);">press & news</a>
<a href="index.php?id=18" onfocus="blurLink(this);">contact & service</a>
</ul>
</div>
```

und hier die CSS

```html
#mainnavcontainer {
	width: 151px;
}

#mainnavcontainer ul
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-color:#004785;
}
#mainnavcontainer ul li
{
	margin: 0;
	padding: 0;
}

#mainnavcontainer a
{
	display: block;
	padding-right: 10px;
	padding-left: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	width: 151px;
	border-bottom: 2px solid #fff;
}

html>body #mainnavcontainer a {
	width: 131px;
}


#mainnavcontainer a:link, #mainnavcontainer a:visited
{
	color: #004785;
	text-decoration: none;
	background:url(pfeil.gif) no-repeat left;
}

#mainnavcontainer a:hover
{
	color: #004785;
	font-weight: bold;
	font-size: 11px;
	background:url(kreis_pfeil.gif) no-repeat left;
}

#mainnavcontainer a#current{ 
	color: #004785;
	font-weight: bold;
	font-size: 11px;
	background:url(kreis_pfeil_down.gif) no-repeat left;
	
}

.box_header {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	color: #004785;
	font-weight: bold;
	font-size: 11px;
	padding-right: 10px;
	padding-left: 2px;
	padding-top: 30px;
	padding-bottom: 3px;
}

.loginbox-labelcell, .loginbox-fieldcell, .loginbox-commentcell {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #004785;
	font-size: 11px;
}

.loginbox-fieldcell input {
	padding-right: 50px;
	bgcolor: #004785;
	color: #004785;	
}


.ebene {
	width: 151px;
}

.ebene ul
{
	margin: 50;
	padding: 50;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 5px;
	font-color:#004785;
}
.ebene ul li
{
	margin: 0;
	padding: 0;
}

.ebene a
{
	display: block;
	padding-right: 10px;
	padding-left: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	width: 151px;
}

html>body .ebene a {
	width: 131px;
}


.ebene a:link, #mainnavcontainer a:visited
{
	color: #004785;
	text-decoration: none;
	background:url(pfeil.gif) no-repeat left;
}

.ebene a:hover
{
	color: #004785;
	font-weight: bold;
	font-size: 5px;
	background:url(kreis_pfeil.gif) no-repeat left;
}

.ebene a#current{ 
	color: #004785;
	font-weight: bold;
	font-size: 5px;
	background:url(kreis_pfeil_down.gif) no-repeat left;
	
}
```

er müsste ja jetzt zumindest die Schrift kleiner machen und die weißen Linien weg machen ....???

hier die Ausgabe

[Bild: de-kunde.de/navi_nav.jpg](http://www.de-kunde.de/navi_nav.jpg)

### [#10](https://www.typo3.net/d/53365-probleme-mit-der-navi/10) · just2b · 2006-11-16

Hallo,

also da hast du noch immer einen Fehler:

2.NO.10.fontSize = 9

sowas gibts nicht!

du solltest eher sowas machen

```typoscript
2 = TMENU
2.wrap = <ul id="ebene">|</ul>
2.NO.wrapItemAndSub = <li>|</li>
```

und per css sollte das dann mit

> #ebene2 li a... {
> }

gehen

georg

### [#11](https://www.typo3.net/d/53365-probleme-mit-der-navi/11) · miami_vice · 2006-11-16

ok also die Schrift verändert er mir jetzt er macht mir aber immer noch die blöden Pfeile und die weißen Linien obwohl ich die in meiner CSS unter **ebene** nicht drin hab.

[Bild: de-kunde.de/2.jpg](http://www.de-kunde.de/2.jpg)

hier das TS

```typoscript
tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
  wrap = <div id="mainnavcontainer"> | </div>
  1 = TMENU
  1 {
    wrap = <ul> | </ul>
    entryLevel = 2
    NO = 1
    NO.wrapItemmAndSub = <li> | </li>
    ACT = 1
    ACT < .NO
    ACT.ATagParams = id=current
  }
  
  2 < .1
  2 = TMENU
  2.wrap = <div id="ebene"> | </div>
  2.NO.wrapItemmAndSub = <li> | </li>
  
}
```

und hier das CSS

```html
#ebene {
	width: 151px;
}

#ebene ul
{
	margin: 50;
	padding: 50;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8px;
	font-color:#004785;
}
#ebene ul li
{
	margin: 0;
	padding: 50;
}

#ebene2 li a {
	display: block;
	padding-right: 10px;
	padding-left: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	width: 151px;
}

#ebene a
{
	display: block;
	padding-right: 10px;
	padding-left: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	width: 151px;
}

html>body #ebene a {
	width: 131px;
}


#ebene a:link, #ebene a:visited
{
	color: #18EF6E;
	text-decoration: none;
	font-size: 10px;
}
```

uns so sollte es aussehen

[Bild: de-kunde.de/navi_ebene.jpg](http://www.de-kunde.de/navi_ebene.jpg)

### [#12](https://www.typo3.net/d/53365-probleme-mit-der-navi/12) · just2b · 2006-11-16

CSS = vererbung
wenn du was nicht mehr haben willst, dann musst du das schon explizit angeben, zB mit nichts überschreibn, oder beim background mit nem clear.gif/whatever

georg

### [#13](https://www.typo3.net/d/53365-probleme-mit-der-navi/13) · miami_vice · 2006-11-16

danke, danke jetzt gehts ...thx

### [#14](https://www.typo3.net/d/53365-probleme-mit-der-navi/14) · just2b · 2006-11-16

gott sei dank ;)

schönen tag noch

georg

---

Quelle: „Probleme mit der Navi“, typo3.net, https://www.typo3.net/d/53365-probleme-mit-der-navi
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.