For some reason when you scale the browser window down, weird things start happening. I’m pretty sure it’s because I don’t completely understand relative positioning, because up until now I’ve been using absolute positioning. I just can’t figure out why this is happening.
If you’ll notice, the top green bar behaves the way I would like for the rest of the page to behave, where when it reaches the left side it stops and the right side gets covered up by the rest of the window, however, the rest of my content does not behave this way.
I also have a LOT of white space that shows up at the bottom. Not sure why that is either.
Also, I can’t figure out for the life of me how to get the "Showing 1-10 of 20" to be on the left side, and the "Sort by" to be on the right side and still look right. Any time I’ve made this happen, the Sort by looks like it’s trying to be on a new line.
Here’s my HTML:
Showing 1-10 of 20
And here’s my CSS:
font-family: Helvetica, Arial, Verdana, sans-serif;
background-position: center top;