Bootstrap: CSS Drop Caps - Add a "dropcaps" class

Created on 1 Jan 2017  路  5Comments  路  Source: twbs/bootstrap

Kinda basic but should be added to bootstrap core
Demo => http://codepen.io/IamManchanda/pen/bgbraw

Here's the SCSS I used for the above example

.dropcaps:first-of-type:first-letter {
  height: 0.7em;
  margin: 0.08em 0 -0.05em 0;
  padding: 0 0.065em 0 0;
  font-size: 5em;
  line-height: 0.85em;
  float: left;
}

That tiny negative margin is for the next line (4th line in this case) to start from scratch after dropcap has finished its variable height!

css feature v4

Most helpful comment

I don't see this being a hugely request feature, and despite it's initial impressions of not much code to add, it's still something we've added to the project. Everything added dilutes the rest in some way and I'll continue to be rather particular in what we add here to keep things lean enough.

All 5 comments

Neat!

thanks @cquanu .... Yup neat like your theme

Thanks, but we'll pass on this for now. <3

What happened @mdo .... I thought this would have been nice feature to add ?
Simple dropcaps .... Not much code to add ?

I don't see this being a hugely request feature, and despite it's initial impressions of not much code to add, it's still something we've added to the project. Everything added dilutes the rest in some way and I'll continue to be rather particular in what we add here to keep things lean enough.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

devdelimited picture devdelimited  路  3Comments

knownasilya picture knownasilya  路  3Comments

steve-32a picture steve-32a  路  3Comments

IamManchanda picture IamManchanda  路  3Comments

MrCsabaToth picture MrCsabaToth  路  3Comments