I am creating a theme for wordpress. My navigation bar has rounded corners like apple's site. I wish to give a hover style into it, however i can't have it to hover with rounded corners, like apple's nav bar does. I am utilizing a large image for that background using wordpress 3's menu system. So, how do i hover the foremost and last item around the bar? Thank you for helping.

With javascript you are able to choose and alter anything you want but when you want to use css, you´ll need to apply the :hover towards the parent of button sub-elements to ensure that you are able to choose all sub-elements using css. However, that excludes older versions of IE because they don´t support :hover on elements apart from a tags.


.button:hover {
.button:hover .main_section {
  // change to main section of button on hover
.button:hover .left_part {
  // change to left side on hover
.button:hover .right_part {
  // change to right side on hover

You'll need to have a different background image for that "hover" style.