DISABILITARE ADBLOCK

ADBlock sta bloccando alcuni contenuti del sito

ADBlock errore
risultati trovati: 

Elemento figlio di larghezza percentuale nell'elemento padre posizionato in modo assoluto su Internet Explorer 7

StackOverflow https://stackoverflow.com/questions/6

DOMANDA

Ho un div assolutamente posizionato contenente diversi figli, uno dei quali è un div relativamente posizionato. Quando utilizzo una larghezza basata su percentuale sul div figlio, si riduce alla larghezza '0' su Internet & nbsp; Explorer & nbsp; 7 , ma non su Firefox o Safari.

Se utilizzo larghezza pixel , funziona. Se il genitore è relativamente posizionato, la larghezza percentuale sul figlio funziona.

  1. C'è qualcosa che mi manca qui?
  2. Esiste una soluzione semplice per questo oltre alla larghezza basata su pixel sul bambino?
  3. Esiste un'area delle specifiche CSS che tratta questo?

SOLUZIONE

Il div padre deve avere una larghezza definita, in pixel o in percentuale. In Internet & nbsp; Explorer & nbsp; 7, il div padre ha bisogno di una larghezza definita per il corretto funzionamento della percentuale figlio div s

Se ti va lasciaci una tua opinione

L'articolo ti è stato utile ed è tradotto correttamente?

ALTRI SUGGERIMENTI

Ecco un codice di esempio. Penso che questo sia quello che stai cercando. Di seguito viene visualizzato 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>

IE prima di 8 ha un aspetto temporale nel suo modello a scatola che in particolare crea un problema con larghezze basate su percentuale. Nel tuo caso qui un div assolutamente posizionato per impostazione predefinita non ha larghezza. La sua larghezza verrà elaborata in base alla larghezza dei pixel del suo contenuto e verrà calcolata dopo il rendering del contenuto. Quindi nel momento in cui IE incontra e rende il tuo div relativamente posizionato, il suo genitore ha una larghezza di 0, quindi perché crolla da solo a 0.

Se desideri una discussione più approfondita di questo insieme a molti esempi funzionanti, fai un gander qui .

  

Perché non è il figlio della larghezza percentuale   nel lavoro genitore assolutamente posizionato   in IE7?

Perché è Internet Exploder

  

C'è qualcosa che mi manca qui?

Cioè, per aumentare la consapevolezza del tuo collega / cliente che IE fa schifo.

  

Esiste una soluzione semplice oltre alla larghezza in pixel del bambino?

Utilizza le unità em in quanto sono più utili durante la creazione di layout liquidi in quanto puoi utilizzarli per riempimento e margini, nonché dimensioni dei caratteri. Quindi il tuo spazio bianco cresce e si riduce in proporzione al testo se viene ridimensionato (che è davvero quello che ti serve). Non credo che le percentuali diano un controllo più preciso rispetto agli em; non c'è nulla che ti impedisca di specificare in centesimi di em (0,01 em) e il browser interpreterà come meglio ritiene.

  

Esiste un'area delle specifiche CSS che copre questo?

Nessuno, per quanto mi ricordo di em e% sono stati intesi solo per le dimensioni dei caratteri a CSS 1.0.

Penso che questo abbia qualcosa a che fare con il modo in cui la proprietà hasLayout è implementata nel browser precedente.

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

div deve avere una larghezza definita:

<div id="parent" style="width:230px;">
    <div id="child1"></div>
    <div id="child2"></div>
</div>

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow