Div 100% altezza visualizzata come 0px?

Attualmente sto costruendo un sito web e ho un piccolo problema che non riesco a risolvere, ho creato un div con un'altezza del 100%, all'interno di quel div è un div slider con un'altezza del 100%, il problema è il primo div che mostra un'altezza di 0px in modo che il div che dovrebbe venire al di sotto del div al cursore mostri dietro il div del cursore, chiunque possa aiutarmi?Div 100% altezza visualizzata come 0px?

Ecco il mio codice:

.slider-container { 
    width:        100%; 
    min-height:       100%; 
    background-color:     white; 
    float:        left; 
} 

.main-content { 
    width:        100%; 
    height:        1000px; 
    background-color:     pink; 
    float:        left; 
} 

.column { 
    width:        31%; 
    height:        auto; 
    background-color:     orange; 
    float:        left 
} 

/* SLIDER */ 

.caption { 
    width:        500px; 
    background-image:     url("..//img/caption-bg.png"); 
    background-size:     100%; 
    position:       absolute; 
    z-index:       99; 
    overflow:       hidden; 
    margin-top:       7%; 
    margin-left:      5%; 
    -moz-border-radius:     20px; 
    border-radius:      20px; 
} 

.caption-text { 
    max-width:       460px; 
    overflow:       hidden; 
    margin:        20px; 
} 

.wrapper .slider-container #slideshow { 
    position:       relative; 
    width:        100%; 
    float:        left; 
} 

.wrapper .slider-container #slideshow > div { 
    position:       absolute; 
}

Il div cursore-contenitore deve avere il 100% di altezza in modo che il principale contenuto div arriva sotto di essa.

Grazie per l'anticipo!

fonte

2013-03-15 Quincy Norbert

A un certo livello, questa cascata di esigenze 100% s di avere un antenato in altezza esplicita. –

Come intendi? –

Il dispositivo di scorrimento deve essere dinamico in modo che il suo fluido –

Provare a dare un'altezza di:

html, body { 
    width:100%; 
    position:relative; 
}

fonte

2013-03-15 02:14:13

L'unità % è sempre relativa a un valore .. anche se è stato specificato height: 100%; sul <body> si noterà che finisce per essere 0px alto come sono tutti il <div> a cui si è attribuito il 100% di altezza, poiché tali valori sono relativi al contenitore principale, che risulta essere l'elemento radice <html> che al momento non ha un'altezza esplicita impostata, quindi viene impostato automaticamente su auto. Se si dà l'elemento principale height: 100%; si otterrà il comportamento previsto

fonte

2013-03-15 02:14:58 Adrift

Penso di aver capito cosa intendi, in questo caso il div contenitore cursore ha un'altezza del 100% ma non è chiaro al 100% di cosa, ma quando fornisco l'altezza al 100% non cambia nulla? –

Questo ha cambiato qualcosa, ma ora c'è un grande divario tra il cursore e il contenuto div http://www.k2stuc.nl/test/ –

Sbarazzarsi di "altezza minima: 100%;" sul contenitore di scorrimento – Adrift

Prova questo

<style type="text/css"> 
html { 
    height: 100%; 
} 

body { 
    text-align: center; 
    height: 100%; 
} 

     </style>

fonte

2015-10-15 06:32:03

Div 100% altezza visualizzata come 0px?

risposta

Problemi correlati