Image menu and making content fit a div

HTML & CSS
1

So I’m making an image menu that needs to be centered inside a div, I have 5 images with different widths that are inside this div, they are all the same distance apart, like so:

image1…image2…imaga3…image4…image5

I started thinking, how am I going to create such distance between the images so that they fit my div perfectly? I remembered some time ago making a menu just like this, except it only used text, no images.

I used the word-spacing tag in CSS to create such distance, and it worked fine. So my solution was to use   between my images:

image1  …image2  …imaga3  …image4  …image5

This works flawlessly in Firefox, but I’m having an issue in Chrome, I only get this effect if I use DOUBLE   , which of course, breaks it in Firefox:

image1    …image2    …imaga3    …image4    …image5

Is there something I’m missing here? Maybe there’s a more elegant answer for my menu? Any help is appreciated.

2

Yes, don’t use use HTML to get a visual (presentational) result. Instead, use something like margin or padding. We need to see your page to be sure, but a way to go about this is to make an unordered list (<ul>) with each <li> containing an image. Set the <li>s to display: inline block and text-align: center. That will center the items inside the div. Then add left-right margins to get them the right distance apart.