IE7 scrolling and rendering problem

I have two desktop machines both running XP home and using IE7. I also have two laptops, 1 is linux unbuntu with Opera,FF 3.5, Chrome and Epiphany browsers, and the other a new laptop with IE7.

Here's the problem. I am developing a website that so far works great until I load it with IE7. I have conditional style sheets loaded depending on the browser so everything lines up properly. This is working for IE7 and it looks fine, only the page takes a while to load, and more importantly, if you try scrolling it has a delay first, then scrolls about half a line, then jumps down about 4 or 5 lines and the screen renders VERY slowly.

I have done about 24hours of research into this and got the normal responses like :
it's a ram issue
it's your mouse driver
it's a plugin
it's because you have smooth scrolling enabled

My opinion is "It's an IE7 issue"

I need help working this out. I have tested a test page with other browsers on different machines and ALL work as they should except IE7 and I have tried that on 3 machines. All very jerky and slow.

It is NOT an internet problem as I also have a local server on two machines and the problem is there as well.
Any thoughts or ideas would be appreciated

As a footnote I might add that I have a feeling it is to do with the style sheet and absolute positioning but I'm not certain. I have attached the stylesheet code...
html, body {
	margin:auto;
	background:url('../images/hatch.png');
	}
a:link {
	color:yellow;
}
a:visited {
	color:yellow;
}
a:active {
	color:yellow;
}
#page
{
	width     :900px;
	height    :1213px;
}
#logo-area
{
	width     :900px;
	height    :106px;
  background-color:#000000;
	position  :relative;
	left      :0px;
	top       :0px;
}
#logo-left
{
	position  :relative;
	float     :left;
	top       :0px;
	width     :265px;
	height    :106px;
	background:url('../images/logo.png');
}
#admin-link
{
	position  :relative;
	left      :88px;
	top       :54px;
	width     :10px;
	height    :10px;
	cursor    :pointer;
}
#logo-mid
{
	position  :relative;
	float     :left;
	width     :315px;
	height    :106px;
  background-color:#000000;
}
#logo-right
{
	position  :relative;
	float     :left;
	width     :320px;
	height    :106px;
  background-color:#000000;
}
#email-block
{
	     float:right;
	position  :relative;
	top       :-56px;
	width     :280px;
	height    :56px;
}
#email-submission
{
	position:relative;
	float   :right;
	width   :280px;
	top     :0px;
	font    :12pt arial;
	color   :#dddddd;
      text-align:center;
}
#email
{
	position:relative;
	left    :60px;
	top     :5px;
	float   :left;
	width   :160px;
	height  :20px;
}
#email-go
{
	position:relative;
	float   :left;
	left    :60px;
	top     :3px;
	width   :41px;
	height  :25px;
	background: url('../images/email-go.png');
	cursor  :pointer;
}
#email-go:hover
{
	background: url('../images/email-go-over.png');
}
#block-main
{
	width     :900px;
	height    :340px;
    position  :absolute;
	left      :0px;
	top       :106px;
	background:url('../images/mainswf.png');
}
#horizontal-pin
{
	position  :absolute;
	top       :446px;
	left      :0px;	
	width     :900px;
	height    :1px;
  background-color:#dddddd;
}
#menu-block
{
	width     :239px;
	height    :766px;
    position  :absolute;
	left      :0px;
	top       :447px;
	text-align:left;
  background-color:#2d2d2d;
	color     :#e6e6e6;
}
#menu-main
{
	position  :relative;
	left      :16px;
	top       :10px;
	background:url('../images/menu/menu-button.png');
	width     :200px;
	height    :auto;
 background-repeat:no-repeat;
      overflow    :hidden;
}

#menu-main1
{
	position  :relative;
	left      :16px;
	top       :10px;
	width     :200px;
height :26px;
}
#menu-main-text
{
	position  :relative;
	left      :40px;
	top       :4px;
	font      :12pt arial;
	color     :#e6e6e6;
       font-weight:bold;
	cursor    :pointer;
}
#menu-main-text:hover
{
	color     :#CDCDCD;
}
#menu-sub
{
	position  :relative;
	left      :24px;
	top       :10px;
	width     :132px;
	height    :15px;
	background:url('../images/menu/menu-sub.png') 0%;
 background-repeat:no-repeat;
 margin-bottom    :4px;
	padding   :3px;
}
#menu-sub-text
{
	position  :relative;
	left      :35px;
	top       :-2px;
	font      :12pt arial;
	color     :yellow;
	cursor    :pointer;
	padding   :4px;
	}
