html - 如何将表单中的 div 与输入标签对齐

Question

我有一个 div，我在其中使用输入标签输入，我想用它显示另一个 div 中的一些信息，即 @{{globalSession.OrganizationDomain}}

例如像这样显示它 -> [----------------] @domain78.com 我怎样才能从它的位置移动输入 div？

<div class="form-group" ng-class="{ 'has-error': submitted && createmanagerform.username.$error.required || createmanagerform.username.$error.pattern }">
                    <label class="col-md-4 control-label" for="username">Username*</label>
                    <div class="col-md-4">
                      <input id="username" name="username" type="text"  placeholder="Username" minlength="5" maxlength="50" class="form-control input-md" ng-model="theManager.Username"  ng-pattern="regex.Username" required  autofocus> 
                        <div class="col-md-4">  @{{globalSession.OrganizationDomain}}</div>
                        <span ng-show="createmanagerform.username.$error.pattern && createmanagerform.username.$invalid " class="help-block">Username must be small letters and at least 5 characters. Only full stops, hyphens and underscores are allowed.</span>
                    </div>
                </div>   


 <!-- Email input-->
                <div class="form-group" ng-class="{ 'has-error': submitted && createmanagerform.email.$error.required || createmanagerform.email.$error.pattern }">
                    <label class="col-md-4 control-label" for="email">Email*</label>
                    <div class="col-md-4">
                        <input id="email" name="email" type="email" placeholder="john@example.com" class="form-control input-md" ng-model="theManager.Email" ng-pattern="regex.Email"  required  autofocus >
                        <span ng-show="submitted && createmanagerform.email.$error.required" class="help-block">Email can not be empty</span>
                        <span ng-show="createmanagerform.email.$error.pattern && createmanagerform.email.$invalid " class="help-block">Please enter a valid email address.</span>
                    </div>
                </div>  

Answer 1

试试 Bootstrap 插件组

<label class="col-md-4 control-label" for="username">Username*</label>
<div class="col-md-4">
    <div class="input-group">
        <input class="form-control" placeholder="User Name" />
        <div class="input-group-addon">@domain78.com</div>
    </div>
</div>