title: How to add multiple drop down select tags side by side
body: <p>I have implemented 2 select tags with values but when i executed they are not showing side by side as shown in the result below.</p>
  
  <p>But i want to implement those select tags side by side like should i use <code>margin-top:20px;</code>  or any other way to do this 
  <a href="https://i.stack.imgur.com/tJ51f.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tJ51f.png" alt="This"></a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!doctype html&gt;
  
  
      
      &lt;style&gt;html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }&lt;/style&gt;
      
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.common-material.min.css" /&gt;
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.material.min.css" /&gt;
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.default.mobile.min.css" /&gt;
  
      &lt;script src="//kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="//kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"&gt;&lt;/script&gt;
  
  
  
          &lt;div id="example" role="application"&gt;
        &lt;div id="select" class="demo-section k-content"&gt;
             
              &lt;h4 style="margin-top: 2em;"&gt;select&lt;/h4&gt;
              &lt;select id="size" placeholder="Select size..." style="width: 300px;" &gt;
                &lt;option /&gt;easy 
                &lt;option /&gt;to
                &lt;option /&gt;code
                &lt;option /&gt;way
                &lt;option /&gt;always
                &lt;option /&gt;easily
              &lt;/select&gt;
       
              
          &lt;/div&gt;
          
  &lt;div id="example1" role="application"&gt;
        &lt;div id="select" class="demo-section k-content"&gt;
             
              &lt;h4 style="margin-top: 2em;"&gt;select&lt;/h4&gt;
              &lt;select id="size1" placeholder="Select size..." style="width: 300px;" &gt;
                &lt;option /&gt;C++
                &lt;option /&gt;java
                &lt;option /&gt;jquery
                &lt;option /&gt;html
                &lt;option /&gt;css
                &lt;option /&gt;unix
              &lt;/select&gt;
       
              
          &lt;/div&gt;
  
  
  
  
  
  
              &lt;script&gt;
                  $(document).ready(function() {
                      // create ComboBox from input HTML element
                      
                      // create ComboBox from select HTML element
                      $("#size").kendoComboBox();
   $("#size1").kendoComboBox();
  
  
                     
       var select = $("#size").data("kendoComboBox");
  var select = $("#size1").data("kendoComboBox");
  
  
  
      
                  });
              &lt;/script&gt;
          &lt;/div&gt;
  
  
  
  
  &lt;/!doctype&gt;</code></pre>
  </div>
  </div>
  </p>