Sat, 2016-03-12 00:37
Hi.
I am trying to place 2 div elements side by side. I am kind of new to css and I cannot do it even though there are some examples on google.
This my code:
<div class="search_box_area"> <form class="form-wrapper cf"> <input type="text" placeholder="Search for name/user..." required> <button type="submit">Search</button> Or: </form> </div> <!-- 2nd div --> <div class="mutual_interests_search dropdown"> <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Looking for people that: <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">Eating Well</a></li> <li><a href="#">Train Hard</a></li> <li><a href="#">Looking for motivation</a></li> </ul> </div>
The scss I am using for it is:
div { &.search_box_area { width: 60px; float: left; color: green } &.mutual_interests_search dropdown { display: block; margin-left: 62px; } }
Would really appreciate your help with this.