Salve a tutti,
ho creato una pagina web in cui c'è un div contenitore con queste caratteristiche CSS.
#contenitore {
border: 1px solid #C1C1C1;
width: 800px;
margin: 50px auto 50px auto;
text-align: left;
background: white;
padding: 20;
}
Il problema è che se apro la pagina con chrome è tutto ok mentre se la apro con Interbet Explorer il div non presenta margino e risulta posto vicino ai bordi dello schermo. Sbaglio in qualche punto?
RL
Usi un Doctype completo nella tua pagina?
(sul valore del padding manca l'unità di misura: 20px)
Ho inserito solo:
<!doctype html>
Puoi darci il codice completo della pagina? qualcosa manda Explorer in quirks mode, lo fa lavorare cioè non in accordo con gli standard (e perciò non applica correttamente il css)
Ecco il codice:
<html>
<!doctype html>
<html lang="it">
<head>
<style type="text/css">
*{
margin: 0px;
padding:0px;
}
body {
background-color: #F9F9F0;
font: 14px Tahoma;
color: black;
margin-bottom: 5px;
}
#contenitore {
border: 1px solid #C1C1C1;
width: 800px;
margin: 50px auto 50px auto;
text-align: left;
background: white;
padding: 20;
}
div.sezioni {
border: 1px solid #C1C1C1;
width: 760px;
margin: 10px auto 10 auto;
background: #EFEFEF ;
padding: 10px;
}
p.domanda {
font: bold 14px Tahoma;
color: black;
margin-bottom: 5px;
}
p.titolo {
font: bold 16px Tahoma;
color: black;
}
p.note {
font: 11px Tahoma;
color: black;
}
p {
font: 14px Tahoma;
color: black;
margin-bottom: 5px;
}
input.nascosto {
hidden: true;
}
li {
margin-left: 20px;
}
</style>
</head>
<body >
<div id="contenitore">
<div class="sezioni">
<p class="titolo" align="center"> SONDAGGIO SUI PROCESSI DI EVACUAZIONE</p>
</div>
<div class="sezioni">
La sua partecipazione a questo studio contribuira' a migliorare la nostra comprensione di come la gente seleziona le uscite in un processo
di evacuazione rapida da un luogo a rischio. </p>
<h4>IL QUESTIONARIO</h4>
<ul>
[*]In questo studio le verra' chiesto di compilare un questionario.
[*]Il questionario prevede un parte iniziale in cui saranno presenti domande caratterizzanti la sua persona.
[*]Il questionario prevede sei brevi video (da visionare con l'audio attivato) al termine dei quali le verra richiesto di fare una scelta.
[*]L'intero processo di risposta dovrebbe durare circa 5 - 10 minuti del vostro tempo.
[/list]
</p>
<h4>LE SUE RISPOSTE</h4>
<ul>
[*]Le risposte da lei fornite saranno registrate per una successiva elaborazione.
[*]I dati da lei forniti verranno trattati in forma anonima.
[*]Le informazioni da lei fornite saranno utilizzate al solo scopo di ricerca ed alcuni dati analizzati potranno essere pubblicati o mostrati in dibattiti pubblici.
[*]Le domande sono state strutturate per raccogliere informazioni che ci aiuteranno nella nostra comprensione del comportamento umano durante i processi di evacuazione.
[/list]
</p>
<h4>DIRITTO DI RECESSO</h4>
<ul>
[*]Il seguente questionario comporta semplici domande e risposte e non presenta particolari difficoltà.
[*]Tuttavia, se in qualsiasi momento si vuole recedere dal questionario, chiudere la finestra / scheda della pagina web e nessun dato verrà inviato al server.
[/list]
</p>
<h4>In questionario consiste in 2 parti:</h4>
<ul>
[*]PARTE 1: Questionario introduttivo caratterizzante la sua persona.
[*]PARTE 2: Sequenza di video e domande.
[/list]
</p>
</div>
<div class="sezioni" align="center">
<form name="modulo" action="Sondaggio0.php" method="post">
<input type="checkbox" id="accetto" name="accetto" onclick="attiva()"/> Fare clic su questa casella se sono state comprese le informazioni di cui sopra e se accetta di partecipare al questionario.
<input type="submit" id="avanti" name="avanti" value=" AVANTI " disabled>
</form>
<script type="text/javascript">
function attiva()
{
if(document.modulo.acetto.checked == true)
{
document.modulo.avanti.disabled=false;
}
else
{
document.modulo.avanti.disabled=true;
}
}
</script>
<script type="text/javascript">
function attiva()
{
if(document.getElementById("accetto").checked)
{
document.getElementById("avanti").disabled=false;
}
else
{
document.getElementById("avanti").disabled=true;
}
}
</script>
</div>
</div>
</body>
</html>
codice:[ body { background-color: #F9F9F0; font: 14px Tahoma; color: black; margin-bottom: 5px; text-align: center }
via il tag html prima del doctype, è di troppo
Funziona!
Volevo sapere come mai questa discrepanza? non dovrebbe bastare il margin del contenitore?
Se ti riferisci al text-align:center sul body, è quanto serve per allineare un div con explorer 5.5 o con versioni successive in assenza di doctype. Se il docype non è rilevato da ie (prima del doctype non può comparire un tag html) potresti avere altri problemi per cui ti conviene risolvere il problema alla radice
sarebbe bastato se la pagina fosse stata aderente alle specifiche html oppure xhtml strict
comunque si usa sempre per le vecchie versioni di IE (mi sembra)
la tua pagina ha errori che vanno corretti
edit anticipato su tutta la linea
Permessi di invio
Rispondi quotando