Geek Answers Handbook

Combining files in different directories?

I recently ran into a problem on a website where the styling on the page was really messed up, but only in IE. My boss told me that most likely this is because the CSS package created contains CSS files from different directories, so I checked and did this. It was like the following:

bundles.Add(new StyleBundle("~/path/subpath/all").Include( "~/path/subpath/filename.css", "~/path/subpath/filename1.css", "~/path/subpath/filename2.css", "~/path/subpath/filename3.css", "~/path/subpath/anotherSubPath/filename.css", "~/path/subpath/anotherSubPath/filename1.css", "~/path/aDifferentSubPath/filename.css"));

He said that Bundling cannot work like this: you should only have files of the same directory in the Bundle, so I am breaking them up as shown below:

 bundles.Add(new StyleBundle("~/path/subpath/all").Include( "~/path/subpath/filename.css", "~/path/subpath/filename1.css", "~/path/subpath/filename2.css", "~/path/subpath/filename3.css")); bundles.Add(new StyleBundle("~/path/subpath/anotherSubPath/all").Include( "~/path/subpath/anotherSubPath/filename.css", "~/path/subpath/anotherSubPath/filename1.css")); bundles.Add(new StyleBundle("~/path/aDifferentSubPath/all").Include( "~/path/aDifferentSubPath/filename.css"));

This worked and fixed our problem in IE. So now to my questions:

  • Was my boss right? Can you not link files from different folders?
  • If he was right, why would it just break in IE? And why should you only bundle files from the same directory?
  • If he was not right, what could be the problem? And why was it necessary to split the knot, correcting it?
+7
c # css asp.net-mvc bundle bundling-and-minification
source share
3 answers

There are some known limitations for older versions of IE at least 10.

The number of CSS and Script IE files that can be downloaded can be downloaded - this can be a problem if you run the site in Debug mode, where the packages are not included.

If this is not the case, then do you have more than 4096 selectors in the file ???

CSS limitations in Internet Explorer

+1
source share

There is a common problem with package names and folders when your css files use the relative path to static files like images, fonts, etc.

For example, you have:

  bundles.Add(new StyleBundle("~/path/subpath/all").Include( ... "~/path/subpath/anotherSubPath/filename1.css"));

and in filename1.css you use background: url(image.jpg) , and usually this image is in the same folder as filename1.css , which is ~/path/subpath/anotherSubPath/image.jpg . Using the packages as shown below, the browser looks for the nonexistent file ~/path/subpath/all/image.jpg . Perhaps this is the reason for packet separation.

+2
source share

Your boss sounds amazing! Firstly, for CSS paths relative to the CSS file, so I suspect that is why he advised you to change all this.

But CSS length can also be a problem, and this was probably the main reason in this case.

Unfortunately, there are several features in browsers, such as this CSS code or image sizes on Apple devices (which sprite sheets previously hit). You boss look like a dynamic, turned on guy who knows that.

+1
source share

More articles:


All Articles