---
title: "normales horizontales menü mit css3 stylen"
url: "https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage","HTML & CSS","TYPO3 4.x"]
created: "2013-11-27"
last_reply: "2013-11-28"
replies: 2
solved: true
page: 1
pages: 1
lang: "de"
---

# normales horizontales menü mit css3 stylen

TYPO3 › Menüs · 2 Antworten · gelöst · gestartet 2013-11-27

## Frage

**bujutsu** · 2013-11-27 · [Beitrag #1](https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen/1)

OK Leute ich bekomme das nicht ganz gebacken und verstehe es nicht.
Zuerst ein normales Menü zwei Ebenen:

```typoscript
lib.menu = HMENU
lib.menu {
  1 = TMENU
  1.noBlur =1
  1.expAll =1
  1.wrap = <ul>|</ul>
  1.NO = 1
  1.NO {
    expAll = 1
   wrapItemAndSub = <li>|</li>
  }

  2 < .1
 
}
```

Soweit so gut.
Dann ein bisschen html gerüst

```html
<body>
###BODY###



     <div id="menu">  <!-- das hauptmenü -->
     <!--  -->
     ###MENU###     
    
    
     </div>
  
        
    
      
<div id="page">
    <div id="contentleft">###CONTENTLEFT###</div>
    <div id="contentright">###CONTENTRIGHT###</div>
    
   
    </div>

</div> <!-- end page -->


    
     
     
###BODY###
</body>
```

dann das CSS

```css
body {
	padding: 50px;
	background-color:#fff; 
	
}
ul{list-style: none;}	

#menu {
 
   top: 0px;
   margin:0;
   padding:0; 
   width:50%
   height: 1px;
   font-family:Arial, Helvetica, sans-serif;
   text-shadow: 1px 1px 1px black;	
   border-bottom: 1 px solid rgba(0,0,0,0.3);
   background: rgba(0,0,0,0.5);
   box-shadow: inset 0 -1px 0 0 rgba(255,255,255,0.3),inset 0 -10px 0 0 rgba(255,255,255,0.25), inset 0 -20px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);
   
}


 
#menu ul li{
outline: 1px solid red;
   width: 150px;
   text-align:center;
   position:relative;
   float:left;
	border-right: 1px solid rgba(0,0,0,0.4);
	background: rgba(0,0,0,0.1);
	margin: 20px;	
}



#menu ul li a{
	outline:1px solid blue;
	font-size: 1.5em;
	padding-top: 20px;
	display:block;
	width:150px;
	height:40px%;
	color: #cccccc;
	text-decoration:none;
	
	
}


#menu ul li ul li{
	clear:both;
	magin-top: 25px;
	width: 25px;
   
	color: #ffffff;
	text-decoration:none;
	background: rgba(0,0,0,0.3);
	
}
```

und rauskommt das:

die ul vom submenu sind so inneinander verschachtelt, dass ich keine separate Bearbeitung mit css machen kann, dmait ich via "Display:" die unterebene einblenden kann.
Es macht mir immer die gesamte ebene 1 auf.
Ich blick nicht durch was ich versemmel.

bitte bitte um hilfe.
Besten dank

[Bild: \[upl-image-preview uuid=9944775b-48fe-56db-a341-4e27aabb75c7 url=https://www.typo3.net/assets/files/typo3net/1339-typo3menu.jpg alt=typo3menu.jpg thumbnail_url=https://www.typo3.net/assets/files/typo3net/1339-typo3menu.jpg\]](https://www.typo3.net/assets/files/typo3net/1339-typo3menu.jpg)

## Beste Antwort

**bujutsu** · 2013-11-28 · [Beitrag #3](https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen/3)

Danke für die Hilfe aber es war ein reines CSS Problem.
Geholfen hat auch das 2.menu mit einer klasse zu versehen.
Falls jemand dasselbe Problem hat.

## Antworten

### [#2](https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen/2) · Schweriner · 2013-11-27

Hier mal das Typoscript für ein simples Menü mit verschiedenen Klassen. Vielleicht hilft es Dir ja weiter und beim abgleichen findest Du den Fehler.

<http://www.blog.teamgeist-medien.de/2013/07/ein-einfaches-typoscript-menu.html>

### [#3](https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen/3) · bujutsu · 2013-11-28 · Beste Antwort

(Text siehe oben unter „Beste Antwort“.)

---

Quelle: „normales horizontales menü mit css3 stylen“, typo3.net, https://www.typo3.net/d/116725-normales-horizontales-menue-mit-css3-stylen
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.
