CODEWITHSUNDEEP
cssasp.net-mvcasp.net-mvc-4
Karan
Karan

Reputation: 3338

MVC TextBoxFor Placeholder text alignment

I have this control in the MVC view page as 

  @Html.TextBoxFor(m => m.TemplateGroupName, 
  new { tabindex = "1",  placeholder = "Enter Template Group Name" })

Generated Control markup:- 

    <input class="input-validation-error" data-val="true" 
      data-val-required="The TemplateGroupName field is required."       
id="TemplateGroupName" name="TemplateGroupName" 
placeholder="Enter Template Group Name" 
tabindex="1" value="" type="text">

I am trying to center-align the placeholder text. Please suggest.

Upvotes: 1

Views: 2159

Answers (2)

Abi
Abi

Reputation: 79

For Aligning the content within the textbox in MVC we use 'Text-Align' Property.

@Html.TextBox("Name",new{placeholder="Your Text",style="Text-align:Center"});

Upvotes: 1

Ankit K
Ankit K

Reputation: 1326

Place following css on your page. It will center align placeholder in all browsers: 

::-webkit-input-placeholder {
   text-align: center;
}

:-moz-placeholder { /* Firefox 18- */
   text-align: center;  
}

::-moz-placeholder {  /* Firefox 19+ */
   text-align: center;  
}

:-ms-input-placeholder {  
   text-align: center; 
}

OR

you can implement the styling to a particular textbox like this:

@Html.TextBoxFor(m => m.TemplateGroupName, 
  new { tabindex = "1",  placeholder = "Enter Template Group Name", Style = "text-align:center;" })

Upvotes: 4

Related Questions