AbuYazan AbuYazan - 1 year ago 83
Javascript Question

How to reduce the label font in bootstrap?

I'm using bootstrap to design the form, however I have an issue with the label font (big and bold)
How I can reduce the font and remove the bold? see fiddle

<form class="form-horizontal">
<div class="form-group">
<label for="sel" class="col-md-2 control-label">Selecte:</label>
<div class="col-md-10">
<select id="sel" class="form-control input-sm"></select>

Answer Source

Try the following code (create a CSS for this):

@media (max-width: @screen-xs) {
    .form-group label{font-size: 10px;}

@media (max-width: @screen-sm) {
    .form-group label{font-size: 14px;}

.form-group label{
    font-size: 1.4em;

Specify the font size that you need. This would alter the font size with window resize. There is no bootstrap class to accomplish this yet to my knowledge.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download