CSS and older browsers

[johnpritt]

Hi Arthur,
I've just checked again from work (Windows2000, IE 6.0.2800.1106) and it is still as I described.
Note that it's only those two pages -- the other pages are correct -- but they do appear to be the only ones using <DIV>. Without my HTML books next to me, I'm useless at debugging, so I can't help more, sorry!

[Mark]

I think the problem is that your absolute positioning (which is fine by itself) is conflicting with Rootweb's inserted advertising/banner/searchform at the top of the page.

So maybe you need to absolutely position a bit lower down the page.

Mark

[arthurk]

Thanks for the ideas:

I've just checked again from work (Windows2000, IE 6.0.2800.1106) and it is still as I described. Note that it's only those two pages -- the other pages are correct -- but they do appear to be the only ones using <DIV>.

I haven't upgraded very much of the site yet, so those may well be the only pages you'll find with <DIV> tags. Actually there should probably be a few more, but with Rootsweb's current server problems it seems that pages uploaded last week aren't available.

I think the problem is that your absolute positioning (which is fine by itself) is conflicting with Rootweb's inserted advertising/banner/searchform at the top of the page. So maybe you need to absolutely position a bit lower down the page.

Thanks for that idea - obviously when I look at the pages on my computer I don't see the ads, and as a rule I use ad-blocking so don't see them online either. This was something that hadn't occurred to me.

Anyway, in view of what you've all said, I guess I will now revert to tables for the outline structure, and just use CSS for styling. In fact, looking at one of my books again, this is what they suggest too. Why didn't I read it first??

Thanks again,
Arthur

[Blain]

I guess I will now revert to tables for the outline structure, and just use CSS for styling. In fact, looking at one of my books again, this is what they suggest too. Why didn't I read it first??

Thanks again,
Arthur

Arthur, if that really is what your book says, can I give you one recommendation, throw the book away.

Tables are for displaying tabular data, not for layout.

The main stumbling blocks when starting to use CSS is to put everything in DIV's and absolutely position everything.

This is wrong.

The first step is to use semantic HTML;use the tag correctly.

for example

H1 = The first heading on you page, ie your title
H2, H3, H4 etc = second heading should be h2, third h3 etc.
Only paragraphs should use the P tag
If you are compiling a list use list tags, if it's an ordered list use OL, if it's unordered use UL.

If you use semantic HTML your document will make sense, whether the user is using IE3, Firefox, Netscape or a braille reader.

Your CSS is then used to make the site look pretty.

[arthurk]

Arthur, if that really is what your book says, can I give you one recommendation, throw the book away. Tables are for displaying tabular data, not for layout.

Strictly speaking, yes - but because of the shortcomings of earlier versions of HTML they have become very commonly used, and they are also well supported by browsers.

The main stumbling blocks when starting to use CSS is to put everything in DIV's and absolutely position everything. This is wrong.

I'm not entirely sure why this is wrong in the absolute sense which you seem to be implying. In my case it didn't work because (a) older versions of Netscape mess it up, and (b) the absolute positioning was conflicting with Rootsweb's adverts.

In order to get blocks of text neatly positioned on my home page (the 4 panels relating to my grandparents), if I wasn't going to use <DIV> tags I couldn't see any way other than tables to achieve this.

The first step is to use semantic HTML;use the tag correctly.
for example
H1 = The first heading on you page, ie your title
H2, H3, H4 etc = second heading should be h2, third h3 etc.
Only paragraphs should use the P tag

My reason for not using the H1, H2 etc tags was that I preferred to use class names which were a bit more explicit as to what they represented.

I don't have such a browser, so couldn't see this. One comment, though: I see from your style sheet that alternate rows of your census tables are intended to be a different colour - I think from the hex code that this may be a kind of off-white - but on my TFT screen, I couldn't see any difference at all.

Anyway, thanks for your comments. However, I'm not going to be able to keep up with this thread for a while, as we're moving house soon, and life is hectic.

Arthur

[Glyndwr]

It's commendable that you should want everyone to access your site but I think that you shouldn't be too concerned about very old browsers. This is the latest breakdown for my community website :

MSIE 6 * 879 - 70.83%
AOL 9 * 149 - 12.01%
Opera 9 * 86 - 6.93%
Firefox 1.5 * 31 - 2.50%
MSIE 4 * 26 - 2.10%
MSIE 5 * 20 - 1.61%
Safari * 16 - 1.29%
Firefox 1 * 11 - 0.89%
Mozilla 1 * 6 - 0.48%
Opera 8 * 4 - 0.32%
MSIE 7 * 3 - 0.24%
Other/Unknown *3 - 0.24%
AOL 8 * 2 - 0.16%
AOL 7 * 2 - 0.16%
Netscape 3 * 1 - 0.08%
Netscape 7 * 1 - 0.08%
PDAs * 1 - 0.08%

AS you can see, the vast majority of visitors this month were using pretty up-to-date browsers, with over 90% using the very latest. Your visitors probably follow much the same pattern, so I think it's really more important that you make sure that your site can be accessed by all browsers on all platforms.

Hope this helps.

[arthurk]

Thanks for the figures - I found some fairly similar ones when I was looking into this before. I haven't had chance to do much with the site recently, but I'm still taking care to validate everything before I upload it, so I'm hoping it will work reasonably well for everyone who goes there.

Arthur