Overlapping <div>'s with floats

I'm trying to make a page with two overlapping div's, one aligned to the left with the float:left attribute, and the other next to it, but overlapping by means of a negative margin.

Despite all this, I just get text as my output when I preview in browser from Dreamweaver. Problem is, it looks exactly how I want it in DW's preview pane.

Here is th开发者_如何学Pythone jsFiddle, and how it looks in Dreamweaver.

---

Try swapping positions of the #img div, and the #titlebar div; AND make sure both are set to 'float:left'.

(#img div first, then #titlebar div in the HTML)