title: Why isn't my div being applied inline?
body: <p>I've tried making my div's on the same line. I've tried <code>floating</code>, changing the <code>display</code> property and messing with the <code>width</code> and <code>height</code> properties. But nothing is working:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/* font */
  @import url(https://fonts.googleapis.com/css?family=Open+Sans);
  /* end of font */
  
  /* clear settings */
  body {
    padding: 0;
    margin: 0;
    background: white;
  }
  /* end of clear settings */
  
  /* nav */
    #nav {
      width: 1600px;
      height: 50px;
      background: #009ACD;
    }
  /* end of nav */
  
  /* info nav */
    #primary_nav_wrap
  {
   width: 1600px;
    height: 50px;
    background: #1F1F1F;
  }
  
  #primary_nav_wrap ul
  {
   list-style:none;
   position:relative;
   float:left;
   margin:0;
   padding:0;
   left: 3%;
   top: 5px;
  }
  
  #primary_nav_wrap ul a
  {
   display:block;
   text-decoration:none;
   font-size:15px;
   padding: 10px 15px 10px 15px;
   font-family: 'Open Sans', sans-serif;
   color: white;
  }
  
  #primary_nav_wrap ul a:hover {
    background: white;
  }
  
  #primary_nav_wrap ul li
  {
   position:relative;
   float:left;
   margin:0;
   padding:0;
  }
  
  #primary_nav_wrap ul li:hover a {
    color: black;
    background: white;
  }
  
  #primary_nav_wrap ul li a:hover {
    background: white;
  }
  
  #primary_nav_wrap ul ul li a:hover {
    background: #F4F4F4;
  }
  
  #primary_nav_wrap ul ul
  {
   display:none;
   position:absolute;
   top:100%;
   left:0;
   background:#fff;
   padding:0;
   margin-top: 0.2px;
   border: 1px solid #ccc;
   border-top: none;
   z-index: 50;
  }
  
  #primary_nav_wrap ul ul li
  {
   float:none;
   width:200px;
   position: relative;
   left: 0px;
  }
  
  #primary_nav_wrap ul ul a
  {
   line-height:120%;
   padding:7.5px 9px;
  }
  
  #primary_nav_wrap ul ul ul
  {
   top:0;
   left:100%
  }
  
  #primary_nav_wrap ul li:hover &gt; ul
  {
   display:block
  }
  /* end of info nav */
  
  /* course div */
    #course_div {
      width: 1200px;
      position: relative;
      left: 180px;
      top: 30px;
      padding: 10px;
    }
    
    #course_img {
      width: 216px;
      height: 121.5px;
    }
    
    #course_info {
      border: 1px solid #ccc;
      width: 204px;
      padding: 5px;
      position: relative;
      top: -4px;
      font-family: 'Open Sans', sans-serif;
      font-size: 16px;
    }
    
     #course_div a {
      text-decoration: none;
      color: black;
      width: 204px;
    }
    
    #course_main {
      width: 216px;
      
    }
    
  /* end of course div */</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt; Hacked Genius &lt;/title&gt;
      &lt;link rel='stylesheet' href='main.css'&gt;
      &lt;script src='main.js'&gt;&lt;/script&gt;
    &lt;/head&gt;
    
    &lt;body&gt;
      &lt;!-- nav --&gt;
        &lt;div id='nav'&gt;
          
        &lt;/div&gt;
      &lt;!-- end of nav --&gt;
      
      &lt;!-- info nav --&gt;
  &lt;nav id="primary_nav_wrap"&gt;
  &lt;ul&gt;
    &lt;li&gt;&lt;a href="#"&gt;Development&lt;/a&gt;
      &lt;ul&gt;
        &lt;li&gt;&lt;a href="#"&gt;Web Development&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Mobile Apps&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Programming Languages&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Game Development&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Databases&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Software Testing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Software Engineering&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Development Tools&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;E-Commerce&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Business&lt;/a&gt;
      &lt;ul&gt;
        &lt;li&gt;&lt;a href="#"&gt;Finance&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Entrepreneurship&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Communications&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Management&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Sales&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Strategy&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Operations&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Project Management&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Business Law&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Data and Anylytics&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Home Business&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Human Resources&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Industry&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Media&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Real Estate&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;IT &amp; Software&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;IT Certification&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Network &amp; Security&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Hardware&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Operating Systems&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;li&gt;&lt;a href="#"&gt;Office Productivity&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Microsoft&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Apple&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Google&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;SAP&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Intuit&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Salesforce&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Oracle&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;li&gt;&lt;a href="#"&gt;Personal Development&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Personal Transformation&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Productivity&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Leadership&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Personal Finance&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Career Development&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Parenting &amp; Relationships&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Happiness&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Religion &amp; Spirituality&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Personal Brand Building&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Creativity&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Influence&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Self Esteem&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Stress Management&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Memory and Study Skills&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Motivation&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Design&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Web Design&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Graphic Design&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Design Tools&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;User Experience&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Game Design&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Design Thinking&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;3D &amp; Animation&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Fashion&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Architectural Design&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Interior Design&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Marketing&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Digital Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Search Engine Optimization&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Social Media Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Branding&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Marketing Fundamentals&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Analystics &amp; Automation&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Public Relations&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Advertising&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Video &amp; Mobile Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Content Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Non-Digital Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Growth Hacking&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Affiliate Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Product Marketing&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Lifestyle&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Life Hacks&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Arts &amp; Crafts&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Food &amp; Beverage&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Beauty &amp; Makeup&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Travel&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Gaming&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Home Improvement&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Pet Care &amp; Training&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Photography&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Digital Photography&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Photography Fundamentals&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Portraits&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Landscape&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Black &amp; White&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Photography Tools&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Mobile Photography&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Travel Photography&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Commercial Photography&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Wedding Photography&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Video Design&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Health &amp; Fitness&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Fitness&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;General Health&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Sports&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Nutrition&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Yoga&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Mental Health&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Dieting&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Self Defense&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Safety &amp; First Aid&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Dance&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Meditation&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Language&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;English&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Spanish&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;German&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;French&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Japanese&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Portuguese&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Chinese&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Russian&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Latin&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Arabic&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Hebrew&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Italian&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Music&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Instruments&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Production&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Music Fundamentals&lt;/a&gt;
        &lt;li&gt;&lt;a href="#"&gt;Vocal&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Music Techniques&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Music Software&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Other&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;li&gt;&lt;a href="#"&gt;Academics&lt;/a&gt;
      &lt;ul&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Social Science&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Math &amp; Science&lt;/a&gt;&lt;/li&gt;
        &lt;li class="dir"&gt;&lt;a href="#"&gt;Humanities&lt;/a&gt;
  &lt;/ul&gt;
  
  
  &lt;/ul&gt;
  &lt;/ul&gt;
  &lt;/ul&gt;
  &lt;/ul&gt;
  &lt;/ul&gt;
  &lt;/ul&gt;
  
  &lt;/ul&gt;
  
  &lt;/ul&gt;
  &lt;/nav&gt;
      &lt;!-- end of info nav --&gt;
      
      &lt;div id='course_div'&gt;
        
     &lt;a href='#'&gt; &lt;div id='course_main'&gt;
          &lt;img src='https://udemy-images.udemy.com/course/480x270/236832_f09d_19.jpg' id='course_img'&gt;
          
           &lt;div id='course_info'&gt;
            Ki
          &lt;/div&gt; &lt;/a&gt;
          
           &lt;a href='#'&gt; &lt;div id='course_main'&gt;
          &lt;img src='https://udemy-images.udemy.com/course/480x270/236832_f09d_19.jpg' id='course_img'&gt;
          
           &lt;div id='course_info'&gt;
            Two
          &lt;/div&gt; &lt;/a&gt;
          
        &lt;/div&gt;
        
      &lt;/div&gt;
      
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>