Center select text

Asked

Viewed 3,006 times

1

How to center the text of a select? I removed the arrows down with the 

-moz-appearance: none;
-webkit-appearance: none;

But the text is on the side and does not center. It looks like this:

--------------------------
|TEXTO DO SELECT         |
--------------------------

I’d like to keep it that way:

--------------------------
|    TEXTO DO SELECT     |
--------------------------

I have tried with text-align, with margin, etc and it does not stay. Why?

EDIT

I even tried with padding-left, of the guilheme response, but changing the resolution, of the poblema. Would have another solution?

css
  • 3

    Possible duplicate of Select styling via CSS

  • Actually no, he goes to the side, but changing the resolution, the problem.

1 answer

2


Without the help of external plugins, you can centralize only the text inside the box and not the dropdown ones, putting the following CSS in the select:

text-align: center; /* para firefox */
text-align-last: center; /* para chrome */

  • It worked! Know if Safari will centralize?

  • @Lucascarvalho Probably not. From what I understand is not yet something 100% possible without plugin assistance.

  • Got it, thanks, Leon!

Browser other questions tagged css

You are not signed in. Login or sign up in order to post.