Cameron Testerman
Cameron Testerman

Reputation: 31

Keep image fixed inside of div

I'm trying to create a page similar to this one http://www.seattlewebdesign.com/.

As you scroll down, the image stays fixed, however when I try to set the background as 'background-attachment: fixed' within a div tag, the background image stays fixed to the browser window and continues to remain fixed after scrolling past the div.

Any ideas on how to achieve what I'm trying to do? Any help would be very appreciated.

Upvotes: 2

Views: 17182

Answers (1)

Nick
Nick

Reputation: 3281

Encapsulate it in a div Fiddle

html {
  height: 2000px;
}
#test {
  background-image: url("http://www.cssnewbie.com/wp-content/uploads/2008/12/random-art.gif");
  width: 100%;
  height: 200px;
  border: 2px solid red;
  background-attachment: fixed;
}
<div id="test"></div>

Upvotes: 8

Related Questions