By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,962 Members | 1,791 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,962 IT Pros & Developers. It's quick & easy.

need help solving IE6 and Firefox display inconsistency

P: n/a
I am having the following problem
http://jessica.ourprofile.net/

are being rendered differently on Firefox and IE6 (PC).

I have outline the div culprits in red to help with debugging.
Basically, the logo div sits about 10 pixels below the top of the page
in Firefox pushing content where I want it to be. IE does not push the
logo down and hence the problem.

I have tried just about everything and have made sure I am working in
standard mode (not quirks).

Please help!

The problems styles:

#nav { border: 0pt none ; margin: 0pt; padding: 0px 0px 0px 25px;
float: left; top:0px; width: 724px; height: 132px;
background:url(../images/common/nav.jpg) no-repeat 20px bottom;display:
inline; border: 1px solid #F00;}
/*Logo*/
#nav h1 { text-indent: -10000px;}
#nav h1 a { background: transparent url('../images/common/logo.gif')
no-repeat bottom; width: 214px; height: 88px; border: 1px solid #F00;}

/*navigation buttons */
#nav ul { margin: 0pt; padding: 0pt; background: transparent
url('../images/common/nav_all.gif') repeat; position: relative; width:
491px; height: 17px; }
#nav ul li { margin: 0pt; padding: 0pt; list-style-type: none;
list-style-image: none; list-style-position: outside; position:
absolute; top: 0pt; }
#nav ul li, #nav a { border-bottom: 0pt none; display: block; height:
17px; }
#nav ul li a { text-indent: -9999px; text-decoration: none; }

Sep 11 '06 #1
Share this Question
Share on Google+
2 Replies


P: n/a

Jessica M wrote:
I am having the following problem
http://jessica.ourprofile.net/

are being rendered differently on Firefox and IE6 (PC).

I have outline the div culprits in red to help with debugging.
Basically, the logo div sits about 10 pixels below the top of the page
in Firefox pushing content where I want it to be. IE does not push the
logo down and hence the problem.

I have tried just about everything and have made sure I am working in
standard mode (not quirks).

Please help!

The problems styles:

#nav { border: 0pt none ; margin: 0pt; padding: 0px 0px 0px 25px;
float: left; top:0px; width: 724px; height: 132px;
background:url(../images/common/nav.jpg) no-repeat 20px bottom;display:
inline; border: 1px solid #F00;}
/*Logo*/
#nav h1 { text-indent: -10000px;}
#nav h1 a { background: transparent url('../images/common/logo.gif')
no-repeat bottom; width: 214px; height: 88px; border: 1px solid #F00;}

/*navigation buttons */
#nav ul { margin: 0pt; padding: 0pt; background: transparent
url('../images/common/nav_all.gif') repeat; position: relative; width:
491px; height: 17px; }
#nav ul li { margin: 0pt; padding: 0pt; list-style-type: none;
list-style-image: none; list-style-position: outside; position:
absolute; top: 0pt; }
#nav ul li, #nav a { border-bottom: 0pt none; display: block; height:
17px; }
#nav ul li a { text-indent: -9999px; text-decoration: none; }
hoping someone can help with this? I am still stuck! Thanks jim for the
suggestions--tried them but I think the problem is IE not Firefox

Sep 13 '06 #2

P: n/a
what if you just set a top margin on the page? it seems like youre
overcomplicating this

"Jessica M" <ma************@gmail.comwrote in message
news:11**********************@d34g2000cwd.googlegr oups.com...
>
Jessica M wrote:
>I am having the following problem
http://jessica.ourprofile.net/

are being rendered differently on Firefox and IE6 (PC).

I have outline the div culprits in red to help with debugging.
Basically, the logo div sits about 10 pixels below the top of the page
in Firefox pushing content where I want it to be. IE does not push the
logo down and hence the problem.

I have tried just about everything and have made sure I am working in
standard mode (not quirks).

Please help!

The problems styles:

#nav { border: 0pt none ; margin: 0pt; padding: 0px 0px 0px 25px;
float: left; top:0px; width: 724px; height: 132px;
background:url(../images/common/nav.jpg) no-repeat 20px bottom;display:
inline; border: 1px solid #F00;}
/*Logo*/
#nav h1 { text-indent: -10000px;}
#nav h1 a { background: transparent url('../images/common/logo.gif')
no-repeat bottom; width: 214px; height: 88px; border: 1px solid #F00;}

/*navigation buttons */
#nav ul { margin: 0pt; padding: 0pt; background: transparent
url('../images/common/nav_all.gif') repeat; position: relative; width:
491px; height: 17px; }
#nav ul li { margin: 0pt; padding: 0pt; list-style-type: none;
list-style-image: none; list-style-position: outside; position:
absolute; top: 0pt; }
#nav ul li, #nav a { border-bottom: 0pt none; display: block; height:
17px; }
#nav ul li a { text-indent: -9999px; text-decoration: none; }

hoping someone can help with this? I am still stuck! Thanks jim for the
suggestions--tried them but I think the problem is IE not Firefox

Oct 2 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.