Percentuale elemento figlio larghezza in genitore posizionato in modo assoluto su Internet Explorer 7

voti
249

Ho un posizionati in modo assoluto divcontenenti diversi bambini, uno dei quali è relativamente posizionati div. Quando uso una larghezza percentuale basata sul bambino div, crolla a '0' width in Internet Explorer 7 , ma non su Firefox o Safari.

Se uso larghezza in pixel , funziona. Se il genitore è relativamente posizionato, la larghezza percentuale sul bambino funziona.

  1. C'è qualcosa che mi manca qui?
  2. C'è una soluzione semplice per questo oltre alla larghezza in pixel-based sul bambino?
  3. C'è una zona della specifica CSS che si occupa di questo?
È pubblicato 31/07/2008 alle 23:08
fonte dall'utente
In altre lingue...                            


6 risposte

voti
129

Il genitore divdeve avere un definito width, in pixel o in percentuale. In Internet Explorer 7, il genitore divha bisogno di un definito widthper la percentuale di bambini divs per funzionare correttamente.

Risposto il 01/08/2008 a 13:22
fonte dall'utente

voti
53

Ecco alcuni esempi di codice. Penso che questo è quello che stai cercando. I seguenti display esattamente lo stesso in Firefox 3 (mac) e IE7.

#absdiv {
  position: absolute; 
  left: 100px; 
  top: 100px; 
  width: 80%; 
  height: 60%; 
  background: #999;
}

#pctchild {
  width: 60%; 
  height: 40%; 
  background: #CCC;
}

#reldiv {
  position: relative;
  left: 20px;
  top: 20px;
  height: 25px;
  width: 40%;
  background: red;
}
<div id="absdiv">
    <div id="reldiv"></div>
    <div id="pctchild"></div>
</div>

Risposto il 05/08/2008 a 06:54
fonte dall'utente

voti
34

IE prima di 8 presenta un aspetto temporale al suo modello di dialogo che crea un particolare problema con larghezze base percentuali. Nel tuo caso qui un posizionato in modo assoluto divdi default non ha larghezza. La sua larghezza sarà elaborato in base alla larghezza in pixel del suo contenuto e sarà calcolato dopo che i contenuti vengono resi. Quindi al punto IE incontra e rende la vostra posizionato relativamente divsuo genitore ha una larghezza di 0 quindi, perché essa si collassa a 0.

Se si desidera una discussione più approfondita di questo insieme con un sacco di esempi di lavoro, hanno un papero qui .

Risposto il 04/09/2008 a 10:02
fonte dall'utente

voti
30

Perché non fa la percentuale di larghezza di bambino nel lavoro di genitore posizionato in modo assoluto in IE7?

Perché è Internet Exploder

C'è qualcosa che mi manca qui?

Cioè, per sensibilizzare la vostra del collega / clienti che IE fa schifo.

C'è una soluzione semplice, oltre la larghezza in pixel-based sul bambino?

Utilizzare emle unità in quanto sono più utili quando la creazione di layout liquidi, come si possono usare per il riempimento e dei margini, così come le dimensioni dei caratteri. Così il vostro spazio bianco cresce e si restringe in misura proporzionale al testo se viene ridimensionato (che in realtà è quello che ti serve). Non credo che le percentuali danno un controllo più fine di SME; non c'è nulla che impedisca di specificare in centesimi di SME (0,01 em) e il browser interpreta come meglio ritiene opportuno.

C'è una zona della specifica CSS che si occupa di questo?

Nessuno, per quanto mi ricordo em's e%' s sono stati destinati per le dimensioni dei caratteri da solo indietro a CSS 1.0.

Risposto il 13/05/2009 a 08:47
fonte dall'utente

voti
28

Penso che questo abbia a che fare con il modo in cui la hasLayoutproprietà è implementato nel browser più vecchi.

Hai provato il codice in IE8 per vedere se funziona in là, troppo? IE8 ha un debugger ( F12) e può anche funzionare in modalità IE7.

Risposto il 22/10/2010 a 17:21
fonte dall'utente

voti
1

Le divesigenze di avere una larghezza definita:

<div id="parent" style="width:230px;">
    <div id="child1"></div>
    <div id="child2"></div>
</div>
Risposto il 07/09/2018 a 14:53
fonte dall'utente

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more