中心堆棧圖像和span標記 - bootstrap

Question

我想堆積image，first span和second span一個接一個地爲xs設備。它應該中心對齊爲xs設備。

這裏是我的一段代碼：FIDDLE

<div class="row"> 
    <div> 
     <div class="col-md-9 col-md-offset-3 col-sm-10 col-sm-offset-2" style="padding-right:0px"> 
      <img src="Images/signin_logo.jpg" width="150" height="110" /> 
      <p> <span style="color:#989898; font-size:36px">Template Fire Sign In</span> 
       <br /> <span style="color:#A8A8A8; font-size:18px">Please sign in with your credentials now to get access.</span> 

      </p> 
     </div> 
    </div> 
</div> 

我想實現這樣的：FIDDLE

 Image 
    Span One 
    Span Second... 
    ........ 

Answer 1

添加這個CSS。它會給你你想要得到的。但請記住，您將獲得以767px寬度或更少顯示爲中心的元素，您可以通過更改max-width的值來更改元素。

@media only screen and (max-width: 767px){ 
    .row img, 
    .row p{ 
     display:block; 
     margin: 10px auto; 
     text-align: center; 
    } 
}