Ciao a tutti ho bisogno di voi.......
Sto creando un template e fin qui tutto ok ma resto fermo ad una problematica
Volevo creare un menu tipo questo nella sezione top
Ma non ci riesco......
Come codice html uso questo
[b]<body>
<div id="principale">
<div id="header"></div>
<div id="divmenu"></div>
<div id="top">
<jdoc:include type="modules" name="top" style="xhtml" />
</div>
<div id="left">
<jdoc:include type="modules" name="left" style="rounded" />
</div>
<div id="main-content">
<jdoc:include type="component" />
</div>
<div id="footer">
<jdoc:include type="modules" name="footer" style="xhtml" />
</div>
</div>[/b]
e come codice css quest'altro
[b]{
padding: 0;
margin: 0;
}
img {
border: 0;
}
a:link, a:visited {
text-decoration: underline;
font-weight: normal;
color: #000;
outline: none;
text-align: left;
}
.float {
float: left;
}
.clear {
clear: both;
}
.overall {
background-color: #fff;
}
body {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 90%;
}
#header {
text-align: center;
margin: auto;
width: 760px;
height: 170px;
background:url(../images/header.jpg);
float:none;
}
#divmenu {
margin: auto;
width: 860px;
height: 75px;
background:url(../images/divmenu.jpg) repeat-x;
}
#principale {
width: 960px;
margin: auto;
text-align: left;
background-color: #ffffff;
border: 2px solid #e2e2e2;
}
#main-content{
width: 598px;
text-align: center;
padding: 20px;
}
#left {
text-align: center;
width: 25%;
float:left;
}
#footer {
text-align: center;
height: 50px;
clear:left;
background:url(../images/divmenufooter.jpg) repeat-x;
margin: auto;
width: 762px;
height: 170px;
}[/b]
sapete voi come è possibile realizzarlo, in pratica tra una pagina e l'altra del menù principale deve essere come nell'immagine.
facendo solo in queso modo:
#top {
background-url: (...images/menutop.jpg);
}
me la ripete per tutto il menu top, anche se metto no-repeat; repeat-x;
non mi da il risultato che voglio; voglio che ad ogni voce del menù principale viene assegnata l'immagine da me creata.
Grazie attendo una vostra risposta.