css - How to align text vertically within bootstrap progress bar -


i modified height of bootstrap progress bar can see in following link: http://jsfiddle.net/8xf2j/31/

what i'm trying make text centered vertically. tried add property:

vertical-align:middle 

but not works... want increase font size of text containing progress bar adding:

font-size:30px; 

as you'll see in de fiddle doesn't works too. idea or advice appreciated.

one way achieve vertical alignment of single line of text make line-height match desired height.

example: http://jsfiddle.net/vqs2k/

.progress {     height: 40px;     font-size: 30px; } .bar {     font-size: 30px;     line-height: 40px; } 

plain version (no bootstrap): http://jsfiddle.net/vqs2k/1/


Popular posts from this blog

Php - Delimiter must not be alphanumeric or backslash -

c# - How to change the "Applies To" field under folder auditing options programatically (.NET) -

c++ - Ambiguity when using boost::assign::list_of to construct a std::vector -