Welcome Guest, Not a member yet? Register   Sign In
CSS not loading in IE
#1

[eluser]philstan[/eluser]
Guys, I'm on my knees in frustration over this. This is my first CI project and I have learned a lot, however, I hope someone will take pity on this noob and tell me what's going on here.

I have a template.php view file in which I load various different views. By and large it works ok in Firefox but NO CSS is getting loaded in IE, ALTHOUGH I can see the correct references in the IE Source file. I should add that in Firefox SOME (and only some) of the CSS will not load from an external CSS file but will load when the style is included in the file.

Please feel free to check out the URL at http://profits4purpose.fridayharbourtesting.com/

Thank you, thank you thank you in advance.

Here is the template.php file:

[code]<?=doctype('xhtml1-trans');?>

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title><?php echo $title;?> | Profits 4 Purpose</title>

<link rel="stylesheet" type="text/css" href="<?=base_url(); ?>assets/css/defaults/base.css" />
<link rel="stylesheet" type="text/css" href="<?=base_url(); ?>assets/css/defaults/visual.css" />
<link rel="stylesheet" type="text/css" href="<?=base_url(); ?>assets/css/template.css" />

<!--[if lte IE 7]>
<link href="<?=base_url(); ?>assets/css/ie7only.css" rel="stylesheet" type="text/css" />
#2

[eluser]slowgary[/eluser]
It's not working in chrome either. You're missing your closing </head> tag, that might be why. Some browsers are more forgiving than others, unfortunately. If firefox had failed to display your CSS you'd probably have realized it was something like a missing tag. Instead, when it works in one and not the other it seems more like some cross-browser issue.
#3

[eluser]philstan[/eluser]
Thank you slowgary for your help.

The code above is shortened and you're right I cut it off before the </head> tag. However the tag is in the code and can be seen in the "view source" (see below for relevant section).

After sifting through the forum, it seems to me to be an .htaccess thing. I do have mod_rewrite on and it seems that other's have suffered the same sort of problem. However, I'm not sure why it would inflict one browser and not another...

Any thoughts on this?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
&lt;html &gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"/&gt;

&lt;title&gt;Welcome | Profits 4 Purpose&lt;/title&gt;

&lt;link rel="stylesheet" type="text/css" href="http://profits4purpose.fridayharbourtesting.com/assets/css/defaults/base.css" /&gt;
&lt;link rel="stylesheet" type="text/css" href="http://profits4purpose.fridayharbourtesting.com/assets/css/defaults/visual.css" /&gt;
&lt;link rel="stylesheet" type="text/css" href="http://profits4purpose.fridayharbourtesting.com/assets/css/template.css" /&gt;

&lt;!--[if lte IE 7]>
&lt;link href="http://profits4purpose.fridayharbourtesting.com/assets/css/ie7only.css" rel="stylesheet" type="text/css" /&gt;
<![endif]--&gt;

&lt;style&gt;
#header-title{
margin:0 10px 0 0;
padding:0px;
}
&lt;/style&gt;

&lt;/head&gt;

&lt;body&gt;
#4

[eluser]slowgary[/eluser]
I didn't check the code above, I looked at your source through an html validator extension to firefox and it said you don't have an ending head tag. Looking again, it also says you don't have a closing html tag. The problem I think is that you have some illegal characters after the IE7 only CSS link. Was it copied from word or something? Check it out through the firefox html validator extension.
#5

[eluser]slowgary[/eluser]
mod_rewrite happens on the server. It would always be passing the same url back to your browser. So you're right, a mod_rewrite issue would not effect only one browser, but all of them.
#6

[eluser]philstan[/eluser]
Thanks slowgary,

I downloaded the validator and saw it indicating the missing head tag. I have taken out the whole IE7 only thing, followed the validator's changes and it still doesn't seem to load in IE. As I mentioned only SOME of the the template.css doesn't show in Firefox.

So you think it's probably something in the .css file or html?

I hope so, as mod-rewrite scares the %^&* out of me...

Thx
#7

[eluser]philstan[/eluser]
Also, if you look in Firebug, a lot of the divs in the page are greyed out, even though they have css attached to them...

ARGH!
#8

[eluser]slowgary[/eluser]
It's something to do with your base.css. I made a local copy of your page and everything worked once I removed the link to base.css. This is why I hate these css resets. All they do is cause problems, and a lot of bloat.
#9

[eluser]philstan[/eluser]
You're a GENUIS!!! That's it!

Thanks slowgary, people have been awarded Nobel prizes for less ;-)

You're absolutely right about the resets. I've used them on the past couple of projects because it seemed the thing to do, but frankly they've just duplicated a lot of what is already there.

Thank you!




Theme © iAndrew 2016 - Forum software by © MyBB