Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

unable to execute the media object in bootstrap

Hi,

Please look into the code as I am unable to place the img

<ul class="list-group"> <li class="list-group-item"> <div class="media"> <img class="align-self-start mr-3" src="img/dilip.jpg" alt="Dilip"> <div class="media"> <div class="d-flex justify-content-between"> <h5 class="mb-0">Keynote: Internet of Things</h5> <span class="badge badge-pill badge-info p-2">9:00am</span> </div> <p class="mb-1">NodeStradamus</p> </div> </div> </li> <li class="list-group-item"> <div class="d-flex justify-content-between"> <h5 class="mb-1">React Basics</h5> <span class="badge badge-pill badge-info p-2">10:00am</span> </div> <p class="mb-1">Vivianne McVue</p> </li> <li class="list-group-item"> <div class="d-flex justify-content-between"> <h5 class="mb-1">Hey, Mongo!</h5> <span class="badge badge-pill badge-info p-2">11:00am</span> </div> <p class="mb-1">Jay Query</p> </li> <li class="list-group-item list-group-item-success"> <div class="d-flex justify-content-between"> <h5 class="mb-1">Lunch</h5> <span class="badge badge-pill badge-info p-2">12:00pm</span> </div> <p class="mb-1">Free pizza for everyone!</p> </li> <li class="list-group-item"> <div class="d-flex justify-content-between"> <h5 class="mb-1">Introducing ES2015</h5> <span class="badge badge-pill badge-info p-2">1:00pm</span> </div> <p class="mb-1">Ecma Scriptnstuff</p> </li> <li class="list-group-item"> <div class="d-flex justify-content-between"> <h5 class="mb-1">Getting Started With Redux</h5> <span class="badge badge-pill badge-info p-2">2:00pm</span> </div> <p class="mb-1">Robbie Redux</p> </li> <li class="list-group-item"> <div class="d-flex justify-content-between"> <h5 class="mb-1">What's Babel?</h5> <span class="badge badge-pill badge-info p-2">3:00pm</span> </div> <p class="mb-1">Json Babel</p> </li>
</ul>

Hello! Can you add three of these: ` before and after the code? It will format your code automatically so its a little easier to read. so instead of: <html><p>Some text</p></html>.

It looks like

<html><p>Some text</p></html>

1 Answer

Started off by reformating your code to a code-block. Will have a look at it

<ul class="list-group"> 
  <li class="list-group-item"> 
    <div class="media"> 
      <img class="align-self-start mr-3" src="img/dilip.jpg" alt="Dilip"> 
      <div class="media"> <div class="d-flex justify-content-between"> 
        <h5 class="mb-0">Keynote: Internet of Things</h5> 
        <span class="badge badge-pill badge-info p-2">9:00am</span> 
      </div> <p class="mb-1">NodeStradamus</p> 
    </div> 
  </div> 
</li> 
<li class="list-group-item">
   <div class="d-flex justify-content-between"> 
     <h5 class="mb-1">React Basics</h5> 
     <span class="badge badge-pill badge-info p-2">10:00am</span> 
   </div> <p class="mb-1">Vivianne McVue</p> 
 </li> 
 <li class="list-group-item"> 
   <div class="d-flex justify-content-between"> 
     <h5 class="mb-1">Hey, Mongo!</h5> 
     <span class="badge badge-pill badge-info p-2">11:00am</span> 
   </div> 
   <p class="mb-1">Jay Query</p> 
 </li> 
 <li class="list-group-item list-group-item-success"> 
   <div class="d-flex justify-content-between"> 
     <h5 class="mb-1">Lunch</h5>
     <span class="badge badge-pill badge-info p-2">12:00pm</span>
   </div> <p class="mb-1">Free pizza for everyone!</p>
 </li> 
 <li class="list-group-item"> 
   <div class="d-flex justify-content-between"> 
     <h5 class="mb-1">Introducing ES2015</h5> 
     <span class="badge badge-pill badge-info p-2">1:00pm</span> 
   </div> 
   <p class="mb-1">Ecma Scriptnstuff</p> 
 </li> 
 <li class="list-group-item"> 
   <div class="d-flex justify-content-between"> 
     <h5 class="mb-1">Getting Started With Redux</h5> 
     <span class="badge badge-pill badge-info p-2">2:00pm</span> 
   </div> <p class="mb-1">Robbie Redux</p> 
 </li> 
 <li class="list-group-item">
    <div class="d-flex justify-content-between">
       <h5 class="mb-1">What's Babel?</h5>
        <span class="badge badge-pill badge-info p-2">3:00pm</span>
       </div> <p class="mb-1">Json Babel</p> 
     </li>
</ul>

Might it be that instead of having your src like src="img/dilip.js" it should be src="./img/dilip.js"