PDA

View Full Version : [CSS] firefox ok ie rompe

ndakota
29-04-2008, 16:11
ho questo html:

<html>
<head>
<link href="style.css" rel="stylesheet" style="text/css">
<title>prova</title>
</head>
<body>
<div id = "container">
<div id = "header"></div>
<div id = "centerOne"></div>
<div id = "centerTwo"></div>
<div id = "centerThree"></div>
<div id = "footer"></div>
</div>
</body>
</html>

e questo css:

#container
{
width: 80%;
height: 100%;
margin-left: auto;
margin-right: auto;
}

#header
{
height: 20%;
background-color: red;
}

#centerOne
{
width: 15%;
height: 60%;
background-color: yellow;
float: left;
clear: left;
}

#centerTwo
{
width: 70%;
height: 60%;
background-color: green;
float: left;
}

#centerThree
{
width: 15%;
height: 60%;
background-color: silver;
float: left;
}

#footer
{
height: 20%;
background-color: blue;
clear: both;
}


con firefox tutto è ok, mentre con ie(7) centerThree mi va sotto e footer più sotto ancora..
1)cosa provoca questo? cosa non piace a ie?
2)meotdi cross-browser per centrare il tutto?

grazie. :)
Necromachine
30-04-2008, 12:32
Stai assegnando la height in percentuale ai div, IE sui div la accetta solo in pixel, poi non so se c'è altro :p .

Per risolvere potresti usare una <table> o vedere su google se esiste qualche accrocchio in CSS .
Ziosilvio
30-04-2008, 12:48
Oppure mettere una pagina alternativa "questo sito si vede male con IE, usa Firefox".

(Se tanti smanettoni di FrontPage si permettono di sbattermi in faccia un avviso "il tuo browser non è figo, usa IE" quando Opera prova a visualizzare i loro pastrugni, perché noi non dovremmo fare altrettanto?)
ndakota
30-04-2008, 14:05
e poi noi a ragione :O
ndakota
30-04-2008, 14:06
Stai assegnando la height in percentuale ai div, IE sui div la accetta solo in pixel, poi non so se c'è altro :p .

Per risolvere potresti usare una <table> o vedere su google se esiste qualche accrocchio in CSS .

le table preferirei non usarle.. da quel che ho capito si usavano una volta e adesso siamo passati a div+css quindi non vedo perchè dovrei tornare indietro :p