Site jacked up in web browsers

[S7ylin]

So I post here pretty frequently, sorry, and I usually throw my codes into code pen and see what comes out of it there. It wasn’t until just now that I opened my files with a web browser, and unfortunately it looks all jacked up. Things aren’t where they are suppose to be, specifically the sidebar, and when I scroll the colors mesh and become distorted to a bunch of random colored pixels. Haven’t had this problem so I’m not too sure what to do about it, but you can see what I’m talking about if you use the codes I have at this code pen
http://codepen.io/S7ylin/pen/BGIzp
and open it in a web browser. First I thought it was just Safari, but I tried IE, firefox, and Chrome and it’s the same for each one.
Really appreciate the help guys.

[S7ylin]

This is what it looks like in safari
http://imgur.com/sF4QpSE

[S7ylin]

ok

[Alen]

When using inline-block you need to clear all the white space between your elementsmain-col and sidebar.

This is BAD!!!

<div id="main-col">...</div>

<div id="sidebar">...</div>

This is GOOD!!!

<div id="main-col">...</div><div id="sidebar">...</div>

[S7ylin]

Thanks for the note, I was unaware.

[S7ylin]

And I’m guessing that the fb like box won’t show up unless the site is online instead of localhoast, correct?
I repasted it and took everyone’s advice and it is running fine, really appreciate the help guys.

[Author]

Posts