button grup

by Jaf Al azam

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="container">
	<div style="margin-bottom: 0px" class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">	
		 <div class="panel panel-default">
			<div class="panel-heading" role="tab" id="headingAO">
			  <h4 class="panel-title" >
				<a data-toggle="collapse" data-parent="#accordion" href="#collapseAO" aria-expanded="true" aria-controls="collapseAO" >
					Pengumuman
				</a>
			  </h4>
			</div>
			<div id="collapseAO" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingAO">
			  <div class="panel-body">
				Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman Pengumuman 
			  
			   </div>
			</div>
		  </div>
			
							
		  <div class="panel panel-default">
			<div class="panel-heading" role="tab" id="headingOne">
			  <h4 class="panel-title">
				<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
				  Kategori
				</a>
			  </h4>
			</div>
			<div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
			  <div class="list-group">
				<a href="#" class="list-group-item">Kaos</a>
				<a href="#" class="list-group-item">Celana</a>
				<a href="#" class="list-group-item">Kemeja</a>
				<a href="#" class="list-group-item ">Rok</a>
			  </div>
			</div>
		  </div>
		  
		  <div class="panel panel-default">
			<div class="panel-heading" role="tab" id="headingTwo">
			  <h4 class="panel-title">
				<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
				  Sosial...