Bootstrap Button Alignment

HTML

<div class="demo-justify-content-start">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

<div class="demo-justify-content-center">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

<div class="demo-justify-content-end">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

<div class="demo-justify-content-around">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

<div class="demo-justify-content-between">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

<div class="demo-justify-content-evenly">
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
<button class="btn btn-outline-secondary" type="button">Button</button> 
</div>

CSS

.demo-justify-content-start {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: flex-start }	

.demo-justify-content-center {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: center }
		
.demo-justify-content-end {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: flex-end }
	
.demo-justify-content-around {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: space-around }

.demo-justify-content-between {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: space-between }

.demo-justify-content-evenly {
display: flex;
flex-direction: row;
gap: 20px;
justify-content: space-evenly }