2016-01-04 28 views
6

Ho bisogno di avere il corpo di tutte le mie pagine Web (eccetto homepage) situato su http://www.zorglegal.nl alla stessa altezza (altezza del browser del 100%), quindi la barra marrone sulla destra è allungata a schermo intero dall'alto in fondo. Come posso ottenere il massimo?Impostazione altezza del corpo al 100%

html{ 
    height: 100%; 
} 

body{ 
    min-height: 100%; 
} 

non funziona. Ho anche provato a impostare una classe per l'elemento di contenuto e ho provato a impostarlo al 100% di altezza, ma non funziona neanche. Come posso fare questo?

La barra marrone è un'immagine png ed è impostata come immagine di sfondo per un contenitore a larghezza piena. Quindi se quel contenitore è alto al 100%, dovrebbe funzionare. Ma come?

+0

altezza 100% = dimensione della finestra, ma quando si ottiene lo scorrimento che è più il 100%. Attualmente funziona come previsto ma il tuo requisito è diverso. – Help

+0

Possibile duplicato di [Divisione CSS 100% altezza pagina] (http://stackoverflow.com/questions/712689/css-div-stretch-100-page-height) – Vucko

+0

Possibile duplicato di [Make body avere il 100% del altezza del browser] (http://stackoverflow.com/questions/6654958/make-body-have-100-of-the-browser-height) –

risposta

5
html, body{ 
    margin: 0; 
    padding: 0; 

    min-width: 100%; 
    width: 100%; 
    max-width: 100%; 

    min-height: 100%; 
    height: 100%; 
    max-height: 100%; 
} 

Questo Css ti aiuterà a impostare l'altezza del 100% per ogni pagina.

0

cercare di raggiungere utilizzando JavaScript:

$(window).bind('resize', yourclassname); 

In yourclassname utilizzare anche TuoID, dare a div genitore.

-1

prova,

html,body { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    height: 100%; 
    width: 100%; 
} 

E assicurarsi, nessuna delle altre classi o script interferire con la sopra CSS.

Spero che questo aiuti. :)

+0

Questo non funziona neanche. Non riesco a capirlo. Qualche altra soluzione per ottenere quella barra marrone come un bordo destro che riempie lo schermo? – user3354767

+0

Puoi creare un [CodePen] (http://codepen.io) con un numero minimo di scheletri, quindi posso dare un'occhiata? –

6

È possibile utilizzare l'altezza del viewport.

height: 100vh 

Ciò significa che il div o qualsiasi altro è alto quanto la finestra del browser.