Whole website stuck for IE 6 eyes only?

huge website only rendering in Internet explorer version 4 up to 7

[danielfoley]

Help,

I am stuck with rendering problems in firefox and other browsers.
The website

<url removed>

renders ok in Internet explorer, but in firefox I get overlapping layers, headers that are far larger and layers that are not put in the correct z-index order?

The site is huge, and is authored using WEBPAGEMAKER V2.3

It is in html 4.0 but is non transitional,

We have too many pages to sit tweaking each bit, does anyone know of a way we can automate the html repair to accomodate for IE and firefox? or am I going to have to painfully edit every single page?

The stylesheet is embedded in the index file, the others use external stylesheet.css files.

An example of the stylesheet content is below

<style type="text/css">
.ws6 {font-size: 8px;}
.ws7 {font-size: 9.3px;}
.ws8 {font-size: 11px;}
.ws9 {font-size: 12px;}
.ws10 {font-size: 13px;}
.ws11 {font-size: 15px;}
.ws12 {font-size: 16px;}
.ws14 {font-size: 19px;}
.ws16 {font-size: 21px;}
.ws18 {font-size: 24px;}
.ws20 {font-size: 27px;}
.ws22 {font-size: 29px;}
.ws24 {font-size: 32px;}
.ws26 {font-size: 35px;}
.ws28 {font-size: 37px;}
.ws36 {font-size: 48px;}
.ws48 {font-size: 64px;}
.ws72 {font-size: 96px;}
.wpmd {font-size: 13px;font-family: 'Arial';font-style: normal;font-weight: normal;text-decoration: none;}
</style>

<style type="text/css">
a.style1:link{color:#E4E4E4;text-decoration: underline;}
a.style1:visited{color:#E4E4E4;text-decoration: underline;}
a.style1:active{color:#E4E4E4;text-decoration: underline;}
a.style1:hover{color:#000080;text-decoration: underline;}
a.style2:link{color:#000000;text-decoration: underline;}
a.style2:visited{color:#000000;text-decoration: underline;}
a.style2:active{color:#000000;text-decoration: underline;}
a.style2:hover{color:#0000FF;text-decoration: underline;}
a.style3:link{color:#0000FF;text-decoration: none;}
a.style3:visited{color:#0000FF;text-decoration: none;}
a.style3:active{text-decoration: none;}
a.style3:hover{color:#FF0000;text-decoration: none;}
a.style4:link{color:#000080;text-decoration: underline;}
a.style4:visited{color:#FF0000;text-decoration: underline;}
a.style4:active{color:#0000FF;text-decoration: underline;}
a.style4:hover{font-size:17px;color:#0000FF;text-decoration: underline;}
a.style5:link{color:#000080;text-decoration: underline;}
a.style5:visited{color:#000080;text-decoration: underline;}
a.style5:active{color:#FF6600;text-decoration: underline;}
a.style5:hover{color:#FF6600;text-decoration: underline;}
a.style6:link{color:#008080;text-decoration: underline;}
a.style6:visited{color:#008080;text-decoration: underline;}
a.style6:active{color:#008080;text-decoration: underline;}
a.style6:hover{color:#FFFFFF;text-decoration: underline;}
a.style7:link{color:#FFFFFF;text-decoration: underline;}
a.style7:visited{color:#FFFFFF;text-decoration: underline;}
a.style7:active{color:#FFFFFF;text-decoration: underline;}
a.style7:hover{color:#000080;text-decoration: underline;}
</style>

Is their any problems with that or the html itself causing firefox to render the pages in such a poor manner?

Cheers

[edited by: encyclo at 6:42 pm (utc) on June 20, 2007]
[edit reason] See Guide to Posting Code [webmasterworld.com] [/edit]

[JohnRoy]

seems a CSS related issue. Also, the URL, would be removed soon I assume.

[The_Hat]

Find & replace will be your new friend.

Making a website is only half the battle.. the other half is effectively managing it.

See if you can find bits that are the same on all pages (sure there will be) copy that code and create an include.. find & replace that code with the include call.. In that way you can break a website into includes that you can change once and have the entire site change.

Tweak one page to perfection then copy those changes through the batch find and replace..

Sounds like a fun time to me.

[Xapti]

You're just in a huge mess. That CSS code is garbage.
I'd probably recommend a complete redesign, however possible, and don't dare use that program to make the new site.

[The_Hat]

ohh yeah.. I neglected to mention that the code looks terrible to me as well.. The design doesn't look to bad to me but the code does.. That's why what I would do is take one of those pages and save it as text.html (or whatever) outside of the site navigation so that you could test away from the public.. get the code massaged and then start rolling out those changes site wide..

Sounds like fun.. but then that's one of the things I enjoy so much about this stuff is the problem solving.

[thecoalman]

or am I going to have to painfully edit every single page?

This will happen again, suggest you bite the bullet and start from scratch. Learn how to use includes for parts of your pages like you navigation that doesn't change, format everything with CSS.

This will help prevent such headaches like you have now. :)

[g1smd]

>> That's why what I would do is take one of those pages and save it as text.html (or whatever) outside of the site navigation so that you could test away from the public. <<

You are going to need to use "includes" for common parts of pages so that you only need to edit the included code once and that is then included in every page of the site.

To test this, you'll need to install a local copy of Apache on a local machine. You can use this for development of the site, serving it as if it were a real site - but visible only to you, as "http://localhost/".