html - CSS: parent element float apply on <a> tag content too -
this html code:
<div class="pull-left small-text"> <?php if($page - 1 > 0): ?> <a href="<?php echo $page_link.'&p='.($page -1); ?>" class="btn btn-white"><i class="fa fa-chevron-right"></i></a> <?php endif; ?> <span><?php echo $page; ?> <?php echo $pages; ?></span> <?php if($page < $pages) : ?> <a href="<?php echo $page_link.'&p='.($page +1); ?>" class="btn btn-white"><i class="fa fa-chevron-left"></i></a> <?php endif; ?> </div>
css:
.btn { border:none; background: none; color: #fff; padding: 10px 30px; text-align: center; font-size: 0.9em; border-radius: 4px; } .pull-left{ float:left; }
problem: when add pull-left
class parent element , <a>
tag icon goes left, it's what's happening:
note: pull-left = float:left;
add display:inline-block
btn
class
Comments
Post a Comment