CODEWITHSUNDEEP
css
David Genger
David Genger

Reputation: 915

Font Weight bold on select element

I am having problems with font-weight on a select element. when applying font-weight: bold; the last letter gets cut off, because its bumping in to the right side. I searched and did not find any answer, even though it sounds like a problem that a lot of people have experienced, thanks.

select{
    font-weight: bold;
}
<select>
    <option>Option</option>
</select>

Here is a jsfiddle http://jsfiddle.net/pdg6805/3v58gsqm/

Upvotes: 1

Views: 1228

Answers (2)

ameerosein
ameerosein

Reputation: 563

sometimes in some cases applying bold to font-weight will change the width of that element and being wider causes cutting off, so you could reserve some more space for it by setting width in select.

Upvotes: 1

WitVault
WitVault

Reputation: 24130

One simplest way is to add width to select. 

select{
    font-weight: bold;
    width:150px;
}
    <select>
     <option>Option &nbsp;</option>
   </select>

Or 

select {
   font-weight:bold;
  }
    <select>
     <option>Option &nbsp;</option>
   </select>

Upvotes: 1

Related Questions