You can see at the bottom of the code where the community news column is, the content is wrapped in #content, and the community feed is wrapped in #communityfeed, but #communityfeed just wont go side by side with #content, and then i need to have a sidebar div to float beside the community news..
I do have clear divs in there, i’m pulling my hair out, yet im sure its something simple.
You’re clearing everything… If you want to float elements next to one another – you can’t first clear the previous float. Remove the clear: both; statements from #content and #communityfeed. Then I want you to remove the extraneous clearing divs after each of those elements and promise never to use them again – there is no reason.
You also can’t use an id more than once per page – change them classes.
I was having a play around with @Watson90 ‘s solution to the image on hover and thought it may be of value. In [my version](http://codepen.io/David_Leitch/pen/nxvrj “http://codepen.io/David_Leitch/pen/nxvrj”), you don’t need to explicitly set the image/element height in the stylesheet, which may make it easier to reuse in other scenarios. The only issue is that you need to make sure the dimensions of the base image and hover image are the same. Alas, I couldn’t get the transition working, so I just took that code out.