PDA

View Full Version : Site Not Displaying Correctly in Firefox

illmatic
02-16-2007, 06:13 AM
My site (http://u-chain.org) displays perfectly fine in IE. But for users viewing with Firefox, it only loads the background. After doing some research, I found that the prob. is usually because the wrong Mime settings are set for css files. However, I checked on my server if the MIME settings were set to text/css for css files and they were. Still, users can only view a background. Any suggestions on why this may be the case?
Arwen
02-16-2007, 08:59 AM
Try removing the </link> tag after your stylesheet, it shouldn't be there. Also try changing

href="/news/wp-content/themes/orange/style.css"

to


href="news/wp-content/themes/orange/style.css"

And why didn't you put this:

.quote {
font-family:georgia;
font-size:7pt;
line-height:6.5pt;
color:gray;
text-transform:lowercase;
font-weight:italics;
}

.quote2
{font-variant:small-caps;
font-family:verdana;
font-size:9pt;
letter-spacing: 2px;
color:#ec8000; }

.quote3
{color:#f49e0f;}

into your stylesheet?
illmatic
02-16-2007, 01:54 PM
Because I only needed that coding for that specific page. Tried all of the above, same thing.
Arwen
02-16-2007, 07:36 PM
Hmm very strange... Can it be the javascripts you're using? Try putting them in external files and save them as example.js then put this:

<script language="JavaScript" src="example.js" type="text/JavaScript"></script>

into the <head> section. But I have no idea what's wrong... :confusion
illmatic
02-17-2007, 01:38 PM
Don't think it's the javascripts... they work fine in other sites. I'm not sure what the issue is. Perhaps it is a word press issue? I'm completely stumped as well.
Arwen
02-17-2007, 02:40 PM
Oh, you're using Wordpress. Hmm try asking in their forums, I'm sure someone there is more familiar with Wordpress then me. Good luck! :)
illmatic
02-21-2007, 11:53 PM
I've been having this issue for awhile. For some reason, none of my document/code files will display in Firefox at. all. They will show the background & the background only. Everything works fine in IE -- I even went to W3C to validate my site (so far, I only have 12 errors which are all insignificant not putting an alt code in my image tag), yet I have not seen ANY results. I'm at my wit's end attempting to figure out what the issue may be. I checked the MIME settings on my CSS, they're correct. I made sure I had a DOC type, it's there. I made sure I had the right character encoding, it's there as well. I made sure my CSS was validated, it is.

I'm using php includes. The funny thing is, if I view the include pages separately, the sidebar displays as it should (minus CSS settings of course) in my browser. The rest of them, just the background. Any and all help would be incredibly, indubitably appreciated.

Here is my CSS coding:


/*
Theme: Digital Orange
Description: Orange & gray digitalized theme
Theme URI: http://u-chain.org
Author: Dee
Author URI: http://u-chain.org/
*/



a:link { color:#959595; }
a:active { color:#ec8000; }
a:visited { color:#959595; }
a:hover { color:#ec8000; font-style:italic;
background-color:#959595;}

img {border:0;}

i {color:#ec8000;}



.quote {
font-family:georgia;
font-size:7pt;
line-height:6.5pt;
color:gray;
text-transform:lowercase;
font-style:italic;
}

.quote2
{font-variant:small-caps;
font-family:verdana;
font-size:9pt;
letter-spacing: 2px;
color:#ec8000; }

.quote3
{color:#f49e0f;}



b {color: #e76f00;}

a img {border:none;}

body { background-color:#cccbcc; background-image:url(/news/wp-content/themes/orange/images/BACK4.png);
background-repeat: repeat-x; }


#headbox
{width:650px; height:125px; position:absolute; top:0; left:0; border:0px;}

#main
{width:704px; position:absolute; top:0px;
text-align:justify;
background-image:url(/news/wp-content/themes/orange/images/TBCK.png);
background-repeat:repeat-y;
background-attachment:scroll;
background-color:white;
z-index:-1;
min-height:1700px;
margin-left:8.9em;
margin-right:3.9em;}


#content
{width:673px; position:absolute; top: 0; left: 27px;
z-index:0;}

.font
{font-family:trebuchet ms;
font-size:7pt;
color:#747474;
line-height:6.5pt;}

.TITLE
{font-family:verdana;
font-variant:small-caps;
color:#ec8000;
letter-spacing:0.3px;
font-size:9pt;}

.TIME
{font-size:6pt;
font-style:italic;}




And here is the link to the validation site as well as the coding for my site:

http://validator.w3.org/check?uri=http%3A%2F%2Fu-chain.org%2F&charset=%28detect+automatically%29&doctype=Inline&ss=1&outline=1&No200=1&verbose=1

And the link to my site: http://u-chain.org
J to the izzosh
02-22-2007, 12:38 AM
You've set the z-index for div#main to -1. The default value for z-index is 'auto' which takes its value from the z-index of a parent element. The body element, not having a specified z-index, is defaulting to auto, which gives it a value of 0 (greater than -1) with no positioned parent. Effectively, you've positioned div#main and everything in it behind your body element. Everything's being rendered properly; you just can't see it.
illmatic
02-22-2007, 02:51 AM
L.M.A.O. Smacks self in the face. Oh my gosh, thank you so much. --is slooow-.