Left navigation styling

Category: 

  • Question

kiirja@mit.edu

I put a CSS style on the left navigation. The primary level is rendering per the styling, but the child page titles are not inheriting the styling. I've used Firebug to try to figure out which classes are used for the lower level menu elements, but nothing has worked.

I was hoping the this would work:
*#block-system-main-menu {font-size:.8em;font-weight:normal;}

Any suggestions?
Thanks.

6/2/14

csgiles@mit.edu

Add an li selector:

#block-system-main-menu li {font-size:.8em;font-weight:normal;}

6/6/14

kiirja@mit.edu

Yes I tried this and it caused the opposite problem: now the child menu elements are smaller than the parent elements instead of larger than the parent elements. The need to be all the same size, but the default size is too large. Furthermore, setting the hover state to nodecoration does not eliminate the large thick ugly line that appears on hover.
Also, today the site response is extremely slow- to render a page after editing is taking more than three minutes.

6/13/14

kiirja@mit.edu

Is there a solution for this? I would like the left menu text to be the same size as the body text. The default is to have it larger, and this doesn't look good. I tried applying css on the menu class and had the same problem where the child menu items are a different size from the parent. How can they be made all the same size?
Thank you.

6/25/14

csgiles@mit.edu

Hi Kiirja. I just posted this same answer to a different question, but I'll post it here, too, since the same thing applies and could be helpful to others reading this thread:

One easy way to tweak the default styles in your menu is to copy the CSS from the base theme into a CSS Injector rule, and then adjust as needed. You can get to the base CSS either using "inpsect element" in Firebug or your browser's dev tools, or by pasting the following path into your site URL:

/sites/all/themes/mit_adaptive/css/mit_adaptive.css

Grab the code between the "Start main-menu" and "End main-menu" and paste it into a CSS Injector rule. The changes you make in CSS Injector will override the theme defaults.

6/25/14