Seeking assistance in vertically aligning two divs using the table cell method. My goal is to have a single-slider div vertically aligned in the middle, but my attempts have been unsuccessful. Can anyone provide guidance on this issue? I am feeling confused about it. Below is the code snippet:
.slider-area {
height: 100%;
width: 100%;
}
.silder-inner {
height: 100%;
display: table;
}
.single-silder {
height: auto;
display: table-cell;
vertical-align: middle;
}
<div class="slider-area">
<div class="silder-inner">
<div class="single-slider">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3>Holla You'r Welcome</h3>
<h2>Best <span>Digital Agency</span> &<br>Business Farm</h2>
<a href="" class="btn custom-btn slider-btn">Contract Now</a>
</div>
</div>
</div>
</div>
</div>
</div>