[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

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