2016-02-03 26 views
0

我用面板和麪板體創建了一個集裝箱。當我在桌面上查看網站時,它看起來相對不錯。但是當我用手機看它時,似乎在右邊有一個很大的空間,沒有任何東西。手機上製作集裝箱液

圖片中描述的問題http://snag.gy/ApnWS.jpg

http://codepen.io/anon/pen/MKqpRe

我不知道我該如何解決這個問題?我嘗試設置容器流體,但我不喜歡桌面上的顯示器。我甚至不確定容器液是否能解決我的問題。如果我能得到提示或建議,請。我也很樂意改變我的文章佈局。我第一次寫文章頁面時,任何提示或建議都會很大。

<div class="container"> 
    <div class="row"> 

     <div class="col-lg-9"> 

      <div class="panel panel-default"> 

       <div class="panel-body"> 

        <div class="page-header"> 
         <h3> 
          NFL Tutorial <small>Posted on January 25th</small> 
         </h3> 
         <div class="fb-like" data-href="https://google.com" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div> 
        </div> 

        <div> 
         <ul> 
          <li> 
           <p> 
           <h4> 
            <b>1. Football is an 11 vs 11 sp 
+0

無法重現您的問題 – Aziz

+0

我相信它不是重現的原因le是因爲OP的問題是設備特定的。 @掌握您使用什麼設備來測試移動尺寸? – zer00ne

+0

底部那些社交圖標上的CSS是什麼?他們沒有在提供的代碼,看起來像它可能推動的事情... –

回答

0

而不是

<div class="col-lg-9"> 

嘗試書面方式

<div class="col-xs-12 col-sm-12 col-md-12 col-lg-9"> 

只是一個想法,我也不能複製...

0
@media screen and (max-width: 768px) { .container { width: 100%; padding: 0px } } 
+0

不適用於我。 –