Ramkumar
Ramkumar

Reputation: 456

How to align select tag option container in HTML?

I want to align the option container match with the select tag. I don't use any margin (or) padding as of now but still my dropdown options is shown as below:

enter image description here

Option container is aligned bit left.

Upvotes: 0

Views: 1438

Answers (3)

Alien
Alien

Reputation: 3668

there is a simple way to solve this question:

<select>
    <option value="">--Select Category</option>
    <option value="">&nbsp;&nbsp; Option One</option>
    <option value="">&nbsp;&nbsp; Option Two</option>
    <option value="">&nbsp;&nbsp; Option Three</option>
</select>

demo ---->http://jsfiddle.net/Junkie/tKc4d/6/

Upvotes: 1

qtgye
qtgye

Reputation: 3610

Try this:

option:not(:first-child) { padding-left: 1em;}

fiddle

Upvotes: 1

Alex Char
Alex Char

Reputation: 33218

Isn't possible to use text-align for options. You can try to use instead text-indent like this:

select{
    text-indent:90px;
}

fiddle

Upvotes: 0

Related Questions