The MySite content styles do not display in IE6 or IE7. They display fine in Firefox. Are there any known issues with this? I am using several of the CSS files that came with MySite plus a few of my own. All of them fail to display in IE browsers.

Might this be fixed in 3.2?

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

agentrickard’s picture

Unlikely. My testing is all FF based.

Debugging -- including screen shots and CSS fixes -- greatly appreciated.

I don't quite understand what you are reporting. Are the styles failing to load? Failing to work properly?

WISEOZ’s picture

FileSize
63.66 KB

Ya, me too (Firefox, that is).

The attached image shows how a mysite page is looking in IE6 and IE7 for your standard CSS files and the custom ones we created as well. It's basically style-less.

We're no CSS experts either so aren't certain how to resolve this for IE. Any suggestions from the rest of the house would be greatly appreciated.

agentrickard’s picture

This looks like a cascade / load failure.

What HTML is being generated for this page? Can you send me a link or post everything between <head></head>

WISEOZ’s picture

Here's an example link ... http://www.wiseoz.com/mysite/2/view

agentrickard’s picture

Hm. works fine in FF and Safari, and I don't have IE.

The key piece here is:

<style type="text/css" media="all">@import "/sites/all/modules/mysite/mysite.css";</style>

Which is being imported as expected. Perhaps it is not in IE?

agentrickard’s picture

Hm. If you compare the source HTML of http://www.wiseoz.com/mysite/2/view with that of http://therickards.com/mysite/agentrickard, you'll see that your page includes the following:

<div id="container" class="mysite_2">
<div id="content_group">
<div id="content">
...
<div class="inert ">

This code is not native to MySite and may be part of your theme. Perhaps those are interfering with the styles.

decibel.places’s picture

Version: 5.x-3.2 » 5.x-3.0rc1
Status: Closed (won't fix) » Active
FileSize
79.76 KB
17.58 KB
116.15 KB

Me too - fine in Ffox and Opera, no styles in IE

URL flydigits dot netsperience dot org

I have attached a screen capture and the source from the IE page, with base href added - this source file displays properly in Ffox and Opera but not in IE

.
.
.

I did some testing, the problem is with the placement of
<style type="text/css" media="all">@import "/sites/all/modules/mysite/mysite.css";</style>
If it is placed later in the head, it does not break the display in IE.

What's odd is even if I delete all the styles in the file, just having that import statement at that point breaks the styles:

<meta name="language" content="" />
<style type="text/css" media="all">@import "/sites/all/modules/admin_menu/admin_menu.css";</style>
<style type="text/css" media="all">@import "/sites/all/modules/devel/devel.css";</style>
<style type="text/css" media="all">@import "/sites/all/modules/mysite/mysite.css";</style>
<style type="text/css" media="all">@import "/sites/all/modules/ubercart/uc_store/uc_store.css";</style>
<style type="text/css" media="all">@import "/modules/node/node.css";</style>
<style type="text/css" media="all">@import "/modules/poll/poll.css";</style>
<style type="text/css" media="all">@import "/modules/system/defaults.css";</style>
<style type="text/css" media="all">@import "/modules/system/system.css";</style>

I don't know how to change the position of the import css statement...

.
.
.

Ok, I have commented out
drupal_add_css(drupal_get_path('module', 'mysite') .'/mysite.css');
in mysite.module at lines 80 and 510

I have added the css file in my theme page.tpl.php with

<?php print $styles ?>
<style type="text/css" media="all">@import "/sites/all/modules/mysite/mysite.css";</style>
<?php print $scripts ?>

sandwiched after the styles and before the javascripts

this hack seems to work!

.
.
.

I saw the correct style and layout in IE, then it went away... now it displays the content in one big block vertically

So one final suggestion - choose the "Show MySite pages full screen" option and the layout is back in IE

MySite Page Setup:
Show MySite within normal site theme
Show MySite pages full screen

agentrickard’s picture

Version: 5.x-3.0rc1 » 5.x-3.2
Status: Active » Closed (won't fix)

That says to me that IE is totally frakkin' broken. It would be nice if you could find out which element of the css is causing the break.

Nice work-around otherwise.

decibel.places’s picture

Version: 5.x-3.0rc1 » 5.x-3.2
Status: Active » Closed (won't fix)

Well, even when I delete all the styles and load a blank stylesheet, it still breaks in IE when loaded in that position in the head list of css imports

pretty weird

I updated my previous post, had trouble getting the mysite layout to display in IE, but it works when the view is set to display full page

(also weird)

there may be something funky going on with the js dhtml, I dunno

I can appreciate your disdain for IE but it is still used by about 52% of the audience:

2008 IE7 IE6 IE5 Fx Moz S O
July 26.4% 25.3% 0.3% 42.6% 0.5% 2.5% 1.9%

according to W3schools

as a web developer I always check my work in Ffox, Opera, Safari and, yes, IE

agentrickard’s picture

I suspect there is something other than MySite causing this issue. We fixed the IE issues a long time ago.

Perhaps it is not finding the file correctly?

You should also test in Garland -- the default theme. If it works there and not on your theme, then you have a theme issue.

decibel.places’s picture

Nope, won't show in IE in Garland either.

Wil only show styles in IE in full screen setting with the css code I cited above...

agentrickard’s picture

Status: Closed (won't fix) » Needs work

Does the demo site work properly? Does it work properly _not_ in full screen mode?

I need you to provide a real patch -- preferably to the css file itself -- since you are able to test this.

agentrickard’s picture

You could also try compressing the CSS files that Drupal uses. I suspect there is a conflict in one of the other modules.

agentrickard’s picture

See also http://drupal.org/node/270502 and http://www.google.com/search?q=drupal+IE+css+not+loading

Based on some quick reading, it may be image calls that are the problem -- but you report the same issue even with a blank css file, which makes no sense.

Otherwise, I would focus on these lines:

html.js div.collapsible span.mysite-header a {
  padding-left: 15px;
  background: url(plugins/icons/menu-expanded.png) 2px 75% no-repeat;
}
html.js div.collapsed span.mysite-header a {
  background-image: url(plugins/icons/menu-collapsed.png);
  background-position: 2px 50%;
}
agentrickard’s picture

CSS and HTML both validate -- any errors are not relevant to MySite.

http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Ftherickard...

http://validator.w3.org/check?uri=http%3A%2F%2Ftherickards.com%2Fmysite%...(detect+automatically)&doctype=Inline&group=0

decibel.places’s picture

[The CSS has 5 errors and 629 warnings -and two errors on HTML validation]

The demo site is viewable in IE7 - but it is Garland without any blocks in the sidebars, so it is sort of "full screen"

Actually my site looks the same in Garland using the full-screen setting - are you sure you're not using that setting on the demo site?

I am satisfied - using the full screen view is acceptable for my project, perhaps in the future I will use other solutions (panels, views)

agentrickard’s picture

Look closer -- none of those errors or warnings (that matter) comes from mysite.css -- I think something else might be causing the issue.

On the demo site, I use the full-screen option, which removes the sidebar-left and sidebar-right regions.

Panels or Views is a great solution, unless you want custom pages per user, which is what MySite provides.

Close the issue as you see fit.

decibel.places’s picture

Status: Needs work » Closed (won't fix)

That's precisely my point - your demo works because it is using the "full screen" view - which I have found is the only way to display the module in IE

Obviously you are not interested in addressing the incompatibility, at this point I am satisfied using full screen, so we may close it as "won't fix"

WISEOZ’s picture

Figured I'd pipe in here since I was the originator of the issue ... I just tried switching to Full Screen display but still have the same issue in IE7. No styles on My Site pages in IE7. My technical person has been struggling with this for months now and we haven't been able to figure out the issue yet. We are still hoping that someone smarter than ourselves will figure it out soon or provide a workaround that works. An example page to view is http://www.wiseoz.com/mysite/2/view.

decibel.places’s picture

Actually, some of your styles are working in IE7/IE6 - the page is structured, not completely unstyled.

There are some header/footer styles not working, I looked at /sites/all/modules/mysite/plugins/styles/WISEOZ.css (using Ffox Web Developer) and I did not find the problem, but it looks like there is a lot of unnecessary style info there, possibly some that is not standards-compliant.

ademarco’s picture

Hi all,

apparently the module http://drupal.org/project/unlimited_css solves this problem. Thanks to decibel.places for pointing it out in the module's issue queue #436882: IE Unlimited CSS Loader name change? module affects other browsers, fixes other issues.