Inserting Menu Icons in Responsive Theme

What is the issue, your images not loading?

Yeah, child themes don’t carry over settings/options from the parent theme, so you have to redo those.

For menu items – you can use the menu-item specific class to target each one, so for example this one:

<li class="page_item page-item-79">

would be:

.menu li.page-item-79 a {

}

Also, try using absolute file paths for images if the other doesn’t work.

First, you can’t do any of this work without using a browser tool like Firebug – so get that set up. Then use that to look at the menu HTML code – the first two items show this:

<li>
<a title="Home" href="http://yeahitsfree.com/">Home</a>
</li>
<li class="page_item page-item-79 current_page_item">
<a href="http://yeahitsfree.com/astrology/">Astrology</a>
</li>

So you can see that the class page-item-79 is specific for the Astrology page – so then you use that class for that page only.

.menu li.page-item-79 a {
  background-image: url(PUT THE ABSOLUTE URL TO THE IMAGE HERE);
}

You will have a CSS piece like the above for each page – the page-item class and the image name will be different for each one.

The home page does not seem to generate a page specific class (weird) but you should be able to still assign an image by putting that one first (without the page id class) and then the other ones will override that one.

Also, you need to upload the images using the media uploader and use the URL for those images from the media library.

Actually, on second thought, try using this one for the home page image:

body.home .menu li a {
  background-image: url(PUT THE ABSOLUTE URL TO THE IMAGE HERE);
}

Using the body.home first will restrict it to the home page in another way.

Yes, at the bottom of your Child Theme style.css file