Elements Move When Browser Is Resized

Every time I move the browser the elements move, I would like it to stay in same position. Does anybody have a solution? Thanks in advance for your help. The JSfidle is here: http:

Solution 1:

Give your wrapper a min-width, and declare a max-width/width. You will get a horizontal scrollbar, but your 'elements' will stay in position. Your 'elements' naturally flow with the viewport size, so if you shrink the browser, the 'elements' are supposed to move with the flow. If you declare that the viewport is a certain size, then the flow will move within the new size.

Hope this helps.

P.S. - IE7/8 doesn't like min-width or max-width, so you will have to either use Modernizr, or Google for a CSS hack.