CSS/Layer: Height-Problem


  • ifko
  • 572 Aufrufe 2 Antworten

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • CSS/Layer: Height-Problem

    Ich habe 3 Layer nebeneinander, Layer 1 und Layer 3 als Navis, Layer 2 als Platz für Inhalt.

    1. Problem: Wenn jetzt in Layer 1 oder 3 mehr Text steht als in den anderen beiden, wird ein Teil des Texts außerhalb des Layers angezeigt.
    2. Problem: Dasselbe, nur dass hier in Layer 2 mehr Text steht und dieser quasi "überschwappt".

    Ich hab schon allen 3 Layern "height: 100%" zugewiesen, im IE löst das auch beide Probleme, aber im Mozilla nur ersteres. Wie kann ich beide Probleme browserkompatibel lösen?

  • das prob liegt wahrscheinlich daran, dass du deine layer nicht uebergeordneten elternelemente drinnen hast!! deshalb weiss mozilla nicht auf was es die 100% anwenden soll!! schick mir mal die html und css datei per mail oder wenn nicht all zu gross poste es hier...andere wirds vielleicht auch interessieren!!
    werd's mir anschauen!!

    ceeyaa.mex

  • Bitteschön:

    CSS (Ausschnitt):

    Quellcode

    1. /* LAYER & TABELLEN */
    3. #links {
    4. position: absolute;
    5. left: 0px;
    6. width: 190px;
    7. color: #564b47;
    8. margin: 0px;
    9. padding: 0px;
    10. }
    12. #inhalt {
    13. margin: 0px 190px 0px 190px;
    14. border-left: 2px solid #564b47;
    15. border-right: 2px solid #564b47;
    16. padding: 0px 0px 20px 0px;
    17. background-color: #ffffff;
    18. }
    20. #rechts {
    21. position: absolute;
    22. right: 0px;
    23. width: 190px;
    24. color: #564b47;
    25. margin: 0px;
    26. padding: 0px;
    27. }
    Alles anzeigen


    HTML:

    HTML-Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    2. "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
    3. <html xmlns="http://www.w3.org/1999/xhtml">
    4. <head>
    5. <title>Home</title>
    6. <link href="style.css" rel="stylesheet" type="text/css">
    7. </head>
    9. <body>
    11. <div id="links">
    12. // php includes
    13. </div>
    15. <div id="rechts">
    16. // Ein paar includes
    17. </div>
    19. <div id="inhalt">
    20. // Und noch ein paar includes
    21. </div>
    23. </body>
    24. </html>
    Alles anzeigen