Jump to:

22977 Posts in 11722 Topics by 2826 members

General Questions

SilverStripe Forums » General Questions » Order of css stylesheets

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1374 Views
  • mschiefmaker
    Avatar
    Community Member
    187 Posts

    Order of css stylesheets Link to this post

    Not sure if this is a stupid question but ...

    All my sites default to the stylesheets being attached in this order

    <!--[if IE 6]>
             <style type="text/css">
              @import url(themes/blah/css/ie6.css);
             </style>
          <![endif]-->
          
          <!--[if IE 7]>
             <style type="text/css">
              @import url(themes/blah/css/ie7.css);
             </style>
          <![endif]-->
       <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/layout.css?m=1260297200" />
    <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/typography.css?m=1260260916" />
    <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/form.css?m=1256016875" />

    If I make a change to attribute in ie6.css it gets overwritten by what is in layout.css (or typography etc) so my question is why is it not

    <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/layout.css?m=1260297200" />
    <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/typography.css?m=1260260916" />
    <link rel="stylesheet" type="text/css" href="http://www.anzata.org/themes/blah/css/form.css?m=1256016875" />

    <!--[if IE 6]>
             <style type="text/css">
              @import url(themes/blah/css/ie6.css);
             </style>
          <![endif]-->
          
          <!--[if IE 7]>
             <style type="text/css">
              @import url(themes/blah/css/ie7.css);
             </style>
          <![endif]-->

    Since no-one else is asking this I figure I have missed something simple but can someone help me out?

    Thanks as always

    Catherine

  • Willr
    Avatar
    Forum Moderator
    5462 Posts

    Re: Order of css stylesheets Link to this post

    This is a bit of a limitation with the requirements engine, it always writes the link tags to just before the </head>. My usual suggestion is just to use more verbose CSS selectors in your IE stylesheets.

    // say you had this in layout
    #Content p {}

    // you would use this in IE.css, the html gives it a higher stacking order
    html #Content p {}

    1374 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.