Question

Sliding working Fiddle but incorrect width prior to scroll is here. Correct layout, but no scroll functionality is here. Still learning CSS, but for some reason, if I remove the follwong fixed floating side CSS:

#commentWrapper { 
  position: absolute;
  margin-left: 35px;
  left: 450px;
  width: 280px;
}

#comment {
  position: absolute;
  top: 0;
  /* Can include margins in the sliding effect here */
}

#comment.fixed {
  position: fixed;
  top: 0;
}

, the position is correct for the side, however it does no stay at its fixed postion as you scroll down. keeping the code in, the CSS for some reason reduces the width of the side, but as soon as you scroll down, it becomes normal. How can I fix it so that it loads on the side with the correct position and width?

Answer 1

I updated your CSS. Take a look. I hope this fixed your problem!

The relevant code I changed:

New:

#commentWrapper { 
float:right;
margin-left: 10px;
margin-right: 10px;
left: 450px;
width: 25%;
}

Old:

#commentWrapper { 
    position: absolute;
    margin-left: 35px;
    left: 450px;
    width: 280px;
}