WordPress.org

Hi,
Just a quick question. Can anyone tell me how to center an image in my menu area 1. in the li and 2. outside of the li area ?
I know it's probably something very simple - I just can't work it out. I don't want to center all images - only selected images here and there.
Thanks to anyone who can provide some assistance.

Not sure if it will break validation, but in your css, create a class to center.
div.cent {
text-align: center;
}
Then edit index.php, and in the menu list, do this:
<div class="cent">
<img src="whereeveryourimageis.jpg" alt="" />
</div>
That's one way ......

Firefox is playing by the rules, as usual, IE is not :)
As it's a link, use the link manager for this
Using the image as a link will place it inside the box that your group it into.
Add the link, enable images and addthe uri for the image. That should do the trick, but it will be indented to the same level as the other elements.
Or....... in index.php, just before the image, insert a closing /ul tag, then straight after, an opening ul tag.
Not sure what the validator will think though... :)
(not that it's sentient of course!)

Thanks again Podz.
Re: the link manager option
Sounds good except I am hoping to put a few images in places other than the link sections.
Re: /ul and ul option
Gave it a try but it sent the image way over to the left and not a good result.
I am a bit surprised - I thought such a simple task as putting an image in a menu would be an easy task.
Life's good when you learn something every day.
Thanks for trying Podz :)

Shadow I have looked at your CSS At the moment the img is in a div class="cent". I could not see the corresponding selector in the css at all.
There should be something like:
.cent {
margin-left: auto;
margin-right: auto;
}
I might have overlooked it.

This is what I just sorted for my daughter.
Page still validates, but I'm sure it can be done better !
In the css, add this:
#menu .icon {
background-image: url("image.jpg");
background-repeat: no-repeat;
margin-left: 110px; // adjust as needed
padding: 25px 25px 45px 25px; // adjust as needed
}
In index.php, add this: