Width 100%

[almightyegg]

1) Script Title:
Chrome CSS Drop Menu
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm
3) Describe problem:
I have the script working fine now but it doesn't seem to want to fit the screen exactly. I want it to stretch the entire width of the page so width: 100%; should do it, but it hasn't...

The relevent part should be in here:
.chromestyle{
width: 100%;
font-weight: bold;
}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.chromestyle ul{
border: 1px solid #BBB;
width: 100%;
background: url(chromebg2.gif) center center repeat-x; /*THEME CHANGE HERE*/
padding: 4px 0;
margin: 0;
text-align: center; /*set value to "left", "center", or "right"*/
}

.chromestyle ul li{
display: inline;
}

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

.chromestyle ul li a:hover{
background: url(chromebg2-over.gif) center center repeat-x; /*THEME CHANGE HERE*/
}

.chromestyle ul li a[rel]:after{ /*HTML to indicate drop down link*/
content: " v";
}


Thanks in advance :)

[ddadmin]

Try just removing the two lines:


.chromestyle{
width: 99%;
font-weight: bold;
}

.chromestyle ul{
border: 1px solid #BBB;
width: 100%;
background: url(chromebg.gif) center center repeat-x; /*THEME CHANGE HERE*/
padding: 4px 0;
margin: 0;
text-align: center; /*set value to "left", "center", or "right"*/
}

from the default CSS file. The problem with specifying width: 100% is that it will in fact cause the menu to be longer than 100% after you factor in the menu borders. That's why it was initially set at 99%. You may have to do some tweaking apart from the above to get things right.