align Mvc3 Drop down list values center

0
votes

I have this my view 

 @Html.DropDownListFor(model => model.StateCode, Model.StateList, "Select", new { @style = "text-align : center" })

All the state abbreviations in the Drop Down List are aligning left. What should do to align them center?

@Jason Evans I don't think it is browser specific because I used this in the same view and it is aligning center. @Html.TextBoxFor(model => model.City, new { @class = "", @style = "width:140px;text-align:center"})

1
htmlasp.net-mvc-3drop-down-menucenteralignment
Sorry, I meant the ability to centre the text of a select list could be browser specific. - Jason Evans
The thing is, you shouldn't be able to do this, because it breaks the usability of the <select> element. Users can't easily scan things that aren't left-aligned (or right-aligned in RTL languages). So while I know in FF you can do it doesn't mean you should do it. - Greg Bair
@Jason Evans Sorry, I understood your comment in a different way. In FF it is working but not in IE. Is there a way that makes it work in IE too? - TJK
@greg - Very, very good point! I didn't think of that myself. Having space on the left side of the text in the <option> part of the select list could mess things up for screen readers. - Jason Evans

1 Answers

0
votes

It looks like this functionality may be browser specific:

how to make sure select option text align in the center in IE?