Help with horizontal menu in page

  User-CB94CED6-F3AA-42E7-8A286564F5DCBC14 15:36 16 Jun 2008
Locked

I am looking for accessible code using UL/LI with CSS to make an in line menu of several items spread evenly across the page. Each menu item will have an image with link text below both being an active part of the menu. The whole menu is contained within a table TD element (unavoidable) and squeezed between paragraph elements Introductory text, then menu, then more text. If the page is resized then the content area will shrink so I am aiming to keep the images about 100px wide.

I am a little unsure how to tackle this and would appreciate some advice.

  Wooden'ead 14:17 03 Jul 2008

Put a link to your site up - gives people a fuller idea of what you are trying.

I did get a solution thanks. It is as follows:

<div class="contentMenu">
<ul>
<li>
<a href="#" title="Find out more"><img src="images/stories/memories/family.png" alt="" />
<span>Family life</span></a>
</li>
<li>
<a href="#" title="Find out more"><img src="images/stories/memories/schooldays.png" alt="" />
<span>Schooldays</span></a>
</li>
<li>
<a href="#" title="Find out more"><img src="images/stories/memories/employment.png" alt="" />
<span>Employment</span></a>
</li>
<li>
<a href="#" title="Find out more"><img src="images/stories/dancing.gif" alt="" />
<span>Sights/Sounds</span></a>
</li>
<li>
<a href="#" title="Find out more"><img src="images/stories/dancing.gif" alt="" />
<span>Celebrations</span></a>
</li>
<li>
<a href="#" title="Find out more"><img src="images/stories/dancing.gif" alt="" />
<span>Town at war</span></a>
</li>
</ul>
</div>

Comments welcome on improving this code. It works in IE6/7 and FFox2/3.

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

The Evil Within 2 review-in-progress

InVision Studio takes on Adobe XD and Sketch

Camera tips to take better iPhone photos

Comment transformer un iPhone en borne Wi-Fi ?