Background rollover image does not align with Vertical seperator

[andyb]

1) Script Title: Chrome CSS Drop Down Menu (v2.5)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm

3) Describe problem: I have installed the script and everything works fine. (Great Script) However I have noticed that the background rollover image does not alighn with the vertical seperators on the left hand side. There is a 3 or 4 pixel gap between the vertical seperator and the rollover image. When I check the actual working examples on the Dynamic Drive web site they appear to have the same problem.

Is there a way I can get the script to work with the background rollover image being between the 2 dividers without any spaces between the dividers and background image.

Any help appreciated.

[ddadmin]

This is basically due to the menu's omission of "float:left" in its CSS to style the main menu headers. The advantage of this is that the menu can easily be aligned "center" or "right" as a result. The disadvantage however is that the area within each menu item no longer fills up the space entirely, resulting in the little gap you see.

If you don't need the menu to align "center" or "right", you can try tinkering with its CSS to throw in "float:left". Untested, but try adding the code in red to the existing CSS of the menu below:


.chromestyle ul li a{
float: left;
display: block;
color: #494949;
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}