Menu
I'm having trouble styling a select list in an html form. Basically I want it to have a font size of 12px, and a height of 30px; The problem is that the box is drawn to the right hight, but the text rendering varies in each browser. In FireFox it renders it in the top left corner. I want to vertically center the text. Anyone know of a way to do this or do I need to make something custom out of a ul?
Thanks
908
Dropdown button can be positioned in the center of the page by setting the “text-align” property of dropdown div to center. The following example contains a simple Bootstrap dropdown menu with an added class “my-menu”. The property “text-align: center” is added to the class.
To center align an unordered list, you need to use the CSS text align property. In addition to this, you also need to put the unordered list inside the div element. Now, add the style to the div class and use the text-align property with center as its value.
The only way is to drop the <select> and use an <input type="text"< and a <div> to give you the exact feel of a select list but with the ability to do everything as it will be a <li> that you have at the end.
I use this approach not to show aligned text but to use a small icon per each line. This also gives me the ability to show exactly how I want no mater what browser is used as well.
like the image below
176
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
