html - 右对齐一个div

Question

我有一个联系表单，我需要将它 float 在容器的最右侧。我该怎么做？我正在尝试一切，但没有任何反应。也许我必须为列设置不同的类？这是代码:

HTML

<section id="services" class="section text-center">
        <div class="container">
            <div class="col-md-6 map">
     <!-- Responsive iFrame -->
<div class="Flexible-container">
    <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2694.5937634214993!2d8.0133807!3d47.5173021!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0000000000000000%3A0x9b610c417aa1ee02!2sZAG+Engineering!5e0!3m2!1sde!2sch!4v1443705863599"></iframe>
                </div></div>
            <div class="col-md-6 form">
                <form class="form-horizontal" role="form" method="post" action="index.php">
    <div class="form-group">      
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="Vorname, Name" value="">
        </div>
    </div>
                 <div class="form-group">
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="Firma" value="">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10">
            <input type="email" class="form-control" id="email" name="email" placeholder="E-Mail" value="">
        </div>
    </div>
                          <div class="form-group">
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="Telefon" value="">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10">
            <textarea class="form-control" rows="4" name="message" placeholder="Nachricht"></textarea>
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10 col-sm-offset-2">
            <input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10 col-sm-offset-2">
            <! Will be used to display an alert to the user>
        </div>
    </div>
</form></div>
            </div>

        <!--/.container -->
    </section>

CSS

.col-md-6.map { margin-left: -15px; }
.form-horizontal { width: 100%; float: right; }
.form-group { margin-bottom: -25px; }
.col-md-6.form { border: 1px solid red !important; }

Answer 1

添加 col-md-offset-2

<div class="form-group">
    // place col-md-offset-2 here for each input
    <div class="col-sm-10 col-md-offset-2">
        <input type="text" class="form-control" id="name" name="name" placeholder="Vorname, Name" value="">
    </div>
</div>