Bootstrap: Duplicate css selectors in 4.1.3/css/bootstrap.min.css

[Scrabble96]

Not exactly a bug, but unnecessary, are the following duplicated selectors:

pre (x3)
.table-bordered td, .table-bordered th (x2)
hr (x2)
.navbar-expand>.container, .navbar-expand>.container-fluid (x2)
.container (x2)
.table (x2)
.table td, .table th (x2)
body (x2)
.table .thead-dark th (x2)
.table-dark (x2)
.dropright .dropdown-toggle::after (x2)
.dropleft .dropdown-toggle::after (x2)
.dropleft .dropdown-toggle::before (x2)
.navbar (x2)

[XhmikosR]

Similarly as #27819

[Scrabble96]

Well, duh. Messy code slows down site performance.

[XhmikosR]

It's not messy code just because a tool says so.

This is a framework which consists of many parts. One is reboot for normalizing stuff across browsers; this will lead to a few duplicate selectors because it's offered as a separate component.

Most of the other rules must be from the print media rule.

Anyway, if there's room from improvement, you can always provide PRs which solve issues, because the amount of things to do is too big for us.

[Scrabble96]

I’m not sure what a ‘PR’ is, but I’m guessing it’s a more official/systematic way of submitting problems and corresponding solutions. If you can point me towards some instructions on how to submit these correctly, I’d be more than happy to help.

For example, using the W3C CSS Validator tool (which I’m sure you will agree is a useful tool) shows that the first 30 lines of code at [https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.css] (https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.css) - and therefore carried through to the minified version - have parse errors. Basically, the double hyphen in front of each item is not valid. Change it to just one hyphen and it’s fine. How would I submit that?

[XhmikosR]

Re CSS validator, unfortunately the tool is wrong, i.e. doesn't support the custom variables.

Everything else was fixed after I bugged @sideshowbarker some time ago.

Like I said, the tools don't mean anything by themselves.

[sideshowbarker]

For example, using the W3C CSS Validator tool (which I’m sure you will agree is a useful tool) shows that the first 30 lines of code at [https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.css] (https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.css) - and therefore carried through to the minified version - have parse errors. Basically, the double hyphen in front of each item is not valid.

Re CSS validator, unfortunately the tool is wrong, i.e. doesn't support the custom variables.

Yeah, try checking it instead with https://validator.w3.org/nu/ (which does support CSS variables):

https://validator.w3.org/nu/?doc=https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.css

…that reports only one error:

Error: size: Property size doesn't exist

…which is probably also a false positive

[Scrabble96]

Ok. Thank you, both. I'll make a note of the 'new' validator. (I wonder why they don't 301 redirect the old one to the new one).

There are quite a few -webkit prefixes which are no longer needed - e.g. -webkit-text-decoration. Or are they there to support those who still insist on using ancient browsers?

[XhmikosR]

Everything that needs to be there should be there already since we use autoprefixer to handle this task.

[Scrabble96]

Going back to my original post, there are duplicate selectors, e.g.

line 4238
.navbar-expand > .container,
.navbar-expand > .container-fluid {
padding-right: 0;
padding-left: 0;
}

line 4258
.navbar-expand > .container,
.navbar-expand > .container-fluid {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}

which could be combined.

[XhmikosR]

PR welcome like I suggested before.

[Scrabble96]

Will do. So a PR is a Pull Request? I've never done one before so no doubt I would get told off for choosing the wrong fork, spoon, whatever. Please point me in the right direction and I'll submit all the duplicates.

[XhmikosR]

PR = pull request, yes. You will need to figure out some things for yourself. If you have issues please point them out preferably with a PR to improve any docs.

[Scrabble96]

Hi.

I’ve created a repository, edited the bootstrap.css file, opened a pull request, but it’s in my fork, i.e. Scrabble96 / bootstrap. Should I have opened the PR in twbs / bootstrap or are they automatically linked? I can’t see it in twbs/bootstrap.

Thank you.

From: XhmikosR [mailto:[email protected]]
Sent: 14 December 2018 00:42
To: twbs/bootstrap
Cc: Scrabble96; Author
Subject: Re: [twbs/bootstrap] Duplicate css selectors in 4.1.3/css/bootstrap.min.css (#27821)

PR = pull request, yes. You will need to figure out some things for yourself. If you have issues please point them out preferably with a PR to improve any docs.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub https://github.com/twbs/bootstrap/issues/27821#issuecomment-447172619 , or mute the thread https://github.com/notifications/unsubscribe-auth/AjRiZuPJZ1tM_Fl8fDhsMy4myo5mqGLNks5u4vO9gaJpZM4ZPaqR . https://github.com/notifications/beacon/AjRiZnJto8hQ1yaEoqlVzy1OE6zw2Y6rks5u4vO9gaJpZM4ZPaqR.gif

[wolfy1339]

You don't want to edit the css files manually. You will want to edit the relevant source scss files instead