12 replies [Last post]
iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

I would like to get opinions on having a lot of small stylesheets (breaking up your styles into groups) versus having just a few large ones. In the end, compression takes care of having multiple files, but why do you like one over the other. I am not a fan of having 20 css files open at one time. I work faster when having just a few sheets.

Tags:
Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 2 weeks 2 days ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2050
Points: 2282

One.

One.

iamfratty wrote:

... In the end, compression takes care of having multiple files ...

Puzzled What does that even mean?

iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

gzipping your css

gzipping/aggregating/compressing your css files

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 2 weeks 2 days ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2050
Points: 2282

iamfratty

iamfratty wrote:

gzipping/aggregating/compressing your css files

How does any of that reduce server requests? Does aggregation create one from many and if so, what do you use to accomplish this?

My answer is still "one". I see no advantage to separate files.

iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

There are many ways. Most

There are many ways. Most notably, through php, apache mod_deflate and a few others. Most large sites do regardless of how many css files they have. I could/would never just use one file. I work with usually 3 to 4.
This site does it. (Drupal of course)

  <link type="text/css" rel="stylesheet" media="all" href="/files/css/css_5355670da5ffc2f180600487ed7186e1.css" />
<link type="text/css" rel="stylesheet" media="screen" href="/files/css/css_e5173e6f4fa4e44a41e47e36d48ce943.css" />
<link type="text/css" rel="stylesheet" media="print" href="/files/css/css_466de221a86fc2fff7df47ea68e2fb0e.css" />
  <script type="text/javascript" src="/files/js/js_4e28cf5fbe1aaa798eb8df34fa1e19c9.jsmin.js"></script>

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 2 days 13 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Aggregating combines css

Aggregating combines css files for the same media types etc. into one file. Drupal's inbuilt css aggregation does this.
Having multiple files is not really a problem in most normal low traffic sites.
Many large site have different themed sections, so it makes sense to have separate stylesheets for the section. You could have core stylesheets used site wide then add specific ones where required.

Stylesheets should be cached by browsers, so on subsequent visits the http requests would be minimal.

IE6 not sure about other versions only supports 30 css files, any more then that are ignored.

iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

@Tony I am looking for more

@Tony I am looking for more of opinions instead of a standard answer. For instance Zen, which has:

block-editing.css
block-editing-rtl.css
blocks.css
comments.css
drupal6-reference.css
fields.css
forms.css
forms-rtl.css
html-reset.css
html-reset-rtl.css
ie.css
ie6.css
ie6-rtl.css
layout-fixed.css
layout-fixed-rtl.css
layout-liquid.css
layout-liquid-rtl.css
messages.css
messages-rtl.css
navigation.css
nodes.css
page-backgrounds.css
pages.css
pages-rtl.css
panels-styles.css
print.css
tabs.css
tabs-rtl.css
views-styles.css
wireframes.css

When I am theming a site, I hate having all of these open (or opening and closing as needed). I get confused and forget what tab is sitting where. It just makes me mad. I wanted to know others opinions on it.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 2 days 13 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Ok since you are talking

Ok since you are talking Drupal themes, I usually build my own from scratch with only a couple of files.
Yes that is too many stylesheets to be managing in one theme.
With Zen aren't you meant to use it as a base them and create your own sub theme that just over writes what you want.
If you are having to modify all of those files then you would be better of starting from scratch or using a different base theme.

One problem with Drupal is that every module can have it's own stylesheet. This can be good but in many cases it means the site is over styled. Core overrides default browser styles, modules override core, then themes override module styles. It provides a lot of flexibility but you end up with thousands of lines of CSS.

In Drupal 7 it is easy enough to turn off stylesheets in your theme http://drupal.org/node/263967

iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

All those are in zen starter,

All those are in zen starter, which is when your creating a custom sub theme.

What I am more looking for is what people like better using ----A few master monolithic css files, or having them broken up into files of a certain grouping, like a navigation file, a comments file, a nodes file, a pages file, a messages file, a forms file, etc. I have been working with Drupal for 4 years, so I am familiar with everything regarding Drupal. I am just interested in what people feel more comfortable with and why.

I hate having so many css files, but I am sorta being pushed to like it.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 1 week ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Just one file

With both screen and print styles in it.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 2 weeks 2 days ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2050
Points: 2282

iamfratty wrote:... I

iamfratty wrote:

... I could/would never just use one file. ...

That's fine but I would like to know the advantage. So far I've found exactly zero.

Tyssen wrote:

Just one file ... With both screen and print styles in it.

Makes the most sense to me.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Sadly this question gets

Sadly this question gets slightly pre-empted by the monster CMS platforms that have all but taken over the site development world; WP as an example has to work to multiple stylesheets, chiefly due to modules or plugins requiring to add their own styles but also most theme authors tend to break their own theme into two or three style sheets.

Personally I would still contend that working with a single well structured file is the correct approach. @importing other styles - by way of typifying one reason there might be multiple sheets - was always the method for adding further styles if you were say loading the master files for the site then as a sub dept you required particular styles, so the page loaded a master style file @importing a common set and then described the unique styles for those sub pages.

I find I've been drawn slightly to the idea of breaking styles up somewhat, into say a sheet for the layout framework, the main site wide styles, and perhaps a sheet for pages that required markedly different styles. I do not think though that this approach has any real benefit over the single stylesheet but does mean you are not always scrolling through hundreds of lines when editing.

One disadvantage of multiple files can be that it becomes harder for others to maintain and in effect the supposed benefit of smaller groups is actually lost in a confusion of flow of styles, of the danger in repeating rules/ properties unnecessarily.

The example you provided earlier of the Zen sheets is horrendous but seems typical of framework / CMS approaches and is something I would find extremely irksome having to work with.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

iamfratty
iamfratty's picture
Offline
newbie
Last seen: 10 years 21 weeks ago
Timezone: GMT-7
Joined: 2011-05-14
Posts: 6
Points: 7

I think the only benefit for

I think the only benefit for having sheets set up like the Zen theme is for non-techie usability. Having it that way means more people will use your theme because it is easier to use. Like having so many point-click options in the admin (which I hate). It might be easier to point and click for non-techies, but it creates unnecessary and more code. As a person that knows what they are doing, I just want the bare bones basics, and I will add what I need to.