D4j transmenu e immagine di sfondo

[lampo24]

Ho provato ad implementare il codice css per visualizzare un immagine di sfondo nel menu creato con d4j transmenu seguendo queste istruzioni

Però non ottengo nulla..


Io copio l'immagine dentro la dir /images/ e il codice "left.css" lo copio tutto dentro il file mod_d4j_transmenu.css

Il risultato è cio' che vedete qua sotto:



Come fare 

Codice mod_d4j_transmenu.css

Codice: [Seleziona]

/* this is the clipping region for the menu. it's width and height get set by script, depending on the size of the items table */
.transMenu {
position:absolute;
overflow:hidden;
left:-1000px;
top:-1000px;
}

/* this is the main container for the menu itself. it's width and height get set by script, depending on the size of the items table */
.transMenu .content {
position:absolute;
}

/* this table comprises all menu items. each TR is one item. It is relatively positioned so that the shadow and background transparent divs can be positioned underneath it */
.transMenu .items {
position:relative;
left:0px; top:0px;
z-index:2;
}

.transMenu.top .items {
border-top:none;
}

/* each TR.item is one menu item */
.transMenu .item {
    color:#336;
    font-size:10px;
    font-family:sans-serif;
    text-decoration:none;
/* this is a hack for mac/ie5, whom incorrectly cascades the border properties of the parent table to each row */
border:none;
cursor:pointer;
cursor:hand;
}
/*aggiunto da me*/
/* colors */
.left {
background-color: White;
}

.left div.modulecontent {
background-color: #d6dff7;
}

a:link,
a:visited,
a:active {
color: #215dc6;
}

.left td {
color: #215dc6;
}

a:hover {
color: #428eff;
}

/* common part */
/* la classe .left dimensiona l'area sinistra della pagina */

.left {
padding-top:10px;
padding-left: 5px;
padding-right: 5px;
width: 140px;
height: 340px;
margin: 0px;
background-position: left top;
}

.left img {
margin: 0px;
border: 0px;
}

h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}

ul {
list-style: none;
margin: 0;
padding: 0;
}

img {
border: none;
}

/*- Menu --------------------------- */

a.mainlevel:link, a.mainlevel:visited {
display: block;
background: url(../images/button_bg.png) no-repeat;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #ccc;
text-align: left;
padding-top: 5px;
padding-left: 25px;
height: 25px !important;
height: 25px;
width: 130px;
text-decoration: none;
}

a.mainlevel:hover {
background-position: 0px -32px;
text-decoration: none;
color: #fff;
}

a.mainlevel#active_menu {
background-position: 0px -32px;
color:#fff;
font-weight: bold;
}

a.mainlevel#active_menu:hover {
color: #fff;
}

a.sublevel:link, a.sublevel:visited {
padding-left: 5px;
vertical-align: middle;
font-size: 12px;
font-weight: bold;
color: #c64934;
text-align: left;
}

a.sublevel:hover {
color: #900;
text-decoration: none;
}

a.sublevel#active_menu {
color: #333;
}

Altra domanda: Perchè i sottomenu..si visualizzano in alto o in basso e non allineati al menu, come da logica dovrebbe essere ?

[lampo24]

Risolto 

Basta modificare il CSS del template..aggiungendo il codice per inserire l'immagine di sfondo nel menu'.

[eliospeppe]

Altra domanda: Perchè i sottomenu..si visualizzano in alto o in basso e non allineati al menu, come da logica dovrebbe essere ?