My elements switch back and forth when resizing the window. need some help to figure it out.

Hello Jonathon, I was having presumably the same problem, as I can't open your workspace to see your code, I'm not completely sure, but if this sounds like what was happening to you, try what I did. At certain points the 3rd element would get pushed to right, and at other times after fixing that, the 5th element was switching between the left and right sides as I resized the window. So what I did was create two new media queries at the top of my responsive.css file that look like this:

@media screen and (min-width: 390px){

#gallery li:nth-child(5n){ clear: left; } }

@media screen and (min-width: 400px){ #gallery li:nth-child(3n){ clear: left; } }

After adding this code, I no longer had any problems with any of the elements moving around while the screen size was under 480px. Although I did now have more issues once the screen got larger, which I was able to easily fix by adding a few more lines of code within the min-width: 480px media query that look like this:

#gallery li { width: 28.333333%; <<--- code you should already have if you were following along with the video }

#gallery li:nth-child(3n) { <<--- code I added to fix the new bugs clear:none; }

#gallery li:nth-child(4n) { <<--- code you should already have if you were following along with the video clear: left; } #gallery li:nth-child(5n){ <<--- code I added to fix the new bugs clear: none;

Obviously disregard the arrows and comments I made if you are going to try and copy and paste this into your workspace, I only added them to try and make it more clear where this new code goes.

Hope this helps, as it was enough to fix all the bugs I was having at all screen sizes.