Text wrapping around image

[my-wings]

I have a page here: http://www.mywingsbooks.com/coll-terms/bce.shtml

That looks OK in IE but doesn't work in Navigator.

I have the following CSS coding in the document:

div.va img {
margin-left: 0px;
float: left;}

div.va p {margin-left: 455px;
margin-top: 0px;}

div.va br {clear: both}

hr {color: #0033ff;
height: 3px;
width: 100%}

There is additional CSS coding here:
http://www.mywingsbooks.com/css-ssi/main.css , but I don't think that is
making a difference.

The effect I'm trying to achieve is a picture 450px wide on the left and a
paragraph on the right with a horizontal rule at the end of the
picture/paragraph pair. Both the IMG and the P are within a DIV tag. The HR
element is between the DIV's. I also want to prevent the paragraph from
wrapping under the picture, hence the BR tag right before the end of each
paragraph. So...the whole set-up is this:

<div class="bodytext">
<div class="va">
<img>
<p>
some text<br>
</p>
</div>
<hr>
repeat from <div class="va"> to <hr> multiple times
</div>

It does what I want in IE, but in Netscape Navigator, the IMG's just stack
up on the left, and the paragraphs stack up on the right, and the HR's are
inserted after the end of the paragraphs and just slice across the images
wherever they happen to fall. I suspect I'm not using the "clear" properly
for the BR tag, since I don't think it's actually a block element, but the
W3schools Validator didn't give me an error for that, and I'm not sure
what's best to try next.

I would appreciate any suggestions.

Thanks!
Alice

 

[Guest]

I have a page here: http://www.mywingsbooks.com/coll-terms/bce.shtml

That looks OK in IE but doesn't work in Navigator.

I have the following CSS coding in the document:

div.va img {
margin-left: 0px;
float: left;}

div.va p {margin-left: 455px;
margin-top: 0px;}

div.va br {clear: both}

hr {color: #0033ff;
height: 3px;
width: 100%}

There is additional CSS coding here:
http://www.mywingsbooks.com/css-ssi/main.css , but I don't think that is
making a difference.

The effect I'm trying to achieve is a picture 450px wide on the left and a
paragraph on the right with a horizontal rule at the end of the
picture/paragraph pair. Both the IMG and the P are within a DIV tag. The HR
element is between the DIV's. I also want to prevent the paragraph from
wrapping under the picture, hence the BR tag right before the end of each
paragraph. So...the whole set-up is this:

<div class="bodytext">
<div class="va">
<img>
<p>
some text<br>
</p>
</div>
<hr>
repeat from <div class="va"> to <hr> multiple times
</div>

It does what I want in IE, but in Netscape Navigator, the IMG's just stack
up on the left, and the paragraphs stack up on the right, and the HR's are
inserted after the end of the paragraphs and just slice across the images
wherever they happen to fall. I suspect I'm not using the "clear" properly
for the BR tag, since I don't think it's actually a block element, but the
W3schools Validator didn't give me an error for that, and I'm not sure
what's best to try next.

I would appreciate any suggestions.

Thanks!
Alice

Re: The Clan of the Cave Bear? Renders OK with Mozilla 1.6. In fact it
looks great! More users should be using Mozilla, it's really improved,
even from NS 7; even the Bookmarks utility is better, but still not NS 4
to my way of thinking. ;-)

If by Navigator you mean Netscape 4, then it's probably because NS 4
does't do Styles very well. It should work with NS 7 though.

Don
Username munged by FixNews

 

[my-wings]

If by Navigator you mean Netscape 4, then it's probably because NS 4
does't do Styles very well. It should work with NS 7 though.

Thanks for the feedback. I should have specified: I'm using Netscape 7.1,
which I just downloaded a week or two ago to be able to check my site. (The
rest of the specifics -- I'm not sure what it all means -- are: Mozilla/5.0
(Windows; U; Windows NT 5.1; en-US; rv:1.4) Gecko/20030624 Netscape/7.1
(ax).) Could I have downloaded the wrong thing? (I'm running Windows XP
Pro.)

This is the second time someone has told me things look OK in their browser
but I'm seeing junk. (Actually, the top of the page looks fine, the problem
only happens when I scroll down, and get to an area where the text is
shorter than the picture. Here is what I'm seeing when I scroll down.
http://www.mywingsbooks.com/Netscape.jpg
As you can see, the horizontal rule starts immediately at the termination of
the paragraph rather than after the DIV tag, and it cuts right across the
picture. At least that's how I interpret what's happening.

Any suggestions or explanations would be appreciated.

Thanks!
Alice

 

[my-wings]

I have a page here: http://www.mywingsbooks.com/coll-terms/bce.shtml

That looks OK in IE but doesn't work in Navigator.

Picture of ugly NN 7.1 effect when scrolling down:
http://www.mywingsbooks.com/Netscape.jpg (Size is 114K. You may not want to
bother.)<snip lengthy explanation of everything I could think of that anyone might
want to know. >

It does what I want in IE, but in Netscape Navigator, the IMG's just stack
up on the left, and the paragraphs stack up on the right, and the HR's are
inserted after the end of the paragraphs and just slice across the images
wherever they happen to fall. I suspect I'm not using the "clear" properly
for the BR tag, since I don't think it's actually a block element, but the
W3schools Validator didn't give me an error for that, and I'm not sure
what's best to try next.

Ever solve your own problem without realizing that you've done so?

Indeed I was using the BR tag improperly with the clear statement, since the
BR tag is not a block element. But the HR tag is, and when I added "clear:
both" to the HR properties everything works fine in both browsers, giving me
exactly the effect I was looking for, here:
http://www.mywingsbooks.com/coll-terms/bce_.shtml

Alice
It's not the destination, it's the journey.

..