html - 在移动设备上制作 Container 流体

Question

我创建了一个带有面板和面板主体的容器。当我在桌面上查看该站点时，它看起来还不错。但是我在手机上看的时候，右边好像有一个很大的空间，什么也没有。

描述问题的图片 http://snag.gy/ApnWS.jpg

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

我想知道如何解决这个问题？我尝试设置 container-fluid 但我不喜欢桌面上的显示方式。我什至不完全确定 container-fluid 是否可以解决我的问题。如果我能得到提示或建议，请。我也很愿意改变我的文章布局。我第一次写文章页面，任何提示或建议都会很棒。

<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

Answer 1

代替

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

尝试写作

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

只是一个想法，我也无法复制它......