如何保持icomoon圖標中間

Question

我想保持icomoon圖標icon-uniE610在像下圖

但我做的方式，中間保持在頂部

下面的圖標圖像是我做

的方式這是我icomoon的style.css

@font-face { 
    font-family: 'icomoon'; 
    src:url('fonts/icomoon.eot?ktnun7'); 
    src:url('fonts/icomoon.eot?#iefixktnun7') format('embedded-opentype'), 
     url('fonts/icomoon.woff?ktnun7') format('woff'), 
     url('fonts/icomoon.ttf?ktnun7') format('truetype'), 
     url('fonts/icomoon.svg?ktnun7#icomoon') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 

[class^="icon-"], [class*=" icon-"] { 
    font-family: 'icomoon'; 
    speak: none; 
    font-style: normal; 
    font-weight: normal; 
    font-variant: normal; 
    text-transform: none; 
    line-height: 1; 

    /* Better Font Rendering =========== */ 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale; 
} 

.icon-search:before { 
    content: "\e600"; 
} 
.icon-users:before { 
    content: "\e601"; 
} 
.icon-lock:before { 
    content: "\e602"; 
} 
.icon-cogs:before { 
    content: "\e603"; 
} 
.icon-bubbles:before { 
    content: "\e604"; 
} 
.icon-pawn:before { 
    content: "\e605"; 
} 
.icon-box-add:before { 
    content: "\e606"; 
} 
.icon-signup:before { 
    content: "\e607"; 
} 
.icon-equalizer:before { 
    content: "\e608"; 
} 
.icon-bars:before { 
    content: "\e609"; 
} 
.icon-disk:before { 
    content: "\e60a"; 
} 
.icon-user:before { 
    content: "\e60b"; 
} 
.icon-stackoverflow:before { 
    content: "\e60d"; 
} 
.icon-store:before { 
    content: "\e60e"; 
} 
.icon-user2:before { 
    content: "\e60c"; 
} 
.icon-trash:before { 
    content: "\e60f"; 
} 
.icon-uniE610:before { 
    content: "\e610"; 
    font-size:50px; 
    color:black; 
    vertical-align:middle; 
} 

，這是我的HTML代碼

<div class="container"> 
     <div class="row"> 
       <div class="col-md-6"> 
        <img src="http://www.computerhope.com/logo.gif" alt="Logo" class="round"/> user 
       </div> 
       <div class="col-md-6 ">Recently purchased 
         <div id="slideshow"> 
           <span class="images"> 
             <div class="col-md-3"><div class="box"> 
               <img src="http://lorempixel.com/150/100/abstract" /> 
                 <span class="caption simple-caption"> 
                   <p>Review</p> 
                 </span> 
              </div></div> 
             <div class="col-md-3"><div class="box"> 
               <img src="http://lorempixel.com/150/100/food" /> 
                 <span class="caption simple-caption"> 
                   <p>Review</p> 
                 </span> 
              </div></div> 
           </span> 

             <a class="next icon-uniE610" href="#">Next</a> 
         </div> 
       </div> 
     </div> 
</div> 

這是fiddle

Answer 1

添加以下CSS，

.next { 
height: 100%; 
display: table-cell; 
vertical-align: middle; 
} 

#slideshow{ 
    display:table; 
} 

這裏是一個DEMO