#menu-sub-text:hover
{
	color     :white;
}
#credit
{	position  :relative;
	left      :16px;
	top       :50px;
	width     :200px;
	height    :30px;
	background:url('../images/menu/credit.png');
}
#vertical-pin
{
	position  :absolute;
	left      :239px;
	top       :447px;
	width     :1px;
	height    :766px;
  background-color:#dddddd;
}
#block1
{
	width     :660px;
	height    :218px;
        position  :absolute;
	left      :240px;
	top       :447px;
	background:url('../images/page2.png');
}
#block1-text
{	position  :absolute;
	width     :652px;
	height    :72px;
	left      :240px;
	top       :665px;
        background:url('../images/hatch2.png');
	text-align:left;
	font      :12pt arial;
	color     :#dddddd;
	padding   :4px;
}
#block2
{
	width     :660px;
	height    :218px;
        position  :absolute;
	left      :240px;
	top       :745px;
	background:url('../images/page3.png');
}
#block2-text
{	position  :absolute;
	width     :652px;
	height    :72px;
	left      :240px;
	top       :963px;
    background:url('../images/hatch2.png');
	text-align:left;
	font      :12pt arial;
	color     :#dddddd;
	padding   :4px;
}
#block3
{
	width     :660px;
	height    :170px;
    position  :absolute;
	left      :240px;
	top       :1043px;
	background:url('../images/page4.png');
}
#page1
{       position  :relative;
	float     :right;
	width     :660px;
	font      :18pt verdana;
	color     :maroon;
   padding-top:5px;
	text-align:left;
}
#bottom-menu
{
	position  :relative;
	top       :-43px;
	width     :898px;
	height    :40px;
background-color:black;
	font      :10pt arial;
	color     :silver;
	text-align:right;
}

Open in new window

LVL 20
Mark BradyPrincipal Data EngineerAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Mark BradyPrincipal Data EngineerAuthor Commented:
Here is the test page link. Please try it with IE (any version) and any other browser and let me know the results please.

www.bnsrecords.net/dropshop/
0
Dave BaldwinFixer of ProblemsCommented:
Firefox 3.6 and IE6 seem to work Ok, IE8 has to be put into compatibility mode.  I dont' have IE7 anymore.  But your page won't 'validate', it shows 51 errors.  You can go to this page [ http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.bnsrecords.net%2Fdropshop%2F ] to see what I mean.
0
Mark BradyPrincipal Data EngineerAuthor Commented:
Wow. Ok let me go and fix those issues and retest it. Thanks !
0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Mark BradyPrincipal Data EngineerAuthor Commented:
I'm not sure how to respond to this problem but this function seems correct. It works. the value of 'x' comes from a PHP variable and it is obviously working so maybe that est page doesn't look at php variables?

function menuclose()
{ var x=0, i=1;
x = '<?php echo $x+1;?>';
for(i=1;i<x;i++){   /// showing an error here on the validation page. The ';' needs to be there (I think)
document.getElementById('menu-main'+ i).style.height = '30px';
}
}
0
Dave BaldwinFixer of ProblemsCommented:
The validation problem with for(i=1;i<x;i++){ is probably that your javascript 'type' is missing.  It is also common to enclose your javascript in comment marks so browsers and validators don't consider it HMTL.   Some of the other problems are that 'id's are supposed to be unique.  If you're just trying to apply a common style, then classes can be used for many elements.
0
Mark BradyPrincipal Data EngineerAuthor Commented:
Ok I'm slowly fixing those issues. Can you point me in the right direction to find the correct way to insert the HTML document statement using English. Here is what I have now:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

That is causing one of the errors saying there is no character type
0
Dave BaldwinFixer of ProblemsCommented:
I've attached what I would do, the 'meta' statement is the one you need to fix that.  Although I know a lot of people are big on XHTML, I'm not.  I mostly stick with HTML 4.01 Transitional which is the DOCTYPE in my example code.  It's easier than XHTML for a lot of things.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Mark BradyPrincipal Data EngineerAuthor Commented:
Excellent. That will work for me. I'm not sure if it will fix the scrolling problem but if it doesn't, I'll post another question once I get rid of those errors. Thanks!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Browsers

From novice to tech pro — start learning today.