problema grafica con i browser

**bechbein** · 01-01-2012, 20:29

ciao a tutti
non so se questa è la sezione giusta ma mi sembrava la più adatta al mio problema.
ho creato un sito sviluppandolo su internet explorer e fino a qui tutto perfetto ... successivamente negli ultimi giorni ho installato chrome perchè IE mi dava alcuni problemi con le applicazioni java ... bene apro il mio sito con chrome e la grafica cambia completamente, le dimensioni delle immagini cambiano e sopratutto i link non producono più l'effetto hover e alcuni box non rispettano più le dimensioni originali ... ho fatto tutto con i CSS e penso che sia questo il problema ma non sono riuscito a risolverlo e speravo che qualcuno di voi esperti potesse aiutarmi ...

e chrome che segue delle determinate regole che explorer ignora ?? se si potreste illustrarmele??
perche ho letto che IE è molto trasgressivo riguardo le regole del W3C ...

se vi serve il sorgente di una pagina chiedete pure ...

grazie mille in anticipo

**morocarlo** · 02-01-2012, 10:35

il sorgente servirebbe per aiutarti di più.
Di solito se si rispettano le regole si dovrebbe vedere bene sia su IE9 che su Chrome e Firefox. Se hai usato una versione più vecchia di Internet Explorer i problemi sono normali

**bechbein** · 02-01-2012, 17:04

