Formattazioni ballerine ??

**makikaz** · 15-01-2009, 13:29

Ciao,
ho una pagina HTML formattata tramite CSS. Ora mi succede uno cosa strana.
Ho un paio di righe che sono formattate con un colore di background (una giallina e l'altra ciano).
Quando viene visualizzata la pagina le due righe appaiono in colore classico Nero su bianco.
se faccio lo scroll verticale della pagina verso il basso e poi ritorno alla posizione iniziale le due righe hanno il corretto colore di background.
Se faccio il refresh della pagina tornano nero su bianco.....
E' un problema del browser ? (IE 6)
Serve che posto il codice ?

Grazie.

**fcaldera** · 15-01-2009, 13:35

Originariamente inviato da makikaz
Serve che posto il codice ?

Assolutamente sì, altrimenti nessuno potrà aiutarti

**makikaz** · 15-01-2009, 14:29

Ecco qua...

codice:


  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Layout a tre colonne con posizionamenti assoluti</title>
<link href="CSS/template_css.css" rel="stylesheet" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 3.0">
<script type="text/javascript" src="JScript/ClickShowHideMenu.js"></script>
<script language="javascript1.2">
var foto = new Array(3);
foto[0] = "i1.gif";
foto[1] = "i2.gif";
foto[2] = "i3.gif";
var attuale = 0;

function cambia_img()
{ document.getElementById("immagine").src= foto[(attuale++)%3];
timer();
}
function timer()
{ setTimeout("cambia_img();", 1000);
}
</script>



</head>

<body onLoad="Xtimer()">

<div id="container">
    <div id="header">
        <h1>Titolo</h1>
    </div>
    <div id="content">
        <div class="banner">
            <tag:banner />
        </div>
        <div class="box">
             <form method='post' action = 'User_Profilo.php'>
               
                 
                <div id="titolo2">
                 

    I tuoi dati attuali sono i seguenti </p>
                </div> 
                 
	        

  User id    : pippo   </p>
	        

  Nominativo : Pippo </p>
	        

  eMail      : pippo@libero.it </p> 
	        
	        <div id="titolo2">
                   

  Puoi modificare i seguenti dati </p>
                </div>
                <div id="titolo3">
                   

       PASSWORD </p>
                </div>      
                
	        

 <input type='password' name='txtPwd' size='20' maxlength='20'         VALUE='' > password </p>
	        

 <input type='password' name='txtPwdconf' size='20' maxlength='20'     VALUE=''> conferma password </p>
	       	        
                <div id="titolo3">
                   

       INVIO NEWS LETTER </p>
                </div>      
                                 
                
                

 <input type='checkbox' name='chkNews'                                 VALUE='1'> Iscritto alle news </p>        	        
                

	        

 <input type='submit' value ='Conferma'  name='cmdLogin'> 
	      </form>
	      
	      <form method='post' action = 'index.php'>
	        <input  type='submit' value ='Annulla'   name='cmdReset'>
	      </form>
	      <div id="Messaggio">
	          
	      </div>   
        </div>
         
    </div>
    <div id="extra">
        
    </div>
    <div id="navigation">
       <tag:LeftPanel />
       <div>

 <tag:info /> </p></div>
    </div>

    <div id="footer"> <table>[b]<TR><TD> © 2008 - Creato da Raffaele  </TD></TR></TABLE> </div>
</div>
 
</body>
</html>

evidenziati in rosso sono quelli incriminati.

Di seguito il codice CSS:

codice:

html,body{margin: 0;padding:0}
body{font-family: arial,sans-serif;font-size: 12px;text-align: center}
div#container{position: relative; width: 820px;margin: 0px auto;
              border-left: 1px solid #000; border-right: 1px solid #000;
              background-color: #eee;color: #000;text-align: left}

/*stili generici, su header e footer*/
div#header{height: 80px;background-color:#FFFFCC;
                        color: #000066;
}
div#t_shadow { background: #6a6a6a; font-size: 20px}
div#t_shadow a { color: #000; text-shadow: 0 1px 0 #fff; text-decoration:none }
div#t_shadow a:hover{color: #fff; text-shadow: 0px 0 15px #76EE00;}

div#t_shadow_12 { background: #666666; font-size: 12px}
div#t_shadow_12 a { color: #000; text-shadow: 0 1px 0 #fff; text-decoration:none }
div#t_shadow_12 a:hover{color: #fff; text-shadow: 0px 0 15px #76EE00;}

div#header a{color: #eee;text-decoration:none;color: #000066;}
h1,h2,h3,p{margin: 0}
p{padding-bottom: 10px}
h3{padding-top: 10px}
h1{padding-left:10px;font: bold 2.3em/80px georgia,times,serif}
h2{font-size: 1.5em}
h3{font-size: 1.2em}
div#footer a{color:#ff0;font-weight: bold;text-decoration: underline}

/*stili specifici per il layout*/
div#navigation{position: absolute; top: 80px; left: 0;
    width: 130px;\width:130px;padding: 1em 0 0 10px;
    }
div#extra{position: absolute; top: 80px; right: 0;
    width: 130px;\width:130px;padding: 1em 5px;
    font-size: 1.2em}

