PDA

View Full Version : Two problems:


Stephen
06-29-2006, 07:49 PM
Hi there,

firstly: I have tried to wrap some text around an image, and make it have a background colour so it contrasts with the original background colour. However, the text is not wrapping properly.

if you view this page (http://stephendaly.co.uk/portfolio.php), you will notice the text does not go all the way left of the image and i can not figure out why. Also, when viewed in firefox the background colour stops and the image inside exceeds the height!

Secondly, if you view my website in firefox, my right div appears to be pushing my thumbs div downwards, only in firefox...

how it should look, and how it looks via ie (http://img333.imageshack.us/img333/4162/howitshouldlook2ec.jpg)

and this is how it looks in firefox, pushed down due to the right div.

how it looks in firefox (http://img49.imageshack.us/img49/7523/howitlooksinfirefox2db.jpg).

your help is greatly appreciated, thanks!!

drhowarddrfine
06-29-2006, 08:02 PM
oops.

Stephen
06-29-2006, 10:33 PM
does anyone have anything useful or even remotely on topic to add?

_Aerospace_Eng_
06-29-2006, 11:45 PM
The background stops showing because of the float. You need to clear your floats. http://www.positioniseverything.net/easyclearing.html
And your thumbs look fine to me in FF and IE.

Stephen
06-30-2006, 12:05 AM
Thanks, ill read over that article tomorrow now because its a little late.

The thumbs are confusing me, if you say they look fine.. I just took 2 more screenshots:

ie (http://img526.imageshack.us/img526/6134/ie2uh.jpg) - which is how i want it to look

and firefox (http://img306.imageshack.us/img306/1431/firefox1ea.jpg). They only work in ie, it looks like the firefox screenshot in all other browsers, even on macosx

_Aerospace_Eng_
06-30-2006, 12:14 AM
Its the clear:both; in the your #thumbs CSS causing them to move down.

ronaldb66
06-30-2006, 07:46 AM
the text does not go all the way left of the image
You've set up the paragraphs in your #left-content div the have a 80px left margin:
#left-content p {
margin: 0 0 10px 80px;
padding: 0;
}

You are strongly adviced to avoid inline styles; they cancel out some of the benefits of style sheets and can be seriously confusing, especially in combination with an exernal style sheet.