I have just created a basic website for a project at College and have to test it on various browsers and operating systems.

You can see the page here: http://wpd.cs.salford.ac.uk/~sgk814/project/homepage.html

It works perfectly on all browsers, except the homepage on Apple Safari, which gives this:



Ignore the broken image, the problem is that the 'What is there to do in Bury' title is wrapped around the image unlike on all other browsers and I don't want it to be.

I can't find a way of solving this?

Somebody please help me!

Thanks

I assume you mean the "Why Visit Bury Town Centre"? That's because it's not cleared from the floated image.


You'll get the same result on other browsers too if you decrease text size.

Side-notes:
You should use e.g. a H2 or H3 element for the above text rather than SPAN or P, since it appears to be a header. Also I advice against using underlining for it since it makes it look like a link.

It's best to not use px (or pt) units for font-size, since that cannot easily be changed in MSIE. Use percent or no font-size at all.

Finally, inline styles are a bit unpractical to use. Try embedded or external style sheets instead: http://htmlhelp.com/reference/css/style-html.html