Domanda

Due div, galleggiava a sinistra, di larghezza sconosciuta. Uno di loro ha più contenuti rispetto adatta alla pagina, in modo che si muove al di sotto della prima (tranne che in IE):

http://corexii.com/floatproblem/float.html

Aggiungi display: inline-table; e quello grande avvolge il suo contenuto (in modo coerente tutti i browser):

http://corexii.com/floatproblem/table.html

Ma introdurre un doctype (non solo rigida, QUALSIASI doctype) e non lo fa più in Firefox:

http://corexii.com/floatproblem/doctype.html

Come faccio ad avere il div diritto di avvolgere il suo contenuto mentre si utilizza un doctype, allo stesso tempo, in modo affidabile tutti i browser?

È stato utile?

Soluzione

  

Come faccio ad avere il div diritto di avvolgere la sua   contenuti mentre si utilizza un doctype al   tempo stesso, in modo affidabile tutti i browser?

senza definire larghezze, non è possibile . Mi consiglia di larghezze percentuali in questo caso, ma è a voi.

La larghezza di default per un div è al 100% del suo contenitore (in questo caso la pagina). La prima div finirà la sua dimensione effettiva a meno che non si taglia la pagina per essere più piccola che la sua larghezza intrinseca. Prevedendo coerenza attraversato browser senza un DOCTYPE completo e valido è semplicemente un esercizio di futilità.

Altri suggerimenti

CSS non riesco a fare tutto quello che i layout di tabella basata può. Per uno, i layout di larghezza dinamiche sono molto più complicate. layout table-less sono ancora preferibile per il 98% dei casi, ma se si ha realmente bisogno di questo tipo di layout a larghezza dinamica potrebbe essere necessario utilizzare una tabella.

larghezze non coerenti, se non attentamente proporzionato, non sono molto buone dal punto di vista estetico così si può essere che fissa il problema sbagliato.

Si potrebbe iniziare includendo un elemento BODY.

Traingamer vi ha dato una spiegazione del comportamento di Firefox e ciò che deve essere fatto per ottenere il risultato desiderato. Si potrebbe ascoltare lui invece di andare per la tangente sui CSS impossibilità di creare layout con.

Non prendetevela con i CSS per i problemi che sono l'introduzione da non aderire a correggere le specifiche web.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top