Rendering peoblem in IE but not in Mozilla

[san2008]

Hello,

please open this site:

http://www.sharminnajreen.com/Sharmin/index.html and navigate HOME, RESUME, and IMAGE menu in FireFox and in Internet Explorer.

You will observe that these 3 pages get rendered fine in Mozilla but not in IE: there are some flash or flicker upon rendering.

Do you have any suggestion or solution so that the problem in IE gets fixed.
Solutions can be:
> I might have wrong css or html code---what are they because I cannot find any
> When user moves from one page to another, a progress bar will load up that would load up all css and BG images, than the page would get rendered: how to do this?
>CSS and Javascript files will be loaded before the body get painted: how to do this either by php or by javascript?

Please give some suggestions. Thank you.
San

[bluewalrus]

You have home coded in that menu bar three times I'd pull out the other 2.

<div class="Alink" id="Layer8"><a href="index.html">Home</a></div>
<div class="Alink" id="Layer9"><a href="index.html">Home</a></div>

I'd put all your css in that one style sheet you have as oppesed to putting in the head of each document cause this way you going to be making alot more edits each time you want to change something.
So put this in style.css unless you do not actually have this file cause you have it refrenced in your second css declaration.


#Layer1 {
position:absolute;
left:0px;
top:0px;
width:1400px;
height:750px;
z-index:1;
background-image: url(images/bg_gradient1.gif);
}
#Layer2 {
position:absolute;
left:77px;
top:108px;
width:750px;
height:400px;
z-index:2;
background-image: url(images/gradient-box-flash-bg.jpg);
background-repeat:repeat-y;
scrollbar-1dlight-color:blue;
scrollbar-arrow-color:#8C8DB0;
scrollbar-base-color:#393C86;
scrollbar-face-color:#393C86;
overflow:auto;
border:groove;
}

#Layer3 {
position:absolute;
left:845px;
top:111px;
width:262px;
height:150px;
z-index:3;
}
#Layer4 {
position:absolute;
left:118px;
top:39px;
width:134px;
height:32px;
z-index:4;
}
#Layer5 {
position:absolute;
left:79px;
top:60px;
width:90px;
height:33px;
z-index:4;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #9DB0B0;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
#Layer6 {
position:absolute;
left:178px;
top:60px;
width:93px;
height:39px;
z-index:5;
}
#Layer7 {
position:absolute;
left:289px;
top:61px;
width:93px;
height:39px;
z-index:6;
}
.style3 {
font-family: Georgia, "Times New Roman", Times, serif;
line-height:2.0

}
#Layer10 {
position:absolute;
left:535px;
top:117px;
width:277px;
height:227px;
z-index:9;
background-image: url(25088661.jpg);
border:groove;
}
The links are flickering because they are getting smaller on the hover and when they switch to hover the mouse isn't on them any more so they switch back to regular where the mouse is on them and then switch back and so on till the mouse is moved off...On the right border and bottom of it.

Also the go on the right with nothing in it or around except in an input field i'd put something in to say to use it to search the only way i not that is what it is for is a java error that says search_form not defined. I also don't know how to fix that but searching jse_form just brings up alot of other forums with the same problem and no real solution that i see don't know if theres a file associated with that or not but if there is it needs an extension.


<form name="jse_Form" onSubmit="search_form(jse_Form);return false">
<input type="text" name="d" value="Search my site">
<input type="button" value="Go" onClick="search_form(jse_Form)">
</form>


Also in style3 i'd use a height set and get rid of all of those line breaks.

In layer7 i'd give it more space on the left cause the images is overlapping the resume.

[san2008]

Hello,

thank you a lot for reply; however, I have meant rendering the page but not rendering the links. Please ignore the search box and the links as I am still working on them.

Please open
http://www.sharminnajreen.com/Sharmin/index.html
and browse through RESUME and IMAGES tab in IE and then in MOZILLA.
You will observe that there is a flash/ flickering white light across the page in IE. [Please refresh the pages in IE and Mozilla to see what I am saying].

You will observe that these 3 pages get rendered fine in Mozilla but not in IE: there are some flash or flicker upon rendering.

Do you have any suggestion or solution so that the problem in IE gets fixed.
Solutions can be:
> I might have wrong css or html code---what are they because I cannot find any
> When user moves from one page to another, a progress bar will load up that would load up all css and BG images, than the page would get rendered: how to do this?
>CSS and Javascript files will be loaded before the body get painted: how to do this either by php or by javascript?

Please give some suggestions. Thank you.
San