differenza di posizinamento in Explorer e negli altri

**follia80** · 17-06-2005, 10:03

ciao,

ho il seguente problema la struttura delle pagine del sito è centrale e con il codice che ho creato in ei funziona.
con gli altri lo posiziona a sinistra.

come posso risolvere il problema.

grazie

Emanuela

**Mich_** · 17-06-2005, 10:12

Come e` noto, IE usa un sistema diverso (errato per i concetti del W3C) per centrare in orizzontale.

Per centrare un oggetto, basta dargli margini automatici.
margin: 0 auto;

In IE occorre invece dare la proprieta`
text-align: center;
nel blocco che contiene quello da centrare

**follia80** · 17-06-2005, 11:02

ciao,

infatti avevo trovato quiesta informazione ma non capisco cosa sbaglio.

questo è il css:
/*generali*/

body {
color: #000000;
background-color: #FFFFFF;
margin: 0 auto;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : small;
text-decoration: none;
height:500px;
}

/*testa*/

div.testa
{
height:150px;
width: auto;
background-color: #E9BF4F;
position : static;
text-decoration: none;
margin: 0 auto;
text-align: center;
}

div.testacorpo
{
top:0px;
height:150px;
width: 770px;
text-align: left;
text-decoration: none;
display: block;
}

div.testacontenuto
{
top:0px;
height:150px;
position : absolute;
text-decoration: none;
display: block;
}

div.testalogo {
height:150px;
top:15px;
width: 310px;
position : absolute;
text-decoration: none;
display: block;
}
div.testaimg
{
height:150px;
top:0px;
width: 450px;
margin-left: 320px;
position : absolute;
text-decoration: none;
display: block;
}

************************************************** ******************
questo è html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="it" lang="it" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title> </title>
<style media="screen" type="text/css">
@import url(prova.css);
</style>
<meta name="author" content="" />
<meta name="generator" content="" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="rating" content="general" />
<meta name="robots" content="index,all" />
<meta name="revisit-after" content="7 days" />

</head>

<body>

<div class="testa">
<div class="testacorpo">
<div class="testacontenuto">
<div class="testalogo">immagine logo</div>
<div class="testaimg">immagine </div>
</div>
</div>
</div>
</body>
</html>

grazie

Emanuela

**kaze** · 17-06-2005, 11:08

Ma quello che vuoi centratre è l'immagine e immagine logo ???

:master:

**Mich_** · 17-06-2005, 11:08

Non ho capito quale blocco deve essere centrato.

Comunque vedo che fai ampio uso di position, che non e` il massimo se vuoi avere oggetti centrati!!

Nota che il
margin 0 auto;
va messo dentro il blocco da centrare
mentre il
text-align: center;
va messo nel blocco che contiene quello da centrare

**follia80** · 17-06-2005, 11:12

ciao,

è l'intera pagina.

Vi spiego la struttura:

ho una banda di colore #E9BF4F; (arancio/oro), nella quale devo visualizzare al centro il logo e l'immagine di lato.
ma la barra colorate si deve ridimensionare quando diminuisco la pagina o porto la risoluzione del video a 800x600.

questo con la mia struttura funziona.
in EI funziona anche la centratura non negli altrri.

grazie
Emanuela

**follia80** · 17-06-2005, 11:14

grazie infinite
non avevo capito il posizionamento del
margin: 0 auto;

grazie ancora

Emanuela

**kaze** · 17-06-2005, 11:17

Scusa ma utilizzare il float per i 2 div di testa ???

E poi non mi sembra che ci siano grandezze in % tali da far ridimensionare la pagina !!!
Senza contare che per un layout elastico le position sono solo delle complicazioni !!!

:rollo:

**follia80** · 17-06-2005, 11:24

ciao,

non sono ancora molto esperta con le impostazioni dei css.

so che esiste il comnado float ma non devo riuscire a capire come funziona esattamente.

tu mi potresti aiutare con la mia struttura.

per il ridimensionamento invece funziona perchè ho insrito nel div di testa
width: auto;

grazie ancora

Emanuela

**kaze** · 17-06-2005, 11:26

Prova questo (il css è inetrno per comodità):

-----------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<style>
html, body{
padding:0;
margin:0;
width:100%;
height:100%;
}

#testa{
margin:0px;
width:100%;
height:20%;
text-align:center;
background:#FF8000;
}

#logo{
margin:0;
width:80px;
height:80px;
background:#800000;
float:left;
}
</style>
</head>
<body>
<div id="testa">
<div id="logo">pippo</div>
TITOLO
</div>
</body>
</html>
-----------------------------------------------------
Non ti sembra più facile e pulito ???

Discussione: differenza di posizinamento in Explorer e negli altri

Strumenti discussione

Ricerca discussione

Visualizza

differenza di posizinamento in Explorer e negli altri

Permessi di invio