контент в строчном блоке по трем столбцам

Question

Я пытаюсь вертикально выровнять содержимое по трем столбцам (структура Bootstrap) Я только хочу, чтобы этот эффект влиял на столбцы размера экрана, он отлично складывается с добавлением col-xs-12.

HTML

<div class="row sub-footer"> 

    <div class="col-xs-12 col-md-1"> 
     <a class="sub-footer-brand" href="<?php echo home_url(); ?>"></a>   
    </div> 
    <div class="col-xs-12 col-md-5">  
     <div class="sub-logo-text"><p>A designer and creative strategist specializing in new business ventures</p></div> 
    </div> 

    <div class="col-xs-12 col-md-6 fcred"> 
     <p class="fcred">&copy; <?php echo date('Y');?> - <strong><a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>"> <?php bloginfo('name'); ?></a></strong> <?php bloginfo('description'); ?></p> 
    </div> 

</div><!-- /sub-footer --> 

CSS

.sub-footer-brand { 
display: block; 
margin: 0; padding: 0; 
height: 40px; 
width: 100%; 
background: url('img/logo.png') no-repeat center center; 
background-size: contain; 
} 

.sub-logo > div { 
display: inline-block; 
vertical-align: middle; 
} 

.sub-logo-text {  
padding-left: 20px; 
border-left: 1px solid #ddd; 
} 

.fcred { 
text-align: right; 
padding-right: 20px; 
line-height: 40px; 
} 

Этот выход три колонки. Ответный образ (фон div), абзац текста и предложение, которое является авторским правом/кредитами веб-сайта.

параграф кажется самым сложным, он может быть более одной строки в зависимости от размера экрана, я хочу, чтобы он оставался вертикально по центру рядом с другими двумя элементами.

Answer 1

Используйте следующий процесс:

• вертикали выравнивания: 50% для изображения и предложения
• вертикали выравнивания: 50%; высота линии: 25% для пункта

Ссылки

• vertical-align, inline-block, and line-height