Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #15047

    After changing the font-size of the main menu, the line-spacing, dimensions of the hover, etc. all got screwed up.

    How do I get the ratio of those elements to match the size of the font?

    Also how do I change the color of the rectangular block behind the main menu “current page” or hover effect from gray to red? I don’t see an option to customize that in the dashboard’s theme options.

    You can review my issues here:

    Thanks for the help!


    Alright, I think I figured out the spacing issues.

    But I still can’t change the background color. I get the impression that my custom CSS is being over-ridden by CSS from somewhere else.


    Okay…now I figured out how to change the background color of the main menu links.

    So I’m making solid headway.

    Although my next question is unrelated to the topic of my original post, I was curious about the possibility of somehow moving the main menu up to the top of the page (instead of resting beneath the height of the header). Is this possible, or will that mess up the page’s ability to re-size automatically to different devices?


    Add following css code to css/custom.css and adjust the first padding value (it dictates the top/bottom padding):

    .main_menu ul:first-child > li > a {
    padding: 10px 6px;

    You can also use a margin instead like:

    .main_menu ul:first-child > li > a {
    padding: 0px 6px;
    margin: 10px 0px;

    Notice that the hover effect will be a bit different.

    2) Yes I think so because you’d need to use an absolute, negative value. However you can try following css code:

    .sidebar {
    top: -300px;

    @media only screen and (max-width: 959px) {
    .sidebar {
    top: auto;

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

The topic ‘Issues with Main Menu Font-Sizing’ is closed to new replies.