Css con Firefox

**netsam** · 03-02-2013, 22:56

salve a tutti, ho un problema con un foglio di stile (o almeno cosi penso).
Nel mio sito in locale una pagina che si vede perfettamente con Internet Explorer non viene visualizzata correttamente con Firefox.

Il link con cui richiamo il foglio di stile è:

<html>
<head>
<meta name="author" content="Ignazio Sammarco">
<link href="erbario.css" rel="stylesheet" type="text/css">

ecc.

Non so cosa controllare, mi aiutate?

**Prill** · 03-02-2013, 23:15

Ciao, puoi postare il codice della pagina e il css?

**netsam** · 03-02-2013, 23:24

Certo, il codice della pagina erbario.php è questo (scusa ma non ho capito come si allegano file di codice):

<html>
<head>
<meta name="author" content="Ignazio Sammarco">
<link href="erbario.css" rel="stylesheet" type="text/css">
<script src="../_ajaxScriptacolus/src/prototype.js" type="text/javascript"></script>
<script src="../_ajaxScriptacolus/src/effects.js" type="text/javascript"></script>
<script src="../_ajaxScriptacolus/src/scriptaculous.js" type="text/javascript"></script>

<link rel="stylesheet" href="/resources/demos/style.css" />

<title>Universita' degli Studi di Palermo: Erbario micologico</title>

</head>

<?
require("db_connection.php");
include "php/funzioni_mysql.php";

// Trova il numero di Specie in erbario
$query = "select IdFungo from erb_erbario group by IdFungo";
$result_specie = mysql_query ($query, $conn) or die('Problemi2');
$numrow_specie = mysql_num_rows($result_specie);

// Trova il numero di SCHEDA corrente
//$query = "select IdErbario from erb_erbario order by IdErbario DESC";
//$result_schede = mysql_query ($query, $conn) or die('Problemi2');
//$array= mysql_fetch_array($result_schede);
//$numrow_schede = "$array[IdErbario]";
//$numrow_schede = mysql_num_rows($result_schede);

?>

<body onLoad="document.frm.reset();">

<script type="text/javascript">

window.onload = function()
{
document.getElementById('specie').focus()
}

</script>

<form name ="frm" action="<?php echo $_SERVER['PHP_SELF'];?>" method="POST" >
<input type="hidden" name="inv_idfungo" value="<?php echo($inv_idfungo)?>"/>
<input type="hidden" name="inv_idlocalita" value="<?php echo($inv_idlocalita)?>" />
<input type="hidden" name="inv_idhabitat" value="<?php echo($inv_idhabitat)?>" />

<div style="position:absolute; left:620px; top: 0px; width:200; padding: 1em;">
<h2>Ultima Scheda: <?php echo($numrow_schede) ?> </h2>

</div>

<div style="position:absolute; top: 0px; width:160px; padding: 1em;">
<h2>Specie:</h2>
<input type='text' id = "specie" name='specie' value='<?php echo($specie) ?>'>
<?php
if($specieErr) echo("<font color='red' size='2'> Specie Obbligatoria</font>");
else if($inv_idfungoErr) echo("<font color='red' size='2'> Specie inesistente</font>");?>

<div id = "txtHint" class="txtLocalita"> </div>
</div>

