More display-* headings - .display-5

New .display-5 class

When creating website banners I often find myself using one of the .display-* headings from Bootstrap. They’re clean, simple and look great!

The problem I’ve encountered is I find myself slightly restricted with the current .display-* classes, more specifically with the sizing, I often find myself needing something slightly smaller than .display-4 and often tend to create my own .display-5 class, and in the very rare occasion a .display-6 class.

Could we extend this part and create an additional .display-65 class?

Something like:

.display-5 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
}

I’m sure this wouldn’t take too long to add?

This is a mock-up of what the sizing would look like:

Many Thanks!

😃

Reference: https://getbootstrap.com/docs/4.1/content/typography/

[chrisbo]

Display 1-4 are in the large, larger, extra large, largest (let’s get ridiculous) range. It would be good to have display 5-6 which would add small and medium. Would also compliment h 1-6

[andresgalante]

Yes, everything is just a few lines of CSS to add.

As a framework and a dependency is our responsibility to take care not to bloat our users code more than we already do.

That’s why in my opinion, we should think about each usecase and make sure they are common enough to belong in bootstrap and not in the authors code.

I don’t think that what you are proposing is wrong, I just wonder if it is a common enough need.

Does it make sense?