allora posto qui il sorgente di una pagina:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html4/loose.dtd>
<html>
<head>
<script type="text/javascript" src="jquery-1.5.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.3.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(
function img() // animazione iniziale con immagini a comparsa , si avvia al caricamento
{

//$("#imgfondoa").append("[img]img1.jpg[/img]");// img in fondo a destra
//$("#imgfondoa").fadeIn(2500,function ()
//{
/*$("#imgfondoa").append("[img]img2.jpg[/img]");// img in fondo a sinistra
$("#imgfondoa").fadeIn(2500,function()
{ */
$("#boxcentrale").append("[img]titolo.jpg[/img]");// img centrale con input text
$("#boxcentrale").append("<div align='center'><form action='apri.php' method='post'><input type='text' size='60' name='nome'>

<input type='submit' name='' value='cerca con aquariumbase' class='pulsante'></form></div>");
$("#boxcentrale").fadeIn(3000);
$("#sopra").fadeIn(3000);
$("#lineagrigia").fadeIn(3000);
//});
//});
});
// menu laterale per ricerca avanzata
function aprimenulat()// apertura accordion
{
$("#menulat").fadeToggle();
}
function apridolce()// apre la sezione dolce
{
$("#menulat").empty();
$("#menulat").append("
");
$("#menulat").append("[img]floradolce.png[/img]");
$("#menulat").append("[img]faunadolce.png[/img]");
$("#menulat").append("<div id='boxindietro'>[img]indietro.jpg[/img]</div>");
}
function chiudidolce ()// chiude la sezione dolce al click di una delle due img del menu apridolce
{
$("#menulat").empty();
$("#menulat").append("
");
$("#menulat").append("[img]dolce.png[/img]

");
$("#menulat").append("<div id='testomenu'>Sei un principiante o stai cercando una specie con determinate caratteristiche della quale non conosci il nome??
Grazie al potente filtro di Aquarium Base potrai vedere tutte le specie presenti nel database che rispecchiano le caratteristiche da te inserite in modo da poter scegliere la specie che più si adatta al tuo acquario.
Bastera scegliere i parametri e premere il tasto &#34cerca&#34, verranno cosi visualizzate tutte le specie con quelle caratteristiche.</div>")
}
function floradolce()// apre la sezione piante della sezione dolce
{
$("#menulat").empty();
$("#menulat").append("<p align='center'>filtra per:</p>");
$("#menulat").append("posizione nell'acquario:");
$("#menulat").append("<form>");
$("#menulat").append("<div id='boxinput'><select name='posizione'><option>primo piano</option><option>centrale</option><option>piante da sfondo</option><option>galleggianti</option></select></div>");
$("#menulat").append("

");
$("#menulat").append("temperatura ottimale:");
$("#menulat").append("

");
$("#menulat").append("minima <div id='boxinput'><input type='text' size='5 name='temperaturamin' value='' maxlength='2'></div>
");
$("#menulat").append("massima <div id='boxinput'><input type='text' size='5' name='temperaturamax' value='' maxlength='2'></div>");
$("#menulat").append("

");
$("#menulat").append("luce richiesta (espressa in watt/litro):");
$("#menulat").append("<div id='boxinput'><input type='text' size='5' name='luce' value='' maxlength='3'></div>");
$("#menulat").append("

");
$("#menulat").append("valori dell'acqua:
");
$("#menulat").append("PH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("GH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("KH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("

");
$("#menulat").append("<input type='submit' name='inviafauna' value='cerca'>
");
$("#menulat").append("</form>");
$("#menulat").append("<div id='boxindietro'>[img]indietro.jpg[/img]</div>");
}
function chiudifloradolce ()// chiude la sezione piante e riporta il menu alla schermata apridolce
{
$("#menulat").empty();
$("#menulat").append("
");
$("#menulat").append("[img]floradolce.png[/img]");
$("#menulat").append("[img]faunadolce.png[/img]");
$("#menulat").append("<div id='boxindietro'>[img]indietro.jpg[/img]</div>");
}
function faunadolce()// apre la sezione pesci della sezione dolce
{
$("#menulat").empty();
$("#menulat").append("<p align='center'>filtra per:</p>");
$("#menulat").append("famiglia di appartenenza: ");
$("#menulat").append("<form>");
$("#menulat").append("<div id='boxinput'><select name='famiglia'><option>anabantidi</option><option>caraciformi</option><option>ciclidi</option><option>ciprinidi</option><option>cobitidi</option><option>pecillidi</option><option>siluriformi</option></select></div>");
$("#menulat").append("

");
$("#menulat").append("zona di stazionamento: ");
$("#menulat").append("<div id='boxinput'><select name='zona'><option>fondo</option><option>centrale</option><option>superficie</option></select></div>");
$("#menulat").append("

");
$("#menulat").append("temperatura ottimale:");
$("#menulat").append("

");
$("#menulat").append("minima <div id='boxinput'><input type='text' size='5' name='temperaturamina' value='' maxlength='2'></div>
");
$("#menulat").append("massima <div id='boxinput'><input type='text' size='5' name='temperaturamaxa' value='' maxlength='2'></div>");
$("#menulat").append("

");
$("#menulat").append("valori dell'acqua:
");
$("#menulat").append("PH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("GH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("KH <div id='boxinput'><input type='text' size='5' name='ph' maxlength='5'></div>
");
$("#menulat").append("

");
$("#menulat").append("<input type='submit' name='inviafauna' value='cerca'>
");
$("#menulat").append("</form>");
$("#menulat").append("<div id='boxindietro'>[img]indietro.jpg[/img]</div>");
}
function chiudifaunadolce ()// chiude la sezione pesci e riporta il menu alla schermata apridolce
{
$("#menulat").empty();
$("#menulat").append("
");
$("#menulat").append("[img]floradolce.png[/img]");
$("#menulat").append("[img]faunadolce.png[/img]");
$("#menulat").append("<div id='boxindietro'>[img]indietro.jpg[/img]</div>");
}
</script>

<style type="text/css">
#boxcentrale
{
width: 460px;
height: 120px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -230px;
margin-top: -200px;
/*background-image:url("titolo.jpg");*/
background-repeat:no-repeat;
display:none;
}
.pulsante
{
background-color:#E2E2E2b;
border:1px solid black;
font-size:15px;
color:black;
font-style:bold;
}
#menu
{
list-style:none;
width:200px;
float:right;
}
#pulsmenu
{
list-style:none;
width:350px;
height:30px;
background:#1E22FF;
color:white;
float:right;
text-align:center;
font-size:16px;
padding:7px;
margin-right:10px;
position:static;
}
#menufiltro
{
border:1px solid black;
background:white;
padding:10px;
width:350px;
float:right;
}
body
{
background-image:url("1.jpg");
background-repeat: repeat-x;
height:100%;
}
#imgfondo
{
position:absolute;
bottom:0;
right:0;
background-image:url("img1.png");
background-repeat:no-repeat;
display:none;
}
#imgfondoa
{
position:absolute;
bottom:20px;
/*background-image:url("img2.jpg");*/
background-repeat:no-repeat;
display:none;
}
#menulat
{
position:absolute;
right:10px;
top:64px;
border:1px dashed black;
padding:20px;
height:420px;
width:350px;
text-align:left;
display:none;
}
#sopra {
position:absolute;
right:10px;
top:44px;
width: 440px;
background-image: url("http://acquariumbase.altervista.org/imgmenu1.PNG");
background-repeat: no-repeat;
background-position: bottom right;
display:none;
}
#testomenu
{
text-align:center;
padding:5px;
border:1px dashed black;
background-color:#FDFFBB;
}
#boxindietro
{
position:absolute;
bottom:2px;
right:10px;
}
#boxinput
{
position:absolute;
right:15px;
padding:1px;
}
#pulcima
{
height:20px;
width:100px;
border:1px solid #D4D4D4;
text-align:center;
padding:2px;
background:#D4D4D4;
color:white;
}
#pulcima:link{text-decoration:none};
#pulcima:visited{text-decoration:none};
#pulcima:hover{text-decoration:none;background:#C7C7C7;}
#lineagrigia
{
position:absolute;
top:0px;
left:0px;
width:80%;
height:25px;
background:#D4D4D4;
margin-left:10%;
margin-right:10%;
display:none;
}
#boxcentraleb{}
</style>
</head>
<body>
<div id="lineagrigia">
<span>Home</span><span>Crea</span><span>Novità</span>
</div>
<div id="boxcentrale">
</div>
<span id="imgfondo"></span>
<span id="imgfondoa"></span>
<span id="sopra" onclick="aprimenulat();"></span>
<span id="menulat">
[img]dolce.png[/img]

<div id="testomenu">Sei un principiante o stai cercando una specie con determinate caratteristiche della quale non conosci il nome??
Grazie al potente filtro di Aquarium Base potrai vedere tutte le specie
presenti nel database che rispecchiano le caratteristiche da te inserite in modo da poter scegliere la specie che più si adatta al tuo acquario.
Bastera scegliere i parametri e premere il tasto
"cerca", verranno cosi visualizzate tutte le specie con quelle caratteristiche.</div></span>

</html>

con IE funziona alla perfezione con chrome spuntano alcuni problemi ...

Discussione: problema grafica con i browser

Strumenti discussione

Ricerca discussione

Visualizza

problema grafica con i browser

Permessi di invio