<div class="panel panel-primary" id="result_panel"> <div class="panel-heading"><h3 class="panel-title">Result List</h3> </div> <div class="panel-body"> <ul class="list-group"> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> # many li here.. <li class="list-group-item"><strong>The Barrington At Park Place</strong>(15210m) </li> <li class="list-group-item"><strong>Camden Huntingdon Apartments</strong>(15820m) </li> <li class="list-group-item"><strong>Enclave at Water's Edge Apartments</strong>(15830m) </li> </ul> </div> </div>
my html looks like this. I expect many item in the list. And most time it will exceed my window,
I tried to set my css like this:
.list-group{ margin-bottom: 10px; overflow:scroll; -webkit-overflow-scrolling: touch; }
but it doesn't help, any ideas?
Try adding max-height:
.list-group{ max-height: 300px; margin-bottom: 10px; overflow:scroll; -webkit-overflow-scrolling: touch; }
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <div class="panel panel-primary" id="result_panel"> <div class="panel-heading"><h3 class="panel-title">Result List</h3> </div> <div class="panel-body"> <ul class="list-group"> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> <li class="list-group-item"><strong>Signature Accommodations</strong>(1480m) </li> </ul> </div> </div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With