[CSS] Div height 100%

  • geschlossen
  • HTML & CSS

  • Chrissy00
  • 1519 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] Div height 100%

    Hallo miteinander,

    ich möchte auf meiner Homepage das komplette Design von oben bis ganz nach unten durchgezogen haben.
    Dafür müsste ich ja eigentlich nur das div mit der class pagecontent auf min-width 100% stellen?

    Irgentwie klappts bei mir leider nicht..hab schon ein paar Varianten durchprobiert - erfolglos =/

    Ich hoffe mal, ihr könnt helfen:

    HTML-Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <title></title>
    5. <LINK href="includes/style.css" rel="stylesheet" type="text/css" />
    6. </head>
    7. <body>
    8. <div align="center">
    9. <table style="border: 0px; width: 1100px;" cellspacing="0" cellpadding="0">
    10. <tr style="background-image: url('images/header.png'); height: 97px;">
    11. <td style="padding-left: 50px;" width="167" valign="bottom">
    12. <img src="/images/logo.png" alt="logo" />
    13. </td>
    14. <td align="right" style="padding-right: 50px;">
    15. <?php
    16. include 'includes/userticker.php';
    17. ?>
    18. </td>
    19. </tr>
    20. <tr style="background-image: url('images/newstickertr.png'); height: 29px;">
    21. <td colspan="2">
    22. </td>
    23. </tr>
    24. <tr style="background-image: url('images/spacer_verlauf.png'); height: 127px;">
    25. <td colspan="2">
    26. </td>
    27. </tr>
    28. <tr style="height: 100%; background-image: url('images/content_1px.png');">
    29. <td colspan="2">
    30. <div class="pagecontent">
    31. Blabla hier der sp&auml;tere Content!
    32. </div>
    33. </td>
    34. </tr>
    35. <!-- SPACER -->
    36. <tr style="background-image: url('images/content_1px.png');"><td colspan="2" height="30"></td></tr>
    37. <!-- END -->
    38. <tr style="height:26px; background-image: url('images/footer.png');">
    39. <td colspan="2">
    40. </td>
    41. </tr>
    42. </table>
    43. </div>
    44. </body>
    45. </html>
    Alles anzeigen


    Quellcode

    1. html, body {
    2. margin:0;
    3. padding:0;
    4. height: 100%;
    5. background-color:#FFFFFF;
    6. background-image: url('../images/bg.png');
    7. background-repeat: repeat-x;
    8. }
    10. div.userticker {
    11. background-image: url('../images/userticker_box.png');
    12. padding-top:5px;
    13. height: 76px;
    14. width: 427px;
    15. text-align: center;
    16. z-index: 2;
    17. }
    18. div.userticker_schein {
    19. background-image: url('../images/userticker_schein.png');
    20. height: 81px;
    21. width: 427px;
    22. position: absolute;
    23. z-index: 1;
    24. margin-left: 406px;
    25. margin-top: -81px;
    27. }
    29. .userticker_img {
    30. border: 1px solid #777777;
    31. padding: 2px;
    32. }
    34. div.pagecontent {
    35. padding-left: 50px;
    36. position:relative;
    37. height: 100%;
    38. }
    40. .userticker_font {
    41. color: #292929;
    42. font-weight: bold;
    43. font-family: 'Verdana';
    44. font-size: 8px;
    45. }
    Alles anzeigen
    Wer Rechtschreibfehler findet, darf sie behalten :)

    Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von Chrissy00 ()

  • Und warum gerade im PHP Forum? => Moved

    height mit Prozenten bezieht sich immer auf das Eltern-Objekt (Außer bei body/html). Sprich das div bezieht sich auf das td bzw. tr - dort steht wieder nur eine Prozent-Anzahl, also geht's weiter... Da bei dir aber nirgends eine feste Höhe angegeben ist, gibt es kein fix-Punkt, woran der Browser 100% rechnen könnte - daher wird es nicht beachtet.

    Gruß
    Broken Sword
    Auf dem Abstellgleis sah man ihn liegen,
    Auf dem Abstellgleis zwischen Schwelle und Gestein,
    Auf dem Abstellgleis im strömenden Regen,
    Auf dem Abstellgleis allein.