<div id="suggerimenti_specie" class="boxsuggerimenti"></div>
<script type="text/javascript">
new Ajax.Autocompleter("specie", "suggerimenti_specie", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
function getSelectionId(text, li){
showFunghiErbario(li.id);
document.getElementById('inv_idfungo').value=li.id ;
}
</script>
<div id= "aggErb" style="position:absolute;left:620px; top: 50px; width:200px; padding: 1em; background-color:#afec80;">
Localita': <input type='text' name='localita' value='<?php echo($localita) ?>'>
<?php
if($localitaErr) echo("<font color='red' size='2'> Localita Obbligatoria</font>");
else if($inv_idlocalitaErr) echo("<font color='red' size='2'> Localita inesistente</font>");?>

<div id="suggerimenti_localita" class="boxsuggerimenti"></div>
<script type="text/javascript">
new Ajax.Autocompleter("localita", "suggerimenti_localita", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
function getSelectionId(text, li){
document.getElementById('inv_idlocalita').value=li .id;
}
</script>
Comune: <input disabled="disabled" type='text' name='comune' value='<?php echo($comune) ?>'>

Provincia: <input disabled="disabled" name="provincia" type="text" value='<?php echo($provincia) ?>'>

Data ritrov.: <input name="data_ritr" type="text" value='<?php echo($data_ritr) ?>'><?php if($data_ritrErr) echo("<font color='red' size='2'> Data Obbligatorio</font>");?>

Habitat: <input name="habitat" type="text" value='<?php echo($habitat) ?>'

<div id="suggerimenti_habitat" class="boxsuggerimenti"></div>
<script type="text/javascript">
new Ajax.Autocompleter("habitat", "suggerimenti_habitat", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
function getSelectionId(text, li){
document.getElementById('inv_idhabitat').value=li. id;
} </script>

Substrato: <input name="substrato" type="text" value='<?php echo($substrato) ?>'>

Leg.: <input type='text' name='leg' value='<?php echo($leg) ?>'> <?php if($legErr) echo("<font color='red' size='2'> Leg. Obbligatorio</font>");?>

Det.: <input name="det" type="text" value='<?php echo($det) ?>'>

Note: <textarea name="note" cols ="40" rows="2"><?php echo($note)?></textarea>

<input name="action" type="submit" value="aggiungi"></>
</div>
</form>

<?

if(@$_REQUEST['action']=="aggiungi"){
if ($localitaErr == 0 && $specieErr == 0 && $legErr == 0 && $inv_idfungoErr == 0 && $inv_idlocalitaErr == 0 && $data_ritrErr == 0) {
$inv_idfungo = $_REQUEST['inv_idfungo'];
$inv_idlocalita = $_REQUEST['inv_idlocalita'];
$inv_idhabitat = $_REQUEST['inv_idhabitat'];
$leg = $_REQUEST['leg'];
$det = $_REQUEST['det'];
$note = $_REQUEST['note'];
$data_ritr = $_REQUEST['data_ritr'];
$substrato = $_REQUEST['substrato'];
mysql_query("INSERT INTO erb_erbario (IdFungo, IdLocalita, IdHabitat, Leg, Det, Note, DataRaccolta, Substrato)
VALUES('$inv_idfungo', '$inv_idlocalita', '$inv_idhabitat', '$leg', '$det', '$note', '$data_ritr', '$substrato');");

//$query = "select IdErbario from erb_erbario order by IdErbario DESC";
//$result_schede = mysql_query ($query, $conn) or die('Problemi2');
//$array= mysql_fetch_array($result_schede);
//$numrow_schede = "$array[IdErbario]";
}
}

?>

</body>
</html>

Mentre il file erbario.css è questo:

/* Erbario Foglio di Stile */

h1 {
font-family: verdana,helvetica;
font-size: 16px;
font-weight: bold;
color: #bb3902;
}
h2 {
font-family: verdana,helvetica;
font-size: 15px;
font-weight: bold;
color: #bb3902;
}
h3 {
font-family: verdana,helvetica;
font-size: 13px;
font-weight: bold;
color: #bb3902;
}

h4 {
font-family: verdana,helvetica;
font-size: 15px;
font-weight: bold;
color: #000000;
}

body {
font-family: verdana,helvetica;
color: #000000;
background-color: #f8e8a0;
font-size: 12px;
}
body.n {
font-family: verdana,helvetica;
color: #000000;
background-color: #f87820;
margin-left:-8px;
margin-top:-8px;
font-size: 10px;
}
body.white {
font-family: verdana,helvetica;
color: #000000;
background-color: #ffffff;
font-size: 10px;
}

a {
font-family: verdana,helvetica;
font-size: 12px;
}

.tabval {
font-family: verdana,helvetica;
color: #000000;
background-color: #ffffff;
font-weight: plain;
font-size: 10pt;
}
.tabhead {
font-family: verdana,helvetica;
color: #ffffff;
font-weight: bold;
font-size: 10pt;
}
.nh {
font-family: verdana,helvetica;
color: #ffffff;
font-weight: bold;
font-size: 10pt;
}

.navi {
font-family: verdana,helvetica;
background-color: #fb7922;
color: #ffffff;
font-size: 10px;
}

/*
p {
font-family: verdana,helvetica;
color: #000000;
font-size: 11px;
}
*/

.small {
font-family: verdana,helvetica;
color: #db5902;
font-size: 10px;
}
.big {
font-family: verdana,helvetica;
color: #000000;
background-color: #ffffff;
/* font-weight: bold; */
font-size: 12px;
}

.h {
font-family: verdana,helvetica;
color: #3c3c5c;
background-color: #ffffff;
font-size: 12px;
}
.d {
font-family: verdana,helvetica;
color: #ffffff;
background-color: #fb7922;
font-size: 12px;
}

.white {
font-family: verdana,helvetica;
color: #ffffff;
font-weight: bold;
font-size: 12pt;
}
.black {
font-family: verdana,helvetica;
color: #000000;
font-weight: normal;
font-size: 12px;
}
.blue {
font-family: verdana,helvetica;
color: #3c3c5c;
font-weight: normal;
font-size: 10px;
text-decoration: underline;
}
.red {
font-family: verdana,helvetica;
color: #ffffff;
background-color: #df0000;
font-weight: bold;
font-size: 10px;
}
.green {
font-family: verdana,helvetica;
color: #ffffff;
background-color: #00df00;
font-weight: bold;
font-size: 10px;
}
.yellow {
font-family: verdana,helvetica;
color: #ffffff;
background-color: #dfdf00;
font-weight: bold;
font-size: 10px;
}

td {
font-family: verdana,helvetica;
color: #000000;
font-size: 11px;
/*font-weight: normal; */
}
th {
font-family: verdana,helvetica;
color: #000000;
font-size: 13px;
font-weight: bold;
}
.tabhead {
font-family: verdana,helvetica;
color: #ffffff;
font-weight: bold;
font-size: 10pt;
}

input{
font-family:Verdana;
font-size:15px;
width:400px;
}

div.boxsuggerimenti {
font-family:Verdana;
font-size:15px;
position:absolute;
background-color:white;
border:1px solid #888;
margin:0px;
padding:0px;
}
div.boxsuggerimenti ul {
list-style-type:none;
margin:0px;
padding:0px;
}
div.boxsuggerimenti ul li.selected {
background-color: #C2EBEF;
}
div.boxsuggerimenti ul li {
list-style-type:none;
display:block;
margin:0;
padding:0px;
cursor

ointer;
border-bottom:1px solid #888;
}

a.n:link:focus, a.n:visited:focus {-moz-outline:0px;}
a.n:link { font-size: 10pt; color: #ffffff; font-weight:normal; text-decoration:none;}
a.n:visited { font-size: 10pt; color: #ffffff; font-weight:normal; text-decoration:none;}
a.n:active { font-size: 10pt; color: #ffffff; font-weight:normal; text-decoration:none;}
a.n:hover { font-size: 10pt; background-color: #ffffff; color: #fb7822; font-weight:normal; text-decoration:none;}
a.nh:link:focus, a.nh:visited:focus {-moz-outline:0px;}

a.nh:link { font-size: 10pt; background-color: #ffffff; color: #fb7822; font-weight:normal; text-decoration:none;}
a.nh:visited { font-size: 10pt; background-color: #ffffff; color: #fb7822; font-weight:normal; text-decoration:none;}
a.nh:active { font-size: 10pt; background-color: #ffffff; color: #fb7822; font-weight:normal; text-decoration:none;}
a.nh:hover { font-size: 10pt; background-color: #ffffff; color: #fb7822; font-weight:normal; text-decoration:none;}

a:link { color: #bb3902; font-weight:normal; text-decoration:underline;}
a:visited { color: #bb3902; font-weight:normal; text-decoration:underline;}
a:active { color: #bb3902; font-weight:normal; text-decoration:underline;}
a:hover { color: #bb3902; font-weight:normal; text-decoration:underline;}

#langsel {
font-family: Verdana;
font-size: 8px;
vertical-align: bottom;
padding-bottom: 1px;
padding-left: 10px;
padding-right: 10px;
}

#langsel div {
float: right;
}

#langsel a {
color: #000;
text-decoration: none;
font-family: Verdana;
font-size: 10px;
}

#langsel a:hover {
text-decoration: underline;
}

**netsam** · 03-02-2013, 23:26

scusami ma è partito un doppio invio, sono uguali.

**Prill** · 03-02-2013, 23:49

puoi inserire il codice attraverso il tasto code o racchiudendolo in [ code ] [ /code ] (senza spazi fra code e parentesi9.
Chiedevo il codice html perché per capire il problema spesso è necessario vedere la pagina e quindi riprodurla. Il codice php non è d'aiuto. Copia l'html risultante dalla visualizzazione del sorgente dal browser, oppure se hai la pagina on line inserisci direttamente un link che è ancora meglio

**ResianTaxidrive** · 04-02-2013, 19:41

Direi che innanzitutto ti manca il
<!DOCTYPE html>
come prima riga del codice.

Ho tolto il messaggio doppio, occupava veramente troppo spazio.

Segui quanto detto da Prill su come postare il codice (e soprattutto quale codice NON postare).

**netsam** · 09-02-2013, 22:13

Grazie dei consigli. Allora ho copiato il codice html del file erbario.php restituitomi da Firefox.

Eccolo:

codice:

<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> 
	<meta name="author" content="Ignazio Sammarco">
	<link href="erb_files/erbario.css" rel="stylesheet" type="text/css">
	<script src="erb_files/prototype.js" type="text/javascript"></script>
	<script src="erb_files/effects.js" type="text/javascript"></script>
	<script src="erb_files/scriptaculous.js" type="text/javascript"></script><script type="text/javascript" src="erb_files/builder.js"></script><script type="text/javascript" src="erb_files/effects.js"></script><script type="text/javascript" src="erb_files/dragdrop.js"></script><script type="text/javascript" src="erb_files/controls.js"></script><script type="text/javascript" src="erb_files/slider.js"></script><script type="text/javascript" src="erb_files/sound.js"></script>

        <link rel="stylesheet" href="erb_files/style.html">



<title>Universita' degli Studi di Palermo: Erbario micologico</title>

<script type="text/javascript">

// Funzione per mostrare tutti i ritrovamenti del fungo con id = str(passata come parametro), nella tabella erb_erbario
function showFunghiErbario(str, str2)
{
  var xmlhttp;
  if (str=="")
  {
    document.getElementById("txtHint").innerHTML="";
    return;
  }
  if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","getfunghierb.php?idfungo="+str,true);
  
  xmlhttp.send();
}

</script></head>






<body onload="document.frm.reset();"> 

<script type="text/javascript">

window.onload = function()
{
document.getElementById('specie').focus()
}

</script> 
 

<form name="frm" action="/erbario/erbario.php" method="POST">					
	<input name="inv_idfungo" value="" type="hidden">
	<input name="inv_idlocalita" value="" type="hidden">
	<input name="inv_idhabitat" value="" type="hidden">
	
	<div style="position:absolute; left:620px; top: 0px; width:200; padding: 1em;"> 
	<h2>Ultima Scheda: 5145 </h2> 

	</div>

    <div style="position:absolute; top: 0px; width:160px; padding: 1em;">
        <h2>Specie:</h2>
        <input autocomplete="off" id="specie" name="specie" type="text"> 
		        

        

        <div id="txtHint" class="txtLocalita"> </div>
    </div>

    <div style="display: none;" id="suggerimenti_specie" class="boxsuggerimenti"></div>
    <script type="text/javascript">
	new Ajax.Autocompleter("specie", "suggerimenti_specie", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
	function getSelectionId(text, li){
		showFunghiErbario(li.id);
		document.getElementById('inv_idfungo').value=li.id;
	}
    </script>
	<div id="aggErb" style="position:absolute;left:620px; top: 50px; width:200px; padding: 1em; background-color:#afec80;"> 
		Localita': <input name="localita" type="text"> 
		        

	<div id="suggerimenti_localita" class="boxsuggerimenti"></div>
		<script type="text/javascript">
			new Ajax.Autocompleter("localita", "suggerimenti_localita", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
			function getSelectionId(text, li){
			document.getElementById('inv_idlocalita').value=li.id;
			}	
		</script>
	Comune: <input disabled="disabled" name="comune" type="text"> 
	

	Provincia: <input disabled="disabled" name="provincia" type="text"> 

	

	Data ritrov.: <input name="data_ritr" type="text"> 

	Habitat: <input name="habitat" <br="" type="text">
	<div id="suggerimenti_habitat" class="boxsuggerimenti"></div>
	<script type="text/javascript"> 
	  new Ajax.Autocompleter("habitat", "suggerimenti_habitat", "cerca.php", {minChars: 2, afterUpdateElement: getSelectionId});
	  function getSelectionId(text, li){
		document.getElementById('inv_idhabitat').value=li.id;
}	</script>
    

    

	Substrato: <input name="substrato" type="text"> 

        Leg.: <input name="leg" type="text">         

        Det.: <input name="det" type="text"> 

	Note: <textarea name="note" cols="40" rows="2"></textarea> 

	

	<input name="action" value="aggiungi" type="submit">
   </div>
</form>
 
 </body></html>

Il file css è lo stesso di prima.

**Prill** · 09-02-2013, 22:51

aggiungi innanzitutto il doctype, come già suggerito, potrebbe andar bene anche questo:

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

poi, nel codice che hai postato vedo un

codice:

<link rel="stylesheet" href="erb_files/style.html">

un foglio di stile deve avere estensione .css

Guardo appena possibile con più attenzione, al momento (ma chiaramente non posso vedere la pagina completa) mi appaiono delle sfasature nel form e una sovrapposizione del form sul testo "scheda ..."

**netsam** · 10-02-2013, 02:21

In effetti quel foglio di stile non lo uso, l'ho cancellato. L'unico che uso è erbario.css.

Discussione: Css con Firefox

Strumenti discussione

Ricerca discussione

Visualizza

Css con Firefox

Permessi di invio