CSS Help – Goran Theme – Menu Bar

purduewda · Member · Apr 24, 2015 at 3:08 pm
Copy link

Add topic to favorites
In the Goran theme, I am trying to add a couple more menu items in the menu bar. My focus is on the CSS. In this theme only about half of that menu bar space is usable for menu items. Any further menu items are forced to a new line which looks terrible.

I have played with the CSS a little bit to widen the usable area in the menu bar but have not been successful due to my limited knowledge of CSS.

Any help is appreciated!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Apr 25, 2015 at 5:05 pm
Copy link
Hi, give the following a try. It is a balancing act since the logo and the navigation are inline in the same div. Too wide on the menu and it immediately goes down below the logo when the screen starts to narrow. I’ve afraid this only gains you about 100px in menu width. If you go to 900 on the max-width for the navigation, it drops below the logo before the touch menu activates.
```
.site-branding {
    width: 100px;
}
.main-navigation {
    max-width: 800px;
    width: 100%;
}
```
You could also decrease the right margin on the menu items a bit to gain a little more. It is currently at 32px. Add this also and you can play with that value.
```
.main-navigation li {
margin-right: 32px;
}
```

No items found.