Background-attachment: fixed image fluid to a certain point

My background image is fluid only to a certain point. When resizing the browser it starts to shrink

background-image : url("http://...");
background-repeat:no-repeat;
background-size: cover;
background-attachment: fixed;
background-position: center right;
height: 400vh;

You can see what I'm talking about here

Solution

The height: 400vh is your problem I believe if you can put this code on the html element as such

 html { 
  background: url("http://...") no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
 }

and delete the class "me" from your code this should be fluid for you. The problem is you are setting the background on "me" which doesn't contain any content and its height is only being set by you as "400vh" so once it hits that height it stops being fluid so by setting it on the html it will wrap the whole page and be fluid

Edit

if you desire to have your image not clipped in anyway and show 100% of it on every screen you can do something like this

#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto 0px;
}

turn the me class into an image instead of a div

<img class="me" src="http://24.media.tumblr.com/8760c4adc4f8c4b7cafa14c5cf6cc55c/tumblr_n2kq1hnFSF1tswi9io1_1280.jpg"></img>

and the css like this

.me { 
  width: 100%;
 }

this will give you a wrap that will cover 100% of the persons screen size and will allow you to set the image to be in the background and will not clip the image as you resize. If you are trying to make this website responsive I wouldn't suggest using absolute references in your css as this may lead to some items out of place on different screen sizes. You may want to check out www.getbootstrap.com since they provide an excellent library for a responsive grid.