2 replies [Last post]
webbedit
Offline
Enthusiast
Tyne and Wear, UK
Last seen: 11 years 9 weeks ago
Tyne and Wear, UK
Joined: 2005-08-17
Posts: 133
Points: 0

Hi,

I am having problems at the following page with the main menu:

http://www.companysolutions.biz

In IE as soon as you resize the width of the browser window smaller than the full width of the ul list the content in the 'PFA and Mentoring' li wraps. In firefox the behaviour is slightly different, as that waits until you get the window down to around 690px before it wraps.

I am confused as to why this should happen as the ul has no explicit width declarations and should happily take up the width it requires, nothing it telling it to try and fit within the browsers available viewport ... any clues?

Thanks in advance

Paul Gardner
Partner - Webbed IT

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 15 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

You could try adding

You could try adding white-space: nowrap; to the list items.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

webbedit
Offline
Enthusiast
Tyne and Wear, UK
Last seen: 11 years 9 weeks ago
Tyne and Wear, UK
Joined: 2005-08-17
Posts: 133
Points: 0

FAO Tyssen

Tyssen wrote:
You could try adding white-space: nowrap; to the list items.

Tyssen,

You've done it again my friend!

Adding white-space: nowrap; to the li tags fixed the issue in FireFox perfectly. IE however, didnt wrap the 'PFA and Mentoring' li, but still wrapped in between each li.

To try and resolve this I added white-space: nowrap; to the ul tag, this has helped IE without breaking FireFox, but the whole list wraps in front of the first li now, this is a lot better but not perfect.

Paul Gardner
Partner - Webbed IT