Bootstrap.min.css differs from bootstrap.css

Question

As I was fixing one of my clients website, I bumped into an odd problem, which I reproduced with another site I made as well. It seems that the bootstrap.min.css and the bootstrap.css files are not the same. (well duh) but as in specified code. For example: I found out that the IMG tag is not propperly handled in the bootstrap.min.css file. I cant find the code for it in the min file, while its normally specified in the bootstrap.css file.

The bootstrap.min.css simply states

img {
    border: 0
}

and later adds

img {
    vertical-align: middle
}

while the bootstrap.css applies:

img {
  width: auto\9;
  height: auto;
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

For now, I pulled out the piece of CSS specified for the image and put it in my custom stylesheet.

So far this is the only problem I encountered, but somewhere in the back of my head is this voice that whispers: include the other one too, just to catch up any other css problems if they occur...

Whats your oppinion about this? Add the official one too (or toss out the min file and just add the normal one, with making the load time a few miliseconds longer)

Can't you just manually minify a new bootstrap.min.css from your bootstrap.css? It is possible that perhaps they got out of sync at some point - for example, bootstrap.css is from bootstrap 3.1 and bootstrap.min.css is from bootstrap 3.0. — Steve Sanders
– Steve Sanders, Commented Jun 3, 2014 at 19:02
I think they got out of sync yes, however, they are both the same version. I noticed also some other things that didnt match up. I ll just minify the bootstrap.css file i guess. — Dorvalla
– Dorvalla, Commented Jun 3, 2014 at 19:29

Victor Ramos · Accepted Answer · 2014-06-03 18:26:57Z

1

This is a situational problem. You must find out if you're going to be using Bootstrap heavily and often in the future. If that is the case, then you're better off including the non minified version, like you said, in case of future errors. Now, if it is the opposite, then keep the minified version for performance.

answered Jun 3, 2014 at 18:26

Victor Ramos

1753 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Or Barmatz · Accepted Answer · 2014-06-03 18:38:57Z

0

Twitter Bootstrap is a fully functional, heavily used CSS framework. The original code is written in LESS and compiled into CSS for distribution. Part of their compilation includes minifying the full output. This is done using Grunt, a popular NodeJS taskrunner.

There maybe some optimisations in the minified code and hence it seems to vary. Since they also test their code as part of a CI process I feel both the production and minified versions can be trusted.

Checkout their Github and report any issues to them.

https://github.com/twbs/bootstrap

answered Jun 3, 2014 at 18:38

Or Barmatz

3073 silver badges8 bronze badges

2 Comments

Steve Sanders Over a year ago

Are you implying that the css minifier removed 6 declarations from the CSS? That seems extremely unlikely.

Or Barmatz Over a year ago

I'm saying that I trust the Twitter Bootstrap and Node Grunt teams to know what they are doing. I haven't inspected the code myself to that degree, but I trust their test coverage would pick up discrepancies.

Collectives™ on Stack Overflow

Bootstrap.min.css differs from bootstrap.css

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related