Stretching DIV absolut über Bildschirm

So, hier ist meine situation:

Ich habe ein div (siehe code unten), eine ziemlich einfache . Wenn der code ausgeführt wird, ich komme mit einem grauen Kasten. ABER, meine intention war, dass die graue box um die Zeitspanne von dem start des browser-Fensters, um das ENDE der browser-Fenster, während das, was Sie den code unten tut, ist erstellen eine graue box mit dem, was scheint zu sein, einen weißen Rand.

<div style="height: 30px; background-color: gray; color: white;">
   Hey
</div>

Tut mir Leid für die fehlende Erklärung, aber ich fand keine gute Art und Weise zu Wort, was ich versuche zu tun. Vielen Dank im Voraus,

Tom.

  • ohne zu sehen, mehr code, ich denke über width:100%; haben Sie es versucht?
  • hinzufügen width: 100%
  • Mögliche Duplikate (gerade gemerkt) von stackoverflow.com/questions/90178/...
  • Ja, es hat immer noch einen weißen Rand. Ich würde empfehlen, es zu betreten, in Ihr "localhost", um zu sehen, was falsch ist.
  • Wow, so viele doppelte Antworten...
  • reset-Marge auf <body> null
  • Danke, GCyrillus! Das war es! Genial!

InformationsquelleAutor Thomas Gouder | 2013-07-03
  1. 2

    Wenn Sie möchten, halten Sie Höhe:

    <div style="height: 30px; width: 100%; background-color: gray; color: white;">
   Hey
</div>

    Auch, um loszuwerden, der weiße Rahmen, fügen Sie diese: body { padding: 0; margin: 0 }

    • Sie brauchen nicht in Anführungszeichen zu 100%
    InformationsquelleAutor Brian
  2. 3

    Wenn Sie möchten, eine div zu füllen alle verfügbaren Speicherplatz verwenden Sie die folgenden:

    width: 100%; 
height: 100%;

    Können Sie festlegen, Größen in Prozent des verfügbaren Raums.

    InformationsquelleAutor Christian Stewart
  3. 2

    Wenn ich verstehe deine korrekt, müssen Sie die Breite auf 100% gesetzt werden 

    <div style="width: 100%; height: 30px; background-color: gray; color: white;">
   Hey
</div>
    InformationsquelleAutor Nikola
  4. 2

    Hinzufügen width:100%; zu sagen, um das div zu füllen, der horizontale Raum.

    InformationsquelleAutor Sergio
  5. 2
    <head>  
<style>
    body {
        padding: 0;
        margin: 0;
    }
</style>
</head>

<body>
<div style="height: 30px; width: 100% background-color: gray; color: white;">
   Hey
</div>
</body>

    Ich gehe davon aus, dass Sie möchten, dass Ihre div werden 30px hoch und die Breite des Weges. Zu tun, dass Sie nur legen Sie die Breite des div - 100% und stellen Sie sicher, der Körper hat keine Polsterung(dies kann eine Verschiebung der Elemente nach rechts ein wenig. Ich empfehle die Verwendung von reset.css)

    Hoffe, das hilft!

    • Sie sollten vermeiden "px" nach Ihren Größen, I. E. padding: 0; als 0 benötigt keine Einheiten.
    • Dies ist die richtige Antwort. Die body hat Margen und oder Polsterung standardmäßig in den meisten Browsern. Sie müssen auf null aus, wie hier gezeigt. Viele Menschen nutzen ein CSS-Reset (z.B. Meyer ' s CSS Reset) auf null, all die kleinen Seltsamkeiten wie diese und machen alle Browser, starten von einem gemeinsamen Punkt.
    InformationsquelleAutor starscape
Schreibe einen Kommentar