javascript - vertical alignment - can't put display table on parent -
common question - vertically centring div, can't put 'display: table' on parent div.
html hierarchy ( bootstrap 3 layout used - removed php content make simpler, divs needed)
<article> <div id="post-<?php the_id(); ?>"> <div class="row"> <div class="col-md-8 indx-img " style="background-image:url('...');"> </div> <div class="col-md-4"> <div class="text-cell"> <h1>title</h1> <h3>category</h3> </div> </div> </div><!-- /#row --> </div><!-- /#post --> </article> css
article { position: relative; margin: 0; padding: 0; } .indx-img { position: relative; padding: 16% 0; } i want 'text-cell' vertically aligned in col-md-4. can't put display:table on 'article' because screws column layout. there no known heights, article height based off of padding:16% 0; of indx-img class
Comments
Post a Comment