Round Corner, Tabbed Menu Problems

[wberesford]

I am using Joomla 1.5 to create a website. The website has a horizontal, round-corners, tabbed menu. I have followed many articles, tutorials etc on how to implement the CSS and required images, in order to achieve the tabbed menu.

Unfortunately, I keep getting the same problem; I am able to place and view the larger, right-hand image on the "a" element, but the left-hand image placed in the CSS of the "li" element does not display at all.

My CSS looks like this:

.moduletabletabs {
margin-left: auto;
margin-right: auto;
width: 768px;
border-bottom: 1px solid #8DA5FF;
margin-bottom: 2em;
}

.moduletabletabs li {
float: right;
background-image: url(../images/tab_left.gif);
background-position: left top;
background-repeat: no-repeat;
margin: 0 1px 0 0;
padding: 0 0 0 8px;
}

.moduletabletabs a {
float: right;
display: block;
background-image: url(../images/tab_right.gif);
background-repeat: no-repeat;
background-position: right top;
padding: 0.2em 10px 0.2em 0;
text-decoration: none;
font-weight: bold;
color: #333366;
}

Any help would be very much appreciated.

Many thanks.

[wberesford]

I’ve just looked at the source code for index.php, and the jdoc statement for the top module, ie the one giving me problems, is outputting as a html <table>, not xhtml as defined in my jdoc statement.

I guess this is the root of my problem, but I can’t seem to change the output of this module to xhtml.

Any help would be very much appreciated. Thank you.

[Author]

Posts