How to make a div with rounded corners change color when hovering the mouse over it?

Question

css

Maybe the question is obvious, but I'm new to layout.

The essence of the question on a live example: bimvet.ru
It is necessary that the menu items change color when hovering over the mouse. It seems that everything was done as it should, but there is a bug - a div with rounded corners is “not painted over” to the end.

You can choose a different rounding method. I took the first one I found on Habré.

Thanks in advance.

Answer 1

Replace:
A:hover.elmenu .grc be b, .grc be i, .grc be u {height: 1px !important; background: #ff0000;}
to:
A:hover.elmenu .grc be b, A:hover.elmenu .grc be i, A:hover.elmenu .grc be u {height: 1px !important; background: #ff0000;}

Answer 2

If you are interested in other rounding methods, you can read about them and see here . Always use this example, 100% working in all browsers including IE6

Answer 3

Maybe just draw the buttons (background) for the menu? Active and inactive option.