set div to position fixed on the relative location

Question

Is it possible to make a div fixed on the location where it is drawn (it's standard ' static / relative ' location)?

So I want div .one , .three and .four to be fixed in the location where it is drawn initially. So that it doesn't scroll. https://jsfiddle.net/sor8hntk/2/

Answer 1

Yes! https://jsfiddle.net/sor8hntk/7/

body {
  margin-top:40px;
}

.one {
  float:left;
  background-color:green;
  width:33%;
  height:50px;
  position: fixed;
}
.two {
  float:left;
  background-color:red;
  width:33%;
  height:500px;
  left: 33%;
  position: absolute;
}

.three {
  float:left;
  background-color:blue;
  width:33%;
  height:50px;
  position: fixed;
  left: 66%;
}

.four {
  width:33%;
  background-color:purple;
  height:10px;
  position: fixed;
}

.five {
  width:100%;
  background-color:pink;
  margin-top: 10px;
}

.six {
  width:100%;
  height:10px;
  background-color:yellow;
}