Question

<footer id="footer" class="bg-dark pt10">
    <div class="container">
        <div class="col-lg-10 col-lg-offset-1">
            <div class="row">
                <div class="col-lg-12">
                    <span class="copyright link">Copyright © 2006-2015 Pure International</span>
                    <ul class="list-inline pull-right">
                        <li><a class="link" href="<?= site_url("page/view/privacy"); ?>"><?= lang("privacy"); ?></a></li>|
                        <li><a class="link" href="<?= site_url("page/view/terms"); ?>"><?= lang("t&c"); ?></a></li>|
                        <li><a class="link" href="<?= site_url("page/view/about_us"); ?>"><?= lang("about_us"); ?></a></li>|
                        <li><a class="link" href="<?= site_url("page/view/contact_us"); ?>"><?= lang("contact_us"); ?></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</footer>

输出就是这样：

AAAAA          BB|CC|DD|EE

它在大屏幕上工作正常，但是，当屏幕较小时，正确的内容会转到新的一行：

AAAAA
              BB|CC|DD|EE

并且正确对齐。

我该怎样防止这种情况？我想要实现的是：

AAAAA
BB|CC|DD|EE

屏幕变小时。谢谢你的帮助。

Answer 1

将pull-left与text-align: right;一起提供。

<强>段

＆＃13;

.pull-left {float: left; width: 50%;}
.text-right {text-align: right;}
@media screen and (max-width: 300px) {
  .pull-left {float: none;}
  .text-right {text-align: left;}
}

＆＃13;

<div class="pull-left">Left</div>
<div class="pull-left text-right">Right</div>

＆＃13;

当内容转到新行时，取消向右拉

1 个答案: