as @Dominik says, if you are using `bootstrap-4`, you can use bootstrap classes
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
/* ONLY FOR SPACE PURPOSE */
.container {
margin-top: 10px;
}
<!-- language: lang-html -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<div class="container">
<div class="col-lg-12">
<div class="row m-0">
<div class="col">
<div class="card height-2 d-flex flex-row align-items-center p-3" style="border-top:4px solid #515151;">
<i class="material-icons" style="color:#515151;">gavel </i>
<h5 class="pl-5 m-0">Legislacion</h5>
</div>
</div>
<div class="col">
<div class="card height-2 d-flex flex-row align-items-center p-3" style="border-top:4px solid #9b9b60;">
<i class="material-icons" style="color:#9b9b60;">today</i>
<h5 class="pl-5 m-0">Calendar</h5>
</div>
</div>
</div>
</div>
</div>
<!-- end snippet -->
For a smooth slideup:
$("#success-alert").fadeTo(2000, 500).slideUp(500, function(){
$("#success-alert").slideUp(500);
});
___
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
$(document).ready(function() {
$("#success-alert").hide();
$("#myWish").click(function showAlert() {
$("#success-alert").fadeTo(2000, 500).slideUp(500, function() {
$("#success-alert").slideUp(500);
});
});
});
<!-- language: lang-html -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<div class="product-options">
<a id="myWish" href="javascript:;" class="btn btn-mini">Add to Wishlist </a>
<a href="" class="btn btn-mini"> Purchase </a>
</div>
<div class="alert alert-success" id="success-alert">
<button type="button" class="close" data-dismiss="alert">x</button>
<strong>Success! </strong> Product have added to your wishlist.
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<!-- end snippet -->