div#content{margin: 0 140px 0 170px;padding: 1em 10px;background-color: #fff}
div#footer{text-align:center; padding: 5px 20px;
    background-color: #FFFFCC; color: #000066}

/*stili per la navigazione*/
div#navigation {margin: 0 0 20px;padding: 0; list-style-type: none}
div#navigation ul a{display:block;width: 90px;border-bottom: 1px solid #fff;color:#222;
    font-weight:bold; text-decoration: none}
/*
div#navigation a:hover{background-color: #fff;color: #FFFFFF}
div#navigation ul a#activelink{color: #f00;text-decoration: none}
*/

div#navigation a:link {color: #FFFFFF;text-decoration: none}
div#navigation a:hover {{color: #FFFF99;}
div#navigation a:activelink{color: #FFFF33;text-decoration: none}
div#navigation a:visited {color: #CCFFCC;text-decoration: none }


div#minilink a{margin: 20px 0;display: block;border: 1px inset #666;width:90px;line-height: 40px;
    background-color: #fff;color: #000;text-align: center;text-decoration: none}
div#minilink a:hover{font-size: 2em;font-weight: bold;color: #ccc}

/*stili per la sezione extra*/
div#extra div.newsbox{font-size: 90%;margin-bottom: 2em}
div#extra div.newsbox h2{padding: 1px 2px;background-color: #999;color: #fff;font-size: 1.2em}
div#extra div.newsbox p{margin-bottom: 1px;}
}
}

/*stili per la sezione extra Login*/
div#extra div.login{font-size: 90%;margin-bottom: 2em ; border-top: 1px dotted #ccc; border-bottom: 1px dotted #ccc}
div#extra div.login h2{background-color: #999;color: #fff;font-size: 1.2em}
div#extra div.login p{margin-bottom: 1px;}


/*stili per i contenuti*/
div#content{border-left: 1px solid #999; border-right: 1px solid #999}
div.textimage{border-bottom: 1px dotted #999; width: 100%} /*risolve il peek-a-boo bug di IE6*/
div.textimage img{float:left;margin: 10px}
div.textimage h2{margin-top: 10px}

/*
div.box{clear:left; border: 2px double #ccc; padding: 5 px;}
*/
div.box p{padding: 5 px;}

div.wide,div.split2,div.split3,div.banner{clear:left}
div.banner{margin: 0 1%; border-top: 1px double #ccc}
div.wide {margin-top: 25px}
div.wide h2{color: #00f}
div.split2 div{float: left; width: 208px; \width: 218px; w\idth: 208px;padding: 0 5px}
div.split3 div{float: left; width: 135px; \width: 145px; w\idth: 135px;padding: 0 5px;
    border-top: 1px dotted #ccc}


#imgNews {float:left; margin:10px}


div#titolo2 {color: black; background-color: #aaccaa; ;text-align: center;
             font-size: 18px }

div#titolo3 {color: black; background-color: #ffffaa; text-align: left;
             font-size: 14px  }               





/* stili aggiunti per il menù drop down verticale */
.click-menu {
    }
    .click-menu .box1 {
        background: url("../Image/Menu/button1.gif") no-repeat;
        color: #f9f9f9;
    }
    .click-menu .box1-hover {
        background: url("../Image/Menu/button1.gif") no-repeat;
        color: #FFEBA9;
    }
    .click-menu .box1-open {
        background: url("../Image/Menu/button1-click.gif") no-repeat;
        color: #f9f9f9;
    }
    .click-menu .box1-open-hover {
        background: url("../Image/Menu/button1-click.gif") no-repeat;
        color: #FFEBA9;
    }
    .click-menu .box1,
    .click-menu .box1-hover,
    .click-menu .box1-open,
    .click-menu .box1-open-hover {
        text-indent: 12px;
        font-weight: bold;
        font-size: 14px;
        line-height: 31px;
        font-family: arial;
        cursor: pointer;
        width: 150px;
    }
    .click-menu .section {
        background-color: #46351F;
        font-family: arial;
        font-size: 13px;
        line-height: 15px;
        padding: 0 0 5px 10px;
        display: none;
    }
    .click-menu .section a {
        color: #FFFF99;
        text-decoration: none;
        white-space: nowrap;
    }
    .click-menu .section a:hover {
        color: #FFFF99;
        text-decoration: none;
        white-space: nowrap;
    }
    .click-menu .box2 {
        border-color: #7B6139;
        border-width: 1px;
        border-style: none none solid solid;
        padding: 1px 0 2px 6px;
    }
    .click-menu .box2-hover {
        border-color:  #7B6139;
        border-width: 1px;
        border-style: none none solid solid;
        padding: 1px 0 2px 6px;
        background: #5B4529;
    }

Anche in questo caso le righe in rosso sono quelle che dovrebbero formattarmi correttamente le mie righe HTML.

Grazie ancora....

Discussione: Formattazioni ballerine ??

Strumenti discussione

Ricerca discussione

Visualizza

Formattazioni ballerine ??

Re: Formattazioni ballerine ??

Permessi di invio