/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Difference between regular stylesheet and Global CSS…

Copy linkTweet thisAlerts:
May 01.2013

If HTML pulls all the CSS from a stylesheet, what is the purpose of a Global stylesheet? And is it all that important?

I see plenty of reason for the stylesheet, but I’m looking at a site’s stylesheet and their global stylesheet right now. They each have a lot of the same classes and id’s.

Is the HTML pulling the two different classes/id’s at the same time? How does that work?

Can someone clear this up for me?

to post a comment
CSS

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@rtretheweyMay 02.2013 — This is where the 'cascading' part of Cascading Style Sheets comes into play. The term "global" stylesheet is purely a term of art, and has no technical definition even though it is a common practice - especially in popular blog, forum, and CMS packages that allow optional plug-ins or add-ons.

Generally, a "global" stylesheet is used to hold the rules that would be shared throughout a website - the overall look-and-feel CSS rules. Then, individual pages within the site may or may not include additional stylesheets that can add new rules and modify/override the rules from the "global" stylesheet as needed to suit that particular page.
Copy linkTweet thisAlerts:
@jlnewnamauthorMay 02.2013 — Sounds very similar to a Master Page in a .net framework. Am I on the right track?

Okay... so, the project I'm working on has header like this...

[CODE]<link href="css/reset.min.css" rel="stylesheet"/>
<link href="css/global.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />[/CODE]

Based on your feedback, this is the header from my latest project. If I understand you correctly, my reset CSS is the primary, then the global, then the page's stylesheet.

If they're cascading, each succeeding stylesheet overrides the previous one.

What is the point of the reset.min.css sheet?
Copy linkTweet thisAlerts:
@rtretheweyMay 02.2013 — You've got the idea. The reset stylesheet generally eliminates the differences in the default settings for elements - commonly the 'margin' and 'padding' settings to reduce cross-browser compatibility issues.
Copy linkTweet thisAlerts:
@jlnewnamauthorMay 02.2013 — Another question about this... still a little confused.

What kind of IDs/Classes would I put into a global stylesheet that I wouldn't put into a regular stylesheet?
Copy linkTweet thisAlerts:
@rtretheweyMay 03.2013 — The "global" stylesheet generally holds the rules that control the general structure and common features of all of the pages for a website. Things like the layout and typography that will be used on every page would usually be controlled in the global stylesheet.

As I say, there's no strict definition to go by here. Most websites use a single common stylesheet that could be considered the "global" stylesheet. But many module-oriented packages like Wordpress or Joomla rely on multiple stylesheets to control different aspects of a site like the sidebars or individual sections. How you go about using this capability is pretty much up to you as the designer.
Copy linkTweet thisAlerts:
@jlnewnamauthorMay 03.2013 — Great! Thanks Rick. I'll play around with the concept.
×

Success!

Help @jlnewnam spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...