Font center of select labels

When I wrote JSP today, I found that a selection column in the <s: Select> Option box is used, and the font is not vertically centered, I found a problem about the vertical center display content of the select tag on the network, and found that many people encountered the same problem. Some people simply called the select tag the most disgusting tag, because almost no CSS style can be applied to it. Let's see how disgusting the SELECT statement is.

　　

   <style type="text/css">              select{           height:50px;           width:100px;           font-size:15px;       }   </style>    select>        <option value="volvo">Volvo</option>        <option value="saab">Saab</option>        <option value="opel">Opel</option>        <option value="audi">Audi</option>    </select>

To highlight that the select tag cannot be vertically centered, we intentionally set the select height to 50px, which is much greater than the font. The results are as follows:

Try to add the CSS style: vertical-align: middle; In option, the effect is not the same, as shown below:

<style type="text/css">       select{           height:50px;           width:100px;           font-size:15px;       }       select option{           vertical-align: middle;       }   </style>    <select>        <option value="volvo">Volvo</option>        <option value="saab">Saab</option>        <option value="opel">Opel</option>        <option value="audi">Audi</option>    </select>

In fact, all the tag libraries that use the select label, such as the <s: Select> of struts2, have the same problem. However, if it is in IE (11 here) and chrome (35.0.1916.153 here), the Select tag can be automatically vertically centered.

The display of Select Content in HTML5 has not been improved. If you want to use the selection box and look good, you can use the DIV + input label to simulate the select label function. For details, refer to extjs ComboBox:

 

You can see through firedebug that extjs shows the select effect and does not encounter the select label, so the display effect is very elegant.