Blank CSS for Custom WordPress Theme

It is a while since we migrated to build premium WordPress site for all our clients. But one of the issues that is different with building ordinary HTML sites is you can skip so many elements in the navigation. Not so with the WordPress themes. So we scouted a complete Navigation code to help you to build a solid unbreakable CSS file for your WordPress Navigation. Enjoy! We also included a small something thing for the menu toggle in Mobile sites courtesy of Underscores _s theme

## Menus
.main-navigation {}

.main-navigation ul {}

.main-navigation li {}

.main-navigation a {}

.main-navigation ul ul {}

.main-navigation ul ul ul {}

.main-navigation ul ul a {}

.main-navigation ul ul li {}

.main-navigation li:hover > a, .main-navigation li.focus > a {}

.main-navigation ul ul :hover > a, .main-navigation ul ul .focus > a {}

.main-navigation ul ul a:hover, .main-navigation ul ul a.focus {}

.main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul {}

.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {}

.main-navigation .current_page_item > a, .main-navigation .current-menu-item > a, .main-navigation .current_page_ancestor > a {}

/* Small menu. Added to help the menu toggle for mobile site */
.main-navigation.toggled ul {
display: block;

@media screen and (min-width: 37.5em) {
.menu-toggle {
display: none;
.main-navigation ul {
display: block;

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
margin: 0 0 1.5em;
overflow: hidden;

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
width: 50%;

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
float: right;
text-align: right;
width: 50%;