tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
6
ZUGRIFFE
559
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    08154711 08154711 ist offline Mitglied Gold
    Registriert seit
    Oct 2007
    Beiträge
    218
    Hi,
    Wie bekomme ich ohne ein ein Hintergrundbild zu nutzen es hin, das der weisse Bereich stets bündig oben und unten mit dem Browserfenster ist, auch ohne Inhalt . Ich habe dem Bereich margin:0 auto; zugewiesen, habe trotzdem einen Abstand von der Content-border zum unteren Teil des Browserfensters.
    Danke
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken content mit fester Breite & variabler Höhe-bsp.jpg  
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    in diesem Modell erstreckt sich die Box #wrapper ohne Inhalt vom oberen bis zum unteren Fensterrand und benötigt hierfür kein Hintergrundbild:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <meta name="author" content="Maik">
    <title>tutorials.de | demo_08154711</title>
     
    <style type="text/css">
    <!--
    html,body {
    margin:0;
    padding:0;
    height:100%;
    background:#d5d5d5;
    }
     
    div#wrapper {
    position:relative;
    margin:0 auto;
    width:780px;
    min-height:100%; /* Mindesthöhe in modernen Browsern */
    height:auto !important; /* !important-Regel für moderne Browser */
    height:100%; /* Mindesthöhe in IE <7 */
    background:#fff;
    }
     
    div#wrapper p {
    margin:0;
    padding:10px;
    }
    -->
    </style>
     
    </head>
    <body>
     
    <div id="wrapper">
         <!-- Inhalt ist auskommentiert -->
         <!--<p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>
         <p>some dummy text</p>-->
    </div>
     
    </body>
    </html>
     

  3. #3
    08154711 08154711 ist offline Mitglied Gold
    Registriert seit
    Oct 2007
    Beiträge
    218
    Hi,
    Danke hat Super geklappt, allerdings -->Nicht unterstützte Eigenschaft: min-height<-- Sollte aber trotzdem funktionieren, oder...
    Gruß
     

  4. #4
    Maik Tutorials.de Gastzugang
    Zitat Zitat von 08154711 Beitrag anzeigen
    -->Nicht unterstützte Eigenschaft: min-height<-- Sollte aber trotzdem funktionieren, oder...
    Diese Meldung bezieht sich auf die Vorgängerversionen des IE7, aber dafür haben wir ja mit

    Code :
    1
    2
    3
    
    min-height:100%; /* Mindesthöhe in modernen Browsern */
    height:auto !important; /* !important-Regel für moderne Browser */
    [b]height:100%;[/b] /* Mindesthöhe in IE <7 */
    Vorsorge geleistet

    Zum Testen kannst du ja einfach mal den "auskommentierten" Inhalt im DIV #wrapper einblenden.
     

  5. #5
    08154711 08154711 ist offline Mitglied Gold
    Registriert seit
    Oct 2007
    Beiträge
    218
    War nur eine Frage am Rande -wie gesagt es klappt -
    Gruß
     

  6. #6
    Maik Tutorials.de Gastzugang
    War nur die Antwort auf deine Rückfrage, ob es dennoch funktioniert
     

  7. #7
    08154711 08154711 ist offline Mitglied Gold
    Registriert seit
    Oct 2007
    Beiträge
    218
    Ja hat alles geklappt.
     

Ähnliche Themen

  1. Div mit variabler Breite
    Von Teilzeitphilosoph im Forum CSS
    Antworten: 4
    Letzter Beitrag: 03.09.10, 12:28
  2. Selectbox mit variabler Breite
    Von Teilzeitphilosoph im Forum CSS
    Antworten: 6
    Letzter Beitrag: 20.11.09, 16:15
  3. DropDownList mit variabler Breite
    Von psykochris im Forum ASP
    Antworten: 2
    Letzter Beitrag: 28.11.08, 08:29
  4. div mit fester und variabler Breite
    Von exxe im Forum CSS
    Antworten: 2
    Letzter Beitrag: 23.10.06, 11:57
  5. div variabler breite
    Von Snodri im Forum CSS
    Antworten: 1
    Letzter Beitrag: 20.08.05, 18:28