-
wordpress css problem
http://dailyyams.com/
The menu on the right expands div#menu a:hover in Firefox and IE when I hover over it. Mario & Luigi: Superstar Saga is the longest link right now. Can someone look at this and see the problem?
Code:
/* menu */
div#menu {
float: right;
text-align: left;
height: auto;
padding: 5px 10px 10px 10px;
margin: 0 0 0 0;}
div#menu a { color: #FFFFFF; text-decoration: none; font-weight: normal;
}
div#menu a:hover {
padding: 1px 1px 1px 15px;
margin: 0px;
color: #FFFFFF;
background: #343536;
}
ul li{
color: #FFFFFF;
margin:20px 0px 0px 0px;
padding:1px;
}
div#menu ul {
margin: 0px;
padding: 0px;
list-style: none;}
div#menu ul li ul {
margin: 0px;
}
div#menu ul li ul a{
display: block;
padding: 1px 1px 1px 15px;
margin: 0px;
background-color: #343536;
border-right: 1px solid #606060;
border-bottom: 1px solid #606060;}
div#menu ul li ul a:hover{
display: block;
background-color: #2C2D2E;
color: #FFFFFF; border-bottom: 1px #2C2D2E solid; border-right: 8px #2C2D2E solid;
}
div#menu ul li {
margin: 10px 0;
padding-left: 0px;
}
div#menu ul li ul li {
margin: auto auto auto auto;
}
div#menu table td {
text-align: center;
}
-
Are you referring to how the menu becomes wider when you mouseover it? It's because you specified 15px left padding for div#menu a:hover. Leave the padding unspecified or put it to the same as the padding for non-hovering.
EDIT: Apparently you're editing it as I'm looking at it, too. Neat.
-
It wasn't that. It was div#menu ul li ul a:hover, it had a different border thickness than div#menu ul li ul a.
I hate how IE renders CSS differently. div#content is more to the right in IE, squishing the menu more, making it so I can fit less stuff on one line than in Firefox.
Another question: Would it be possible to put:
Code:
HR noshade size="2" width="75%" align="center" color="#606060"
Somewhere in the CSS file so that it would appear after the comments part in div#content? I have it in index.php right now, but if I want to make another style, it'll appear there too.
