html - Align 2 dropdowns horizontally -


i have problem need align several dropdowns horizontally. have tried pure table tags , works suspect bad practice. here working fiddle http://jsfiddle.net/1440c8a6/5/

here html code:

<div class="container">     <div class="row">         <div class="col-xs-12 col-sm-12 col-md-12">              <div class="pull-left">                  <div class="dropdown">                     <button class="btn btn-default dropdown-toggle" type="button" id="dropdownmenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">                         dropdown                         <span class="caret"></span>                     </button>                     <ul class="dropdown-menu" aria-labelledby="dropdownmenu1">                         <li><a href="#">action</a></li>                         <li><a href="#">another action</a></li>                         <li><a href="#">something else here</a></li>                         <li><a href="#">separated link</a></li>                     </ul>                 </div>                  <div class="dropdown">                     <button class="btn btn-default dropdown-toggle" type="button" id="dropdownmenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">                         dropdown                         <span class="caret"></span>                     </button>                     <ul class="dropdown-menu" aria-labelledby="dropdownmenu1">                         <li><a href="#">action</a></li>                         <li><a href="#">another action</a></li>                         <li><a href="#">something else here</a></li>                         <li><a href="#">separated link</a></li>                     </ul>                  </div>             </div>              <div class="pull-right">                 <a class="btn btn-warning btn-sm" href="#" role="button">button1</a>                 <a class="btn btn-success btn-sm" href="#" role="button">button2</a>             </div>              <br />             <br />         </div>     </div> </div> 

as can see trying align dropdowns in left part buttons in right part:

enter image description here

i have tried structure not sure if or bad:

<table>   <tr>     <td>first div here</td>     <td>second div here</td>   <tr> </table> 

set display:inline-block .dropdown

css

.dropdown{     display: inline-block;    } 

demo here


Comments

Popular posts from this blog

javascript - Karma not able to start PhantomJS on Windows - Error: spawn UNKNOWN -

c# - Display ASPX Popup control in RowDeleteing Event (ASPX Gridview) -

Nuget pack csproj using nuspec -