ExpertHelps
New Member
I am creating a list of links with colors next to them. Clicking on either the text or the color should follow the link. Each item contains the following:\[code\]<a href="http://stackoverflow.com/questions/13845656/#"> <span class="color"></span> <span>My Link</span></a>\[/code\]And here are the styles I'm applying:\[code\]a { position: relative; display: block; height: 32px; padding-left: 37px;}span.color { position: absolute; height: 32px; width: 32px; background: #F00; left: 0;}\[/code\]The text link works as expected in all cases. The color span, however, does not. In IE 7+, clicking on the color correctly follows the link, but the right click menu doesn't include the options to open the link in a new tab/window.Next I tried adding a transparent png (32x32px) to the absolutely positioned span:\[code\]<span class="color"><img src="http://stackoverflow.com/questions/13845656/blank.png" /></span>\[/code\]Now the right click menu includes the correct options (and they work), but actually clicking the color doesn't navigate the link anymore.Is there another way to fix this with CSS?