Css help Gif isn't floating left and allowing text to flow beside it

[UncleMortis]

Hi everyone. Just got my css and html validated and have noticed that instead of the gif floating left and allowing the text to flow beside it, it's acting as if it's been told push the text below the gif. I can't see anything that I've done wrong, (it was working fine earlier). Any ideas as to why it's not floating left? The site is

http://www.gdcycles.com.au

(the gif is on the first page above the text).

Also noticing that the menu is "ghosting" the text when you mouse over it, It's putting the catagory above or below onto another menu catagory. So far no one else has seen it, is it just being buggy on my pc?

 

[UncleMortis]

It's ok, the float was Float, always something tiny. Would appreciate any input into the "bug" that seems to plague me at the moment.

 

[Vragabond]

I cannot see this "ghosting" effect on any of my browsers. I am not really sure what I should be seeing as well.

 

[UncleMortis]

I'm not sure why it's doing it, it's just started doing it and I haven't done anything different to the menu apart from make certain parts of it transparent. I'll turn the back ground of the menu li black, and then the words "bikes" for example will appear to follow the cursor over the rest of the menu and jumble all the words up. Just wanting to know if anyone else is seeing it. It's also causing the lines between the menu items to move as well. I'm using ie 6.

 

[Vragabond]

I cannot really uniformly reproduce your error. I have toyed around with IE6 for a while and the problem did start appearing, but it is hard to say why or how.

 

[UncleMortis]

Great I've hacked ie6 and done terrible things to it without knowing, lol.

 

[UncleMortis]

Ok, tried the menu on another computer, and the same problem occurs. If I mouse over one item on the menu and move up or down, it puts that word over another menu item until it's all mixed up and unreadable. What is causing this? I've had that menu up for close to a year and it worked fine, but I validate the css and html and it goes funny all of a sudden.

 

[Foamcow]

Looking at the CSS the first thing that struck me was that it's formatting was messy. Thought that won't effect how it works it does make it more difficult to diagnose problems.

Here, I've extracted the bit that deals with the main navigation nad reformatted it a bit so it's more readbale.

ul#mainNav {
	list-style:none;
	margin:0;
	padding:0;
	background-color:transparent;
	}

ul#mainNav li a:link, ul#mainNav li a:visited {
	text-decoration:none;
	display:block;
	width:100%;
	padding:6px 6%;
	background-color: transparent;
	font:bold 10pt/1.5 arial, sans-serif;
	color: #fff;
	}

ul#mainNav li {
	border-top: 1px solid #a5b5c6;
	}

ul#mainNav li a:hover {
	background-image: url(background.gif) ;
	color:#eee;
	}

ul#mainNav ul.subNav {
	list-style: none;
	margin: 0;
	padding: 0;
	}

There is nothing that jumps out at me as being the cause of the problem. All I can suggest is that you put the ul#mainNav li declaration before the ul#mainNav li a:link etc. This probably won't fix it but it's possible IE is getting confused.

Try extracting the navigation from your page and put it into a document on it's own. Then apply just the CSS for the menu and strip it down to the basics to try and find the problem.

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[UncleMortis]

I'll try that, thanks. The thing that's annoying is that it didn't do this before I validated and put a doctype in. Nope didn't work. I've managed to take a picture of the screen when it does it. the link is:

http://i35.photobucket.com/albums/d176/mortislegion/menu_gd.jpg

You'll see what it's doing. Seems to be sporadic, as when I tried it on the other pc, (at the bike shop), the error happened to me, but when we got it back up, it didn't do it again. Hopefully you can see the blurry text in the picture, the original is bigger and able to see it better.

 

[Foamcow]

I can see it. I managed to replicate the problem in IE.


Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK