Responsive label med bild + text

Hej!

Jag har försökt att få till en kolumn som också är anpassad för mobiler och plattor.

Men mitt problem är att bilderna inte hamnar brevid varandra när jag lägger in html koden på min hemsida?

Se länk för kodning. Här visas bilderna som dem ska göra men när koden läggs in på hemsidan lägger bilderna sig under varandra.

http://jsfiddle.net/n8m8s/2/

Jag skulle vara jätte tacksam för hjälp!

---------------

<div class="leftHalf">
<p><img style="margin-right: 5px; margin-bottom: 30px; float: left;" src="http://pagead2.googlesyndication.com/simgad/12894991046126729160" border="0" width="120" height="120" alt="Soundscope" class="img_ad">I will fill up the left half of the available space most of the time, but if the screen gets too small, will take up 100% of the screen width and turn red.</p>
</div>
<div class="rightHalf">
<p><img style="margin-bottom: 30px; margin-right: 5px; float: left;" src="http://pagead2.googlesyndication.com/simgad/12894991046126729160" border="0" width="120" height="120" alt="Soundscope" class="img_ad">I will fill up the right half of the available space most of the time, but if the screen gets too small, will take up 100% of the screen width and turn blue.</p>
</div>