Forum Moderators: not2easy

Message Too Old, No Replies

Newbie padding problem

Replacing vspace and hspace with Netscape 4.x

         

StepOne

11:39 am on Jul 1, 2004 (gmt 0)

10+ Year Member



I have a fixed width web page which uses a table for the overall structure of the page. The page comprises simple text with a few images, the text flows around the left or right hand side of each image using vspace and hspace to provide a gap between each image and the text.

Ok, simple stuff! For reasons I won't go into I would like to use CSS instead of vspace and hspace so I inserted into the style sheet:

img.test { padding: 12px 12px 12px 0px; }

then into the HTML I inserted:

<img class="test" src="....." etc. etc. >

With newish browsers (IE6, NS 7) this worked just fine... with Netscape 4.79 some text appears to flow underneath the image and cannot be seen and the rest butts up against the image. If I use margin instead of padding, nothing happens, all the text butts up against the image.

What am I doing wrong? I know Netspape 4.X has many CSS problems. Is there no cross platform way to replace vspace & hspace? Is the fact that most of my page is within a table td the source of the problem?

Any help would be much appreciated.

createErrorMsg

7:07 pm on Jul 1, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I've never been a 'table designer', so I may be misunderstanding your situation, but based on the explanation of what you say 'vspace' and 'hspace' did for you in your table layout, it sounds like what you really need is float, not padding.

In CSS, the ideal (haha) way to get text to flow nicely around an image is to assign the image a float: left; or float: right; depending on which direction you want the image to go inside it's container.

Try replacing that padding with the float attribute in the css and see what it does. You may still need to tinker around with the padding, but float will give you standards-based text flow.

NOTE: this MAY not fix your NS4 problem, since NS4 is notoriously (at least from where I'm sitting) bad at handling floats. I (and many other designers) have given up on trying to make NS4 behave like a good boy should and simply arrange my pages in a way that delivers a minimally styled, positioning-free, but logically ordered version to NS4, confident that only public school teachers are still consistently using that browser.

A last thing to try might be applying the padding to the TEXT rather than the image.

StepOne

8:28 am on Jul 2, 2004 (gmt 0)

10+ Year Member



Many thanks for replying to my post. From the derth of replies I had begun to realise that what seemed easy to a newbie - was'nt. With NS4 indeed, nothing is easy.

I used 'float' as you suggested and yes it nicely replaces the 'align' attribute for the HTML 'img'
tag, but it doesn't pad my text away from the side of the image and every time I apply padding or border or margin or any combination thereof, my page looks horrible with Netscape 4.79.

LOL, I've given up - lifes too short.

Best.