I am desperately trying to change font weight in category menu.

Added "bold" via web interface so it reads

div#menu2 ul.rMenu li a:link, 
div#menu2 ul.rMenu li a:hover, 
div#menu2 ul.rMenu li a:visited, 
div#menu2 ul.rMenu li a:active {
	text-decoration: none;
	margin:0;
	color: #000000;
	text-transform: uppercase;
	font: 1.3em bold Arial, sans-serif; 
	}

Full CSS is here http://21.maidan.org.ua/?bfa_ata_file=css

However text does not show as bold - second dark menu here http://21.maidan.org.ua (site is in Ukrainian but you can see it's not bold anyway)

Also I tried to add background image to div#menu2 via included CSS and failed completely. Apparently I was doing something wrong.

So the questions are
1. How to make menu font bold?
2. How to add background image to menu?

Thank you!
Viktor

In ATO>Menu put the following in the Font Size and Face box

bold 1.3em Arial, sans-serif

Oh! Thank you very much! It worked like charm.

And how about background image for menu? Is that possible to add it? I tried to add it to #menu2 but it does not work.

Viktor

For a background image you would have to determine the selectors for the area you want to add a background to and apply the necessary CSS. You can also add background images to the menu tabs via the navigation field in the WordPress menu builder.

All I need is to add background image to div#menu2

I tried this and failed

div#menu2 {background: url('http://maidan.org.ua/design/2011/img/headmenu.jpg') no-repeat;}

What I am doing wrong?

Thank you again!

Viktor

You didn't do anything wrong, that CSS is working...the only thing is that the menu code is this

<div id="menu2" class="menu-navigation-container">
<ul id="rmenu" class="clearfix rMenu-hor rMenu">
<li id="menu-item-97" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-97">
</li>

and the CSS for the div#menu2 is layed down first, then this CSS

div#menu2 ul.rMenu {
    background: none repeat scroll 0 0 #B4B4B4;
    border: 1px dotted #FFFFFF;
}

is layed on top of the previous CSS and then this CSS

div#menu2 ul.rMenu li {
    background-color: #B4B4B4;
}

is laid on top of that.

So it's there, just covered over. You will need to add in CSS for those two selectors and set the background transparent

There are a couple of issues here. You have to get rid of the background color for the list items and the background image has breaks in it so it won't match your menu exactly.

I used some iamge from working design for test purpuses only - it will not have separators.

So I basically need to edit theme stylesheet? How to proceed with that in order not to screw custom settings input via web?

You don't need to edit the CSS, just add CSS to the CSS inserts setting the background for those two selectors to 'transparent'

Thank you very much for your patience with me

It worked. Almost. Now the question is how to get rid of borders around menu items? Adjusting colors like mentioned on option page will not work since background image is not single color.

See how it looks like now
http://21.maidan.org.ua/

I tried

div#menu2 ul.rMenu li {
    background: transparent;
    margin: 5px;
    border: 0;
}

But it does not work apparently.

Please help. Hopefully its the last question

Viktor

what do you have set in the theme menu option 'Border around all menu items'?

Thank you!!! Now I am really done with that.

I really appreciate your help and your great work!

Viktor