Title: adding margin to navigation menu
Last modified: August 21, 2016

---

# adding margin to navigation menu

 *  Resolved [oikeusjyva](https://wordpress.org/support/users/oikeusjyva/)
 * (@oikeusjyva)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/)
 * Hello all,
    I would like to know, how could i add a margin to the navigation 
   menu, to have some space in the first menu item. there is the link
 * [http://www.yugito-art.net](http://www.yugito-art.net)

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/#post-4321078)
 * rightnow, the menu items are formatted in style.css within a `@media screen and(
   min-width: 600px)` query:
 *     ```
       .main-navigation li {
       		margin: 0 40px 0 0;
       		margin: 0 2.857142857rem 0 0;
       		position: relative;
       	}
       ```
   
 * i.e. the margin is applied to the right of the menu item;
 * change it so that the margin gets applied evenly to the left and right;
    for 
   example, add this to your style.css in your child theme:
 *     ```
       @media screen and (min-width: 600px) {
       	.main-navigation li {
       		margin: 0 20px 0 20px;
       		margin: 0 1.43rem 0 1.43rem;
       	}
       }
       ```
   
 *  Thread Starter [oikeusjyva](https://wordpress.org/support/users/oikeusjyva/)
 * (@oikeusjyva)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/#post-4321087)
 * Thank you for the fast answer, it worked, but the problem is that the space is
   added as well in the sub menu. and i would like to change only the main nav.
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/#post-4321100)
 * make the style more specific for just the direct top menu items; for example:
 *     ```
       @media screen and (min-width: 600px) {
       	.main-navigation .nav-menu > ul > li {
       		margin: 0 20px 0 20px;
       		margin: 0 1.43rem 0 1.43rem;
       	}
       }
       ```
   
 * btw:
    your child theme’s style.css is broken because of a missing closing bracket`}`
   after this style:
 *     ```
       .main-navigation li ul li a:hover {
       background: #A3A2A2;
       color: #202020;
       ```
   
 *  Thread Starter [oikeusjyva](https://wordpress.org/support/users/oikeusjyva/)
 * (@oikeusjyva)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/#post-4321158)
 * many thanks! seems to be well now.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘adding margin to navigation menu’ is closed to new replies.

## Tags

 * [navigation](https://wordpress.org/support/topic-tag/navigation/)

 * 4 replies
 * 2 participants
 * Last reply from: [oikeusjyva](https://wordpress.org/support/users/oikeusjyva/)
 * Last activity: [12 years, 6 months ago](https://wordpress.org/support/topic/adding-margin-to-navigation-menu/#post-4321158)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics