Align Inputs in Bootstrap form with input-group-addons in ASP.Net

nid@patel
 
on Sep 23, 2019 12:37 AM
1606 Views

in below code input group is not aligned so how to fix this?

<div class="form-group">
    <div class="input-group">
        <span class="input-group-addon glyphicon glyphicon-envelope"></span>
        <asp:TextBox ID="txt_email" CssClass="form-control"  runat="server" placeholder="Email" required="required"></asp:TextBox>	
    </div>
</div>

https://ibb.co/BzfNkqJ

Download FREE API for Word, Excel and PDF in ASP.Net: Download
pandeyism
 
on Sep 23, 2019 12:56 AM
on Sep 26, 2019 04:19 AM

Hi nid@patel,

Refer below sample.

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<div class="form-group ">
    <div class="input-group">
        <div class="input-group-addon">
            <span class="glyphicon glyphicon-envelope"></span>
        </div>
        <input class="form-control" id="email" name="email" type="text" />
    </div>
</div>

Demo