position:sticky is said to be working in firefox but I'm not seeing my sidebar stick.
My html looks like this:
<div class="wrap">
<div class="sticky">side </div>
<div class="content">content <div>
<div>
My css:
.content{
height: 2000px;
overflow: hidden;
}
.sticky{
position: sticky;
width: 200px;
float: left;
}
As I scroll down the sidebar scrolls with the content. It doesn't stick. Anyone know what could be the issue?
It sticks if you specify a top value:
.sticky{
position: -webkit-sticky; /* for safari */
position: sticky;
width: 200px;
float: left;
top: 10px;
}
This doesn't work when you put the sticky thing below something else: jsfiddle.net/3qoe0wd0/44 I'm using Firefox 50.1.0
@ChrisSmith The html markup is broken in your fiddle. That is likely an issue. The div tag isn't closed on the content class.