How to highlight the current page in the nav menu?

I’m customizing a WordPress theme for my school, and I’m a bit annoyed by the fact that the current page in the nav menu is not indicated.

For example:

enter image description here

You can clearly see that I’m hovering over a page in the nav menu, and that the page I’m hovering over is highlighted, as expected.

However, the page that I’m currently on, called “Arhiva”, is not highlighted, and I think that this can be somewhat confusing.

I don’t want the current page and the page the mouse is hovering over to be highlighed in the same manner though. I believe that a bold entry text in the nav menu would do just fine to separate the current page from other pages.

How can I achieve this?

Theme’s current CSS can be viewed here: http://petagimnazija.hr/wp/wp-content/themes/chiron/style.css.

Solutions Collecting From Web of "How to highlight the current page in the nav menu?"

The Navigation Menus system is adding a lot of classes, including matching current page (rather intelligently, it will even try to detect custom URLs, that were input explicitly).

The simplest class to make use of is current-menu-item, but there are quite a few more dealing with parents/ancestors and more.

Codex has them documented at wp_nav_menu() > Menu Item CSS Classes.