Suche
Teilen
startseite » forum

[Frage] normales horizontales menü mit css3 stylen [Gelöst] TYPO3-Version: 4.7.8

  • bujutsu bujutsu
    Padawan
    0 x
    59 Beiträge
    0 Hilfreiche Beiträge
    27. 11. 2013, 15:15

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

    1. lib.menu = HMENU
    2. lib.menu {
    3.   1 = TMENU
    4.   1.noBlur =1
    5.   1.expAll =1
    6.   1.wrap = <ul>|</ul>
    7.   1.NO = 1
    8.   1.NO {
    9.     expAll = 1
    10.    wrapItemAndSub = <li>|</li>
    11.   }
    12.  
    13.   2 < .1
    14.  
    15. }

    Soweit so gut.
    Dann ein bisschen html gerüst

    2. ###BODY###
    3.  
    4.  
    5.  
    6.      <div id="menu">  <!-- das hauptmenü -->
    7.      <!--  -->
    8.      ###MENU###     
    9.  
    10.  
    11.      </div>
    12.  
    13.  
    14.  
    15.  
    16. <div id="page">
    17.     <div id="contentleft">###CONTENTLEFT###</div>
    18.     <div id="contentright">###CONTENTRIGHT###</div>
    19.  
    20.  
    21.     </div>
    22.  
    23. </div> <!-- end page -->
    24.  
    25.  
    26.  
    27.  
    28.  
    29. ###BODY###
    30. </body>

    dann das CSS[code]

    1. body {
    2. 	padding: 50px;
    3. 	background-color:#fff; 
    4.  
    5. }
    6. ul{list-style: none;}	
    7.  
    8. #menu {
    9.  
    10.    top: 0px;
    11.    margin:0;
    12.    padding:0; 
    13.    width:50%
    14.    height: 1px;
    15.    font-family:Arial, Helvetica, sans-serif;
    16.    text-shadow: 1px 1px 1px black;	
    17.    border-bottom: 1 px solid rgba(0,0,0,0.3);
    18.    background: rgba(0,0,0,0.5);
    19.    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);
    20.  
    21. }
    22.  
    23.  
    24.  
    25. #menu ul li{
    26. outline: 1px solid red;
    27.    width: 150px;
    28.    text-align:center;
    29.    position:relative;
    30.    float:left;
    31. 	border-right: 1px solid rgba(0,0,0,0.4);
    32. 	background: rgba(0,0,0,0.1);
    33. 	margin: 20px;	
    34. }
    35.  
    36.  
    37.  
    38. #menu ul li a{
    39. 	outline:1px solid blue;
    40. 	font-size: 1.5em;
    41. 	padding-top: 20px;
    42. 	display:block;
    43. 	width:150px;
    44. 	height:40px%;
    45. 	color: #cccccc;
    46. 	text-decoration:none;
    47.  
    48.  
    49. }
    50.  
    51.  
    52. #menu ul li ul li{
    53. 	clear:both;
    54. 	magin-top: 25px;
    55. 	width: 25px;
    56.  
    57. 	color: #ffffff;
    58. 	text-decoration:none;
    59. 	background: rgba(0,0,0,0.3);
    60.  
    61. }
    [/code]

    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

    Anhänge (1)
    typo3menu.jpg image/jpeg 0,00 B 125 heruntergeladen
    Tags: Css3 tmenu verschachtelt
  • bujutsu bujutsu
    Padawan
    0 x
    59 Beiträge
    0 Hilfreiche Beiträge
    28. 11. 2013, 11:59 - Lösung

    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.

  • 1
  • 1
Präsentiert von
Mittwald
Nützliche Links
TYPO3 Dokumentation
eStrategy
webworker Magazin