首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在联系人表单旁边对齐按钮

在联系人表单旁边对齐按钮
EN

Stack Overflow用户
提问于 2016-05-28 07:57:48
回答 1查看 34关注 0票数 0

所以我试着在联系人表格旁边对齐三个按钮。我把这两个都放在一行类中,并把表单和按钮放在自己的头-lg-6中。但是,这些按钮不对齐在联系人表单旁边。不管我做什么,它们都会掉在下面。

我试着添加

代码语言:javascript
复制
float: right; 

它的工作方式是将它们对齐到右边,但仍然在形式的下面。我很感谢你的帮助,谢谢!

这是链接到页面,联系表单+底部的按钮。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-05-28 08:05:41

将它们添加到同一行中:

代码语言:javascript
复制
  <div class="container-fluid">
<div class="row">
<div class="col-lg-6">
  <div class="container shapef">
    <form class="well form-horizontal" action=" " method="post" id="contact_form">
      <fieldset>

        <br>

        <div class="form-group">
          <label class="col-md-2 control-label">Name</label>
          <div class="col-md-9 inputGroupContainer">
            <div class="input-group">
              <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
              <input name="name" placeholder="Name" class="form-control" type="text">
            </div>
          </div>
        </div>

        <div class="form-group">
          <label class="col-md-2 control-label">Email</label>
          <div class="col-md-9 inputGroupContainer">
            <div class="input-group">
              <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
              <input name="email" placeholder="Email Address" class="form-control" type="text">
            </div>
          </div>
        </div>


        <div class="form-group">
          <label class="col-md-2 control-label">Message</label>
          <div class="col-md-9 inputGroupContainer">
            <div class="input-group">
              <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
              <textarea class="form-control" name="comment" placeholder="Message"></textarea>
            </div>
          </div>
        </div>

        <div class="alert alert-success" role="alert" id="success_message">Success <i class="glyphicon glyphicon-thumbs-up"></i> Thanks for contacting me, I'll get back to you shortly.</div>

        <!-- Button -->
        <div class="form-group">
          <label class="col-md-2 control-label"></label>
          <div class="col-md-4">
            <button type="submit" class="btn btn-warning">Send <span class="glyphicon glyphicon-send"></span></button>
          </div>
        </div>

      </fieldset>
    </form>
  </div>
</div>
<div class="col-lg-6 kopcheta">
                <ul class="list-inline banner-social-buttons">

                        <li>
                            <a href="https://github.com/l-emi" target="_blank" class="btn btn-default btn-lg btn-warning"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
                        </li>
                        <li>
                            <a href="https://uk.linkedin.com/in/lidiya-nikolova-b979348b" target="_blank" class="btn btn-default btn-lg btn-warning"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
                        </li>
                        <li>
                            <a href="https://www.freecodecamp.com/l-emi" target="_blank" class="btn btn-default btn-lg btn-warning"><i class="fa fa-fire fa-fw"></i> <span class="network-name">FreeCodeCamp</span></a>
                        </li>

                </ul>
            </div>
<!-- /.container -->
</div>
</div>
</div>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37496664

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档