What is the difference between bootstrap.css and bootstrap-combined.min.css?

Question

I am using bootstrap.css and I found that there is another css file named bootstrap-combined.min.css, is there any difference in style? Is there any need to include both css files? Which one is more preferable?

Solution 1

The file bootstrap-combined.min.css is for Bootstrap v2, it is the combined css file of bootstrap.css (the main css file) and bootstrap-responsive.css (the responsive Bootstrap styles). It's exactly the same as using those two files separately but it just saves you an extra request.

The "min" part of the filename just means that it has been minified, which is to say that it has had all the unnecessary white-space/comments/etc removed.

Conclusion

bootstrap.min.css = compressed version of bootstrap.css
bootstrap-combined.min.css = bootstrap.min.css + bootstrap-responsive.min.css

Solution 2

Basically min is minified version, which is intend for production. In normal version you can see through codes and edit (In some cases, necessary though). Sizes are remarkable reduced in minified version and relieve bandwidth, time and memory.

Solution 3

The combined indicates a collection of bootstrap components merged into one file. The min indicates a minified file, meaning:

Minification (also minimisation or minimization), in computer programming languages and especially JavaScript, is the process of removing all unnecessary characters from source code without changing its functionality. These unnecessary characters usually include white space characters, new line characters, comments, and sometimes block delimiters, which are used to add readability to the code but are not required for it to execute.

The minified combined version is most preferable for production deployment, as it minimizes the number of requests and bandwidth used, thus improving page load speed. During development you may find a use for non-minified non-combined files for debugging purposes, but that's unlikely. In general, the combined-min version is just fine.

Solution 4

from the comments: afaik in general the min.js versions of .js files dont have any comment-sections or unneccessary blank-spaces to reduce the file size - at the end of the day, as you already said, there's no difference in functionality. in case of bootrap: you dont have to include both of them (as shown here).

View more solutions

Comments

[Matthias R.]

afaik in general the min.js versions of .js files dont have any comment-sections or unneccessary blank-spaces to reduce the file size - at the end of the day, as you already said, there's no difference in functionality. in case of bootrap: you dont have to include both of them (as shown here: getbootstrap.com/javascript)

[vipin]

If I am using combined-minified version is there any need to include the other one(bootstrap.css or bootstrap.min.css).

[Niels Keurentjes]

No, always include only the one you need.