2 replies [Last post]
Last seen: 13 years 14 weeks ago
Joined: 2009-04-30
Posts: 1
Points: 0

I have a simple web page for prototyping a CSS image map based on Stu Nicholls' technique:


The map works great, just how I want. However, there is a strange vertical line that appears on the map when the cursor is not hovered over the map. The web page contains all the CSS so if you look at the source, you'll see everything you need to help me debug this, except for the images. I can assure you the images contain no such vertical line. It has to be coming from the CSS, but for the life of me, I can't figure it out.

CupidsToejam's picture
Last seen: 6 years 47 weeks ago
Timezone: GMT-4
Joined: 2008-08-15
Posts: 2637
Points: 1556

very strange indeed. Dont

very strange indeed. Dont ask me why, but I made the change in bold, and the line went away.

#imap a#sw {display:block; width:101px; height:131px; background:transparent url(swhover.gif) <span style="font-weight:bold">-110px</span> -100px no-repeat; text-decoration:none; z-index:20;}

Stomme poes
Stomme poes's picture
Last seen: 10 years 41 weeks ago
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

So Cupid moved it further

So Cupid moved it further off-screen. It would still be interesting to know why that works-- It just seems strange that only a piece of the image shows-- maybe because the height is changed on :hover and what you see is some default height, the height of the text in the span? and the bg image was 1px too far right.

I'm no expert, but I fake one on teh Internets