Solved

Combine CSS

Posted on 2011-09-29
5
207 Views
Last Modified: 2012-05-12
I have a website that uses 5 different CSS files.  There are many reasons for this.

Is there a way to combine them all into one link?  I dont/cant put all the styles into one CSS but in the head I would like to link one file and then that one file have all 5 of the style sheets in it.

How do I do this correctly?
0
Comment
Question by:rgranlund
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
5 Comments
 
LVL 15

Accepted Solution

by:
Eyal earned 500 total points
ID: 36817714
@import url("base.css");
0
 
LVL 7

Author Comment

by:rgranlund
ID: 36817733
@Eyal... then how do I write the base css?

@importurl(css-1.css);
@importurl(css-2.css);
@importurl(css-3.css);
@importurl(css-4.css);

is that correct?
0
 
LVL 15

Expert Comment

by:Eyal
ID: 36817748
yes, but pay attention the browser will download 5 files and not 1 but in your html it will include only the base css
0
 
LVL 10

Expert Comment

by:jtwcs
ID: 36817802
Eyal is correct but you also need to have the @import calls first in the main css file.  Meaning, they must come before any other declarations.

http://www.w3.org/TR/CSS2/cascade.html#at-import
0
 

Expert Comment

by:anandblitz
ID: 36890176
Try this:


<target name="css" description="Concatenate CSS source files">
    <loadtasks assembly="${NAntContrib}\NAnt.Contrib.Tasks.dll" />
    <echo message="Building ${BuildDir}\${CssFileLocation}\style.css" />
    <concat destfile="${BuildDir}\${CssFileLocation}\style.css" append="true">
      <fileset>
        <include name="${BuildDir}\${CssFileLocation}\*.css" />
        <exclude name ="${BuildDir}\${CssFileLocation}\default.css"/>
      </fileset>
    </concat>
    <echo message="${BuildDir}\${CssFileLocation}\style.css built." />
    <echo message="delete other files except style.css" />
    <delete>
      <fileset>
        <include name="${BuildDir}\${CssFileLocation}\*.css"/>
        <exclude name="${BuildDir}\${CssFileLocation}\style.css"/>
        <exclude name ="${BuildDir}\${CssFileLocation}\default.css"/>
      </fileset>
    </delete>
    <echo message="delete other files except style.css is done" />
  </target>
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Need help with this homework problem. 5 55
How to refresh a page from a sub domain in ajax ? 34 43
Table header must be on top 2 26
aria difference 2 13
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question