Ciao a tutti,
sono alle prime armi(riguardo i css) ed ho riscontrato questa difficolta.
Ho trovato su un sito(non lo dico per evitare di fare pubblicità) la realizzazione di un rollover disgiunto con i css.
Ho copiato il file e ora lo sto modificando per impararare.
Mi piacerebbe inserire nell'header del documento un'immagine che ho creato della stessa sua dimensione 1010x50 pixel.
Questo e' il codice che scrivo:
#testata{
margin:0;
padding:0;
height:60px;
line-height:40px;
background-image:url(moca header.jpg);
}
Purtroppo non accade nulla,perche'?
Posto tutto il css:
html, body{
margin:0;
padding:0;
font-family:Verdana, sans-serif;
text-align:center;
}
#container{
margin:20px auto;
padding:0;
width:1020px;
height:520px;
border:1px solid #f00;
text-align:center;
}
#testata{
margin:0;
padding:0;
height:60px;
line-height:40px;
background-image:url(moca header.jpg);
}
#testata h4{
margin:0;
padding:5px;
font-size:1.1em;
}
#corpo{
margin:0;
padding:0;
background-color:#ddd;
height:450px;
text-align:left;
position:relative;
}
#menu{
float:left;
margin:0;
padding:0;
width:200px;
height:100%;
background-color:#fff;
text-align:left;
}
#menu ul{
margin:0;
padding:0;
list-style-type:none;
list-style-positionutside;
line-height:1.6em;
}
#menu li a{
margin:4px 0 0 10px;
padding:0;
width:170px;
display:block;
font-weight:bold;
font-size:76%;
text-decoration:none;
color:#09d;
border:1px solid #fff;
}
#menu li a:visited{
margin:4px 0 0 10px;
padding:0;
font-weight:bold;
text-decoration:underline;
color:#f60;
border:1px solid #fff;
background-color:#ddd;
}
#menu li a:hover{
margin:4px 0 0 10px;
padding:0;
text-decoration:none;
border:1px dashed #666;
color:#000;
background-color:#ddd;
}
#menu li a span {
display: none;
}
#menu li a:hover span {
width: 400px; margin: 0;
padding:10px;
position: absolute;
left:400px;
top: 100px; display: block; z-index: 100; font-weight:normal;
text-align: left;
border: 2px outset #000;
text-align:justify;
background:#fff;
}
#content{
margin:0;
padding:0;
height:100%;
width:498px;
background-color:transparent; float:right;
text-align:left;
}
#content h4{
margin:0;
padding-top:5px;
padding-left:5px;
padding-bottom:5px;
color:#000;
}
Grazie
Rispondi quotando
