css - Put a footer on a jqueryui autocomplete list -
i attempting put footer on list of autocomplete. able put li element in list, can't stay @ bottom.
i made fiddle showing basic html structure of list. problem is, css have, footer scrolls overflow area. how can keep pegged bottom?
<ul> <li>item1</li> <li>item2</li> <li>item3</li> <li>item4</li> <li>item5</li> <li>item6</li> <li>item7</li> <li>item8</li> <li>item9</li> <li>item10</li> <li class="footer">footer</li> </ul> ul{ display: block; height: 100px; overflow: auto; position: relative; list-style: none; } li.footer{ position: absolute; bottom: 0; left: 0; right: 0; background: gray; color: white; }
based on update:
edit: demo works how want to, try out.. position of footer absolutely relative list, , content outside of list has no effect on it, previous did, achieve setting top margin. problem solved.
li.footer { position:absolute; margin-top:100px; background: gray; color:white; }
also removed relative attribute in ul.
Comments
Post a Comment