CSS Disappearing into a Vacuum

[tylerh33]

Hello Fellow CMSMS Folk,
I've just completed my first site on CMSMS, and had a pretty good experience.  I'm getting troubled by one issue that seems out of my control, and would really appreciate any help with this.

The problem is, once every 20 clicks or so (it might just be random, as it happens all over the place, but not often), one of the pages will randomly drop it's menu CSS.

*** It ends up looking like this: ***



*** When it should look like this: ***



Has anyone heard of this before??  Muchos gracias!

Tyler

[CWebguy]

Sometimes the browser will fail to download css file, either at all or completely (so you will get a page with no styling).  Sounds like maybe your menu stylesheet isn't getting downloaded?  If it works fine on a local machine, but just happens on your server, sounds like maybe your server is "hiccuping".  Just my guess.  Maybe someone else knows more!

CWebguy

[tylerh33]

Hi CWebGuy,
The client is on "GoDaddy", which is probably not the best host around, so it's quite possible.  Thanks for your thoughts!

Tyler

[CWebguy]

Hey, yeah, I have them also, (but I don't use it, haha).  You may be able to set the stylesheet to cache, and then this shouldn't be a problem as it won't have to download/re-download it on each page (I think?)  I'm no expert in these fields, but I hope this helps! Just my thoughts

CWebguy

[tylerh33]

OH, that would be incredibly useful if that worked.  I've set that in CMSMS to 10000.  Is there anywhere else I can re-enforce it?  I'd have thought that would be enough to solve the problem, but it still seems to occur.  Very weird.  :<

[CWebguy]

I haven't messed much with it, so I don't know.  You could technically combine all your stylesheets into one file, or at least squeeze a couple together.  This would probably actually be beneficial, and it's what Yahoo recommends to speed up server speed (less header requests made on the server).  Then you would just need to link your template to that one file (or couple files) in CMSMS.

Hope this helps
CWebguy

[fredp]

I haven't messed much with it, so I don't know.  You could technically combine all your stylesheets into one file, or at least squeeze a couple together.  ... Then you would just need to link your template to that one file (or couple files) in CMSMS.

Hi CWebguy,

I think you're right.  At least manually merging the stylesheets worked for me.  I independently ran into the "css hiccup" problem last week on my linux development machine (openSUSE 10.3, cmsms 1.4.1).  I'm new to CMSMS; so, I investigated what I was seeing for the "learning experience".  Wish I'd of waited for your post instead!       For anyone interested, here are a few details:

There were no problems viewing my localhost site with the linux version of Firefox3. But, if I viewed the same site with IE6 under Wine (v1.1.2), then I'd see frequent intermittent styling problems when viewing/reloading any page with 4+ stylesheets.  Out of curiosity, I copied the contents of the db stylesheets used by my template into one physical css file (foo.css). Then I manually ed that stylesheet file into my template, instead of using {stylesheet}. That worked great. Consistent styling in EI6/Wine after that. 

Hope this helps,
fredp

[Dr.CSS]

I combine them all the time, best way for me is to use the Web Dev. toolbar in Firefox and hit the edit CSS and all of them appear on the right side and I just copy then paste it into one new stylesheet and attach that to the template...

[CWebguy]

I knew that toolbar was good for something!  Thanks mark!

CWebguy

[fredp]

Hi again,

It looks like other folks are seeing the multiple stylesheet problem with IE:   http://forum.cmsmadesimple.org/index.ph ... 078.0.html  So, I was thinking about how we might enhance the {stylesheet} tag to implement the "use one stylesheet" workaround automatically.  (Insert evil laugh here)  

Would it be good if the {stylesheet} tag were modified to optionally generate a single tag that links to a single "virtual" stylesheet that would contain the contents of each of the template's associated stylesheets wrapped with an appropriate css2 @media {...} rule? The virtual stylesheet would look something like this:

Code: Select all

  @media handheld {
    /* Start of CMSMS style sheet 'Handheld' */
    ...
  }
  @media screen {
    /* Start of CMSMS style sheet 'Layout: Left sidebar + 1 column' */
    ...
  }
  @media screen {
    /* Start of CMSMS style sheet 'Module: News' */
   ...
  }
  @media print {
    /* Start of CMSMS style sheet 'Print' */
   ...
  }
...

With this enhancement, users wouldn't have to maintain parallel versions of the same css content.  A further enhancement might be to detect the frontend client's browser and only perform this workaround when the client is using IE (or some similarly broken browser). 

...Just a thought,
Fred

[Joe The Plumber]

Hey, yeah, I have them also, (but I don't use it, haha).  You may be able to set the stylesheet to cache, and then this shouldn't be a problem as it won't have to download/re-download it on each page (I think?)  I'm no expert in these fields, but I hope this helps! Just my thoughts

CWebguy

This may be the solution to my problem, too. My page CONTENT is randomly "disappearing" though it is actually still there-- if I re-open and re-save the page it suddenly comes back! Otherwise, it won't come back ever. It just stays a blank page even if I force-refresh the browser. So, I'm doubting it is a caching problem, but I will try it. How do you set the stylesheet to cache?

[Dr.CSS]

I think the whole problem, all of them like this, is the server....

I have a site with 14 pages of style sheets, and growing, and have never had a problem with the styles not showing up for a page...