Problems with list display in IE6 and 7

[theplastickid]

Hello there,

Im having a bit of bother with one of my list items, looks like something very simple but just cant sus it out. My site is a Joomla based site and I am only working locally with it at the moment so I can’t upload it to a URL but I can provide screenshot and html/css code.

As you can see below my pole dancing lessons link is not dropping below my previous issues link.

Here is the html:

[img]http://img8.imageshack.us/img8/419/screenns.th.jpg[/img]

Code:

Browse

• Previous Issues
• Pole Dancing Lessons
• Pole Dancing Competition
• Pole Dancing Video
• Pole Dancing Moves

and here is the CSS:

Quote:

#sidebarA {
background: url(images/left-breaker.jpg) repeat-y;
float: left;
width: 210px;
}

#sidebarA .moduletable .menu .item16 {
padding: 0 0 25px 0;
}

#sidebarA .moduletable h3 {
color: #fffc01;
font-family: Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-size: 14px;
clear: left;
}

#sidebarA .moduletable a:link,
#sidebarA .moduletable a:visited {
color: #fff;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}

#sidebarA .moduletable a:hover {
text-decoration: underline;
}

#sidebarA .moduletable li.active a:visited {
color: #be26b9;
}

.moduletablesidebar-about h3 {
clear: left;
padding: 25px 0 10px 10px;
line-height: 140%;
color: #fffc01;
font-family: Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-size: 14px;
}

.moduletablesidebar-about p {
color: #fff;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 10px 20px 0 10px;
line-height: 140%;
}

If anyone could help, i’d really appreciate it. This is displaying fine in firefox and IE8 just not IE6 and ie7.

[TheDoc]

Why does each item have a span around it?

To be honest, I can’t see much wrong with it. Though, the CSS you posted doesn’t particular correlate very well with the menu provided. I noticed in the CSS that you had special styling for item16, but an item16 does not exist in your list.

What happens if you change the content of that <li> to, say…. "Pole"? Just one word. See if it’s somehow going crazy due to the long title.

[theplastickid]

"TheDoc" wrote:

Why does each item have a span around it?

Joomla Automatically inserts these.

"TheDoc" wrote:

I noticed in the CSS that you had special styling for item16, but an item16 does not exist in your list.

Your right I have removed this line now.

"TheDoc" wrote:

What happens if you change the content of that <li> to, say…. "Pole"? Just one word. See if it’s somehow going crazy due to the long title.

Tried this makes no change.

I am starting to think actually that it may have something to do with the hierarchical structure of Joomlas sections and catagories.

[ChetGarrison]

I copied the code you provided and the list appears fine in IE6,7 and firefox. The problem is probably coming from whatever else is going on on the page. Also, the css doesn’t have any styles for the actual list or list items, only for the anchor links in the list. I would start by putting borders around the list item to see what is actually going on. Using borders can usually point you in the right direction… hope that helps. Good luck!

[theplastickid]

"ChetGarrison" wrote:

I copied the code you provided and the list appears fine in IE6,7 and firefox. The problem is probably coming from whatever else is going on on the page. Also, the css doesn’t have any styles for the actual list or list items, only for the anchor links in the list. I would start by putting borders around the list item to see what is actually going on. Using borders can usually point you in the right direction… hope that helps. Good luck!

Thank you for the reply, I have since sat down and debugged the whole site, it appears I had a banner playing up as well in the top of the page, I fixed that and the links now work. Its amazing how little things can mess up lots of things on your page.

Appreciate all the help guys.
Thanks.

[Author]

Posts