I'm wondering if anyone has any insight into this strange problem when running a very simple website in chrome on windows. I'm essentially stacking 5 divs on top of each other that I resize if the window resizes.
<body>
<div id="home"></div>
<div id="about"></div>
<div id="experience"></div>
<div id="hobbies"></div>
<div id="contact"></div>
</body>
Here is the code via media queries
Here is the code via javascript/jquery
Both versions should do identical things, I was simply trying to isolate the problem. On my Mac, everything seems to work fine bar some strange things that happen if I resize very rapidly. It works 100% on Firefox and Safari.
On my Windows PC, this happens seemingly at random on Chrome (IE works fine...):
When I'm resizing my site, this will randomly take over the screen, and if I don't resize or refresh, will stay as I scroll the page. If I resize or refresh it will disappear and be replaced with the properly colored divs. Also, on a tablet windows PC, chrome seems to lag like crazy with the media queries when resizing, though I'm not sure if that's related or not.
Any help would be greatly appreciated! It's bugging me like crazy.
EDIT: Here's a link to a previous question I asked that resolved one related issue.