Ecco il mio piccolo problema (il valore sono solo qui per l'esempio):Estendere una larghezza div in base ai suoi figli larghezza
Diciamo che ho una finestra con una larghezza intorno 500px. Dentro il mio documento, ho un div esterno senza larghezza specificata, ma il seguente CSS:
.outer{
white-space:nowrap;
background:blue;
}
All'interno di questo div sono altri 3 div che hanno le seguenti proprietà:
.t1{
display:inline-block;
width:400px;
}
(notare la . larghezza 400px
Ecco dove il problema è, la linea è più larga della finestra, e il div esterno non si estende il codice HTML sembra che:.
<div class="outer">
<div class="t1">1</div>
<div class="t1">2</div>
<div class="t1">3</div>
</div>
Quello che sto cercando di ottenere è di avere il 3 div interno con uno sfondo blu, senza impostarlo per la classe t1
. Ciò che questo esempio produrrà è uno sfondo blu limitato alla larghezza della finestra.
Vedere tutta l 'esempio qui: http://jsfiddle.net/sjCTR/ (dovrete per adattare l'angolo in basso a sinistra se lo schermo è di grandi dimensioni)
Mi chiedo se in qualche modo che si potrebbe ottenere attraverso il solo css/html, senza impostare la larghezza div esterna/lo sfondo div interno?
Non sono sicuro di aver capito il tuo problema. Stai cercando di forzare la larghezza di ogni '.t1' per essere sempre 400px o sempre 33% o qualcos'altro? – Godwin
No, il numero inserito qui è solo per l'esempio. Il problema è più complesso, ma l'idea è che la larghezza del div esterno non cresca per adattarsi alla larghezza dei suoi figli. –