Forum Moderators: not2easy

Message Too Old, No Replies

Netscape Oddity on Text Wrap around Image Not on IE

         

MikeInNM

11:20 pm on May 17, 2003 (gmt 0)

10+ Year Member



Maybe I'm not going about this right: Built a box and put an image in the left upper corner. Wanting to flow text in the remainder of the box and around the image.

<div style="position: absolute; top: 230px; left: 230px; width: 500px; height: 300px; text-align: justify;">

<img class="pfloat" src="picture.jpg" width="200" height="200" alt="picture" />text text whole bunch of text </div>

Whereas the class is:

.pfloat {
float: left;
padding-right: 10px;
padding-bottom: 5px;
}

This is displaying properly in IE6 with a slight margin between the right side of the picture and the left side of the text. In other words fine for me.

But in Netscape 4.6 it does fine except the first 2 characters of text are moved over a few spaces. Like:

-------¦--->First line starts over here
-------¦ then it wraps around the
-------¦ photo just like it is
-------¦ supposed to with a
-------¦ slight margin between the
photo and text then it jumps below the
photo just like I wanted it to do.

I have tried everything. Any suggestions appreciated.

jeremy goodrich

6:49 pm on May 19, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hm, imho, I wouldn't worry too much about Netscape 4.6 formatting errors.

At the extreme, you might do a server side redirect *just for* that browser, to serve them a different page perhaps.

Though, unless your user base justifies it, I wouldn't spend that much time developing a custom solution for such an old browser.

papabaer

8:01 pm on May 19, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Use margins for adding space around images. Padding is meant for controlling the area between a containing elements bounding box and the content within. Obviously, an image is not a "container" but it IS an object that accepts margins and borders, which both exist on the outside of an elements bounding box...

IE's been confused for a long time. Look for for the specs in detail here [w3.org ] Read about the VISUAL Formatting Model and then about FLOATS. Good luck!

MikeInNM

1:29 am on May 20, 2003 (gmt 0)

10+ Year Member



Thank you very much. That was it.... margins.

I don't design for Netscape 4 but I always check stuff with it. Nothing tears up a page like an old browser version.