Change font size for Mvc TextboxFor

7.5k Views Asked by At

I am struggling to change the font size for MVC TextBoxFor?

I can change the font size when using:

input, textarea {}

But this changes all my input size's. I also tried to then add a css class to my TextboxFor:

@Html.EditorFor(model => model.UserName, new { @Class = "Mytextarea" })

css

.Mytextarea {
    font-size: 0.85em !important;
    height: 14px !important;
    color: #333 !important;
    /*font-family: inherit;*/
    width: 300px;

}

This has had no affect.

My TextBoxFor's are huge and bulky and i have no way to change them, If possible i would like to set styling to change them all at once.


Edit:

enter image description here

enter image description here

1

There are 1 best solutions below

0
On

So, you start your question off asking about TextBoxFor, but your actual code references EditorFor.

When using the EditorFor extension, you need to write a custom editor template to describe the visual components. If you don't, it will use the default template, which is where "text-box single-line" is coming from.

See this answer for a quick explanation on how to build a template that you can assign to the EditorFor helper. Or just use TextBoxFor like this.

@Html.TextBoxFor(model => model.UserName, new { @Class = "Mytextarea" })