Problemi visualizzazione Explorer/Mozzilla

**sfinge21** · 09-11-2009, 19:40

Ciao ragazzi vi posto l'html di una pagina che si vede perfettamente con Explorer ma non con Mozzilla...non riesco a capire dov'è il problema...avevo pensato che forse mancava qualche </div> di chiusura ma non ci sono errori sotto quell'aspetto...

---------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Beautyangel, Valeria Vettese, beautyday, centri estetici napoli, centro estetico via pessina, istituti di bellezza napoli, endermologie, triactive, ultrasuoni viso corpo napoli, elettrostimolatore, ricostruzione unghie in gel, elettrolipolisi, trucco sposa, trattamenti, massaggio fisiosomatico, massaggio shiatsu, estetiste napoli, Vagheggi, Karaja, Tisanoreica, LCN, trucco tattoo, solarium">
<title>Beautyangel Estetica</title>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />

</head>

<body>
<div id="main_container">

<div id="header">
<div id="logo">
<div align="center"></div>
</div>

<div class="prom_date_box">
<div class="prom_title">Estetica</div>

Consulta il nostro listino prezzi

dei trattamenti estetici.

</p>

</div>

</div>

<div id="menu">
<ul>
[*]Home
[*]Massaggi
[*]Macchinari
[*] VisoCorpo
[*]Solarium
[*]MakeUpSposa
[*]Nails

[*]TruccoSemipermanente[/list]
</div>

<div id="center_content">

<div class="left_content">
<div class="title">Listino prezzi</div>

cera gambaletto....€10

cera gamba completa con inguine....€18

cera braccia intera....€8

cera dorso....€10

cera labiale....€3

cera glutei....€5

cera ascelle....€5

cera viso....€4

manicure + smalto....€6

manicure + smalto + adesivi....€8

pedicure estetico....€10

pedicure curativo....€15

trattamento paraffina mani e piedi....€8

</div>

<div class="right_content">

<div class="title"></div>

<div class="right_photos_content">[img]picEst.png[/img]</div>

</div>
<div class="right_content">

<div class="right_photos_content">[img]picEst2.png[/img]</div>

<div class="clear"></div>
</div>

<div id="footer">

<div class="footer_links">
Dove siamo
Facebook
Contatti
</div>

<div class="copyright"></div>

</div>
</div>
</div>
</body>
</html>
-------------------------------------------------
potete darmi una mano?

**sfinge21** · 09-11-2009, 20:27

vi posto anche il css
------------------------
body {
background:url(corpo1.jpg) no-repeat;
background-color:#ac0000;
margin-top:0px;
margin-left:100px;
padding:0px;
font-family:Verdana, Helvetica, sans-serif;
font-size:14px;
color:#fff;
}
p{
margin:0px;
padding:0 0 5px 0;
line-height:17px;
text-align:justify;
}
p.left{
float:left;
width:315px;
}
h1{
padding:2px 0 10px 0;
margin:0px;
font-size:14px;
color:#fff;
}
#main_container{
width:850px;
height:auto;
margin:auto;
background-color:#000000;
}
#center_content{
background-color:#000000;
width:850px;
height:auto;
margin:auto;
}
#header{
width:850px;
height:341px;
margin:auto;
background:url(header_bg.jpg) no-repeat center;
}
#logo{
padding:30px 0 0 350px;
}
.prom_date_box{
width:350px;
padding:80px 0 0 30px;
}
.prom_title{
width:132px;
height:61px;
line-height:55px;
text-align:center;
font-size:24px;
font-weight:bold;
color:#fff;
background-color:transparent;
}
/*----------------------menu-------------------------*/
#menu{
width:821px;
height:44px;
padding:0px;
margin:auto;
text-align:center;
background:url(menu_bg.gif) no-repeat center;
}
#menu ul{
list-style:none;padding:0 0 0 10px;margin:0px;display:block; font-weight:bold;
}
#menu ul li{
list-style:none;display:inline;float:left;width:auto;he ight:44px;padding:0px;font-size:13px; line-height:44px;
}
#menu ul li a{
height:44px; width:87px;float:left;text-decoration:none;padding:0px; margin:0px;color:#ffffff;
}
#menu ul li a:hover{
height:44px;width:87px;text-decoration:none;color: #000000; background:url(button_bg.gif) no-repeat center;
}
#menu ul li a.current{
height:44px;width:87px;float:left;text-decoration:none;padding:0px;color: #ffffff;background:url(button_bg.gif) no-repeat center;
}

a.more {
width:104px;
height:24px;
display:block;
text-decoration:none;
float:right;
margin:10px 0 15px 0;
text-align:center;
line-height:22px;
color:#ffffff;
background:url(read_more_bg.gif) no-repeat center;
}
a.gallery_link {
width:287px;
height:74px;
display:block;
text-decoration:none;
font-size:18px;
margin:20px 0 0 5px;
text-align:center;
line-height:70px;
color:#000000;
background:url(photo_gallery_link.gif) no-repeat center;
}
/*---------------------main_content------------------*/
.left_content{
background-color:#000000;
width:435px;
height:auto;
float:left;
padding:10px 0 15px 25px;
}
.title{
font-size:18px;
color:#fff;
clear:both;
background:url(star.png) no-repeat left;
padding:0 0 0 23px;
margin:5px 0 5px 0;
}
.right_content{
background-color:#000000;
width:340px;
height:auto;
float:left;
padding:10px 0 0 20px;
}
.right_photos_content{
background-color:#000000;
padding:15px 0 0 25px;
border:1px #ca0000 solid;
}
.news_tab{
background-color:#000000;
float:left;
padding:5px 0 5px 0;
margin:0px;
}
img.photo{
float:left;
padding:2px;
border:1px #ca0000 solid;
margin:0 10px 0 0;
}
.clear{
clear:both;
}
/*-----------------------------footer------------------*/
#footer{
width:850px;
height:60px;
margin:auto;
color:#000000;
background-color:#000000;
border-top:1px #ac0000 solid;
}
.footer_links{
background-color:#000000;
float:left;
padding:10px;
}
.footer_links a{
background-color:#000000;
text-decoration:none;
padding:0 8px 0 8px;
color:#ac0000;
}
.footer_links a:hover{
background-color:#000000;
text-decoration:underline;
}
.copyright{
background-color:#000000;
float:right;
padding-right:15px;
padding-top:7px;
}

**sfinge21** · 09-11-2009, 22:25

ho capito che mettendo qualche commento condizionale in css per IE le cose per mozilla migliorerebbero anche ma purtroppo IE poi si sballa perchè "non legge" quei commenti..

[if IE] etc...(in css)
giusto?
eh...non va :-(

**sfinge21** · 09-11-2009, 22:35

per farla breve in Mozilla e solo in alcune pagine del sito (vai a capire perchè) lo sfondo nero non riempie tutto il box centrale come dovrebbe ma alcune parti restano "vuote" e sbuca lo sfondo rosso...in certe pagine è proprio tragica perchè ho notato che il nero finisce là dove finisce il testo scritto....se continuo a scrivere si riempie lo sfondo di nero...altrimenti nulla, esce il rosso...

please help me

**sfinge21** · 10-11-2009, 12:23

ragazzi nessun'idea??

**Mich_** · 10-11-2009, 13:14

Anzitutto premetto che un codice come quello postato non lo guardo neppure: mi rovina la vista.
I codici vanno inseriti mediante gli appositi tag VB (per comodita` si puo` usare il bottone # sopra l'area di inserimento).

Da quanto scrivi pare che tu abbia prima realizzato la pagina per IE, poi cerchi di sistemarla per gli altri browser.
E` il contrario di quanto consigliato.
Anzitutto perche` IE (specialmente se fatto lavorare in modo retrocompatibile=quirks) ha una sintassi diversa dagli altri browser e dagli standard.
Secondariamente perche` IE ha gli strumenti per inserire le correzioni solo per lui: i commenti condizionali (vedi tra i "link utili", o fa' una ricerca nel forum, se non sai cosa sono - comunque sono commenti del codice HTML, per cui possono servire per inserire dei CSS di correzione - non si possono usare all'interno dei CSS).

PS: se hai usato dei float, hai poi inserito i clear corrispondenti? Di solito il tipo di problemi segnalati sono dovuti alla mancanza dei clear (vedi ad esempio [Pillola] FabClearing, un metodo crossbrowser alternativo per il clearing dei float o fa' una ricerca nel forum).

Discussione: Problemi visualizzazione Explorer/Mozzilla

Strumenti discussione

Ricerca discussione

Visualizza

Problemi visualizzazione Explorer/Mozzilla

Permessi di invio