Ordnen Sie Symbole in voller Höhe Container

Ich möchte mehrere Symbole in einem Container mit der vollen Höhe der Website (nicht im Ansichtsfenster) anordnen.Ordnen Sie Symbole in voller Höhe Container

ich im Augenblick nur die Höhe des Ansichtsfensters mit dem folgenden Code:

.full-container { 
 
    position: absolute; 
 
    height: 100%; 
 
    display: block; 
 
    top: 0; 
 
    bottom: 0; 
 
    
 
    /* for example */ 
 
    width: 100%; 
 
    background: red; 
 
}

<div class="full-container"></div>

Gibt es eine Möglichkeit, die Höhe der gesamten Website zu bekommen? Hier

ist ein Beispiel für meine Idee:

Der weiße Bereich ist der sichtbare Bildschirm im Browser. Die graue Fläche ist der Rest der Seite. Ich möchte ein DIV mit der vollen Höhe der Seite (gelber Bereich).

Quelle

2017-03-03 Cray

Können Sie ein Bild davon teilen, was Sie erreichen möchten? – aloisdg

sehe meine Frage;) – Cray

Das Problem mit der Erstellung eines div 100% ist, dass nur den Bereich abdecken, der von den Elementen übrig ist, in denen sich das div befindet. Normalerweise mit der absoluten Position sollte dies nicht benötigt werden, aber haben Sie Folgendes versucht:

/* CSS */ 
* { 
    margin: 0; 
    padding: 0; 
}

Eine andere Sache, die ich Sie fragen müssen, wenn Sie Box-Sizing verwenden. Das könnte die Ursache des Problems sein.

noch frage ich mich, was Sie versuchen zu erreichen:

body {background-color: red;} 
 
main { 
 
    width: calc(100% + 100px); 
 
    background-color: blue; 
 
    position: absolute; 
 
    left: -100px; 
 
    top: 0; 
 
}

<body> 
 
    <main><p>test</p></main> 
 
</body>

Edite: Scheint ziemlich buggy zu sein, was Sie todo versuchen werden. Die 100% scheinen es nicht wirklich zu unterstützen und geben nur den Wert der Seitenbreite zurück.

Quelle

2017-03-03 17:17:50

Ordnen Sie Symbole in voller Höhe Container

Antwort

Verwandte Themen