Estoy tratando de colocar un boton
fijo al final del contenido pero cuando hago scroll
este se sube, quiero que se quede estático y no se mueva, que solo haga scroll
los items
...
<!DOCTYPE>
<html charsfet>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<script>
$(document).ready(function(){
$('#Slide button').click(function(){
$('#Slide ul').slideToggle();
});
$('#Slide ul').click(function(e){
e.stopPropagation();
});
});
</script>
<body>
<div id="Slide">
<button class="">
<span class="">Sector</span>
</button>
<ul style="display: none; background-color: red; height: 150px; overflow: auto; position: relative;">
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<li>
<label>
<input type="checkbox"/>
algo
</label>
</li>
<button style="position: absolute; bottom: 0;">Aplicar</button>
</ul>
</div>
</body>
</html>