Html 两个按钮相邻，具有不同的div

我想把视图按钮放在左边，把添加按钮放在右边，但要紧挨着。这两个按钮位于不同的div中。我该怎么做

演示

看法


添加

简单的方法是添加一个

浮点：左到第一个按钮容器


.btn组{
浮动：左；
}

看法


添加
您可以将两个按钮放在同一个div中，并使用引导类“left”和“right”：





看法
添加
您可以使用引导行和列类来避免各种解决方案问题

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<div class="container">

<div class="row">
    <div class="col-xs-12 col-sm-1 col-md-1 clo-lg-1">
        <div class="btn-group" id="divNewNotificationsRole-admin">
            <button id="role-admin" type="button" class="btn btn-success dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                View</button>
            <div id="myDropdown" class="dropdown-menu">
                <li><a id="dropdown1" class="dropdown-item" href="#">1</a></li>
                <li><a id="dropdown2" class="dropdown-item" href="#">2</a></li>
            </div>
        </div> 
    </div>
    <div class="col-xs-12 col-sm-1 col-md-1 clo-lg-1">
        <div id="rolecontainer">
            <div id="addContainer">  
                <button type="button" name="add" id="add" data-toggle="modal" data-target="#add_data_Modal" class="btn btn-warning">Add</button>  
            </div>
        </div>
    </div>
</div>


看法


添加

更好的做法是将包含按钮的两个父div都用CSS表示

.div1, .div2 {
display: inline-block;
}

这样做将使它们内联。
只需将float:right添加到#rolecontainer。使用bootstrap、row和col等，您的结构是完全错误的。由于您使用的是
引导
，因此可以使用
行
列
结构。或者您可以尝试将
display:flex
CSS属性设置为两个按钮的父按钮。@。。我不是建议使用一个新的库它的奇怪的方式使用BS容器为每个按钮你应该包括引导，以看到这一点的真正效果当然，你是对的。我总是使用JSFIDLE来编辑代码片段，所以我忘了再次包含引导。谢谢