Hi,
try this code:
.navbar-inner{
padding-right: 5px;
}
.tc-header .nav-collapse{
float: none;
}
.navbar .nav {
width: 100%;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.nav-collapse .nav > li{
float: none;
display: inline-block;
}
.nav-collapse .nav > li li{
text-align: left;
}
@media (max-width: 979px){
.nav-collapse .nav > li{
display: list-item;
}
}
did this help?
Hi there! Thanks for this… can you tell me where to place this code?
In Appearance -> Customize -> Advanced options -> Custom Css
Or in your child-theme style.css
If you plan to make massive css changes or custom functions (php) I suggest to build up a child-theme
Hope this helps 😉
Thanks so much! That definitely centered my menu bar categories (within the menu bar). Any suggestions on how to move the menu bar down from the top of the page?
could be pretty tricky when resizing the window..
The whole box?
and where at the bottom (header bottom)? If yes, try something of the sort..
.navbar-wrapper {
position: absolute;
right: 0;
bottom: 0;
}
@media (max-width: 979px){
.navbar-wrapper {position: initial;}
}
Sorry, I think I’m communicating this wrong. I want to keep the menu bar at the top of the page, just not up against the very top. In other words, I want to bring it down just a little so it is parallel with my logo on the left. Make sense? I want to center it in that white space, so there is equal space above the menu bar and below the menu bar.
here is the website to reference: http://www.accuratepayroll.com/wp/
Yeah I got you wanted it stay in the header 😛 Just didn’t get where if not top, and supposed the bottom, try ..
Something like…
.navbar-wrapper {
position: absolute;
right: 0;
top: 30%;
}
@media (max-width: 979px){
.navbar-wrapper {position: initial;}
}
same code as before, but not at the bottom of the header, +/- at its middle. Adjust that 30% to suit your needs
Glad you solved.
Would you mind marking this topic as resolved?
Thank you 😉
