CSS Flexbox

by jonjieviduya

HTML

<div class="wrapper">
   <div class="flex-container">
      <div class="box one"></div>
      <div class="box two"></div>
      <div class="box three"></div>
   </div>
</div>

<a href="#" class="button">ok</a>

CSS

.wrapper{
   width: 100%;
   max-width: 960px;
   margin: 0 auto;
}

.flex-container{
   display: flex;
}

.box{
   height: 100px;
   width: 320px;
}

.one{
   background: red;
   flex-shrink: 1;
}

.two{
   background: blue;
   flex-shrink: 2;
}

.three{
   background: green;
   flex-shrink: 3;
}

JavaScript

$(document).on('click', '.button', function(){
	
   
   if(!confirm('are you sure?')){
   	alert("No");
   }
   	
   
});