bootstrap栅格问题困扰很久,百思不得解!求大神指点。

追梦人物 发布于 2015/06/29 22:11
阅读 5K+
收藏 1

我有一个这样的布局,还是从bootstrap官方模板抄来的代码,根据栅格排版,按理来说应该是这个样子的:左边是博客正文,右边是侧边栏(360浏览器,chrom浏览器,ie都试过了)。

<div class="container">

<div class="blog-header">
<h1 class="blog-title">木客的博客</h1>
<p class="lead blog-description">木客的博客-Django开发版</p>
</div>

<div class="row">
<div class="col-md-8 blog-main">
{% block content %}{% endblock %}
</div><!-- /.blog-main -->

<div class="col-md-3 col-md-offset-1 blog-sidebar">
{% block side %}{% endblock %}
</div><!-- /.blog-sidebar -->
</div><!-- /.row -->

</div><!-- /.container -->

按理布局应该是这样的,左边是博客正文div class="col-md-8 blog-main",右边是侧边栏(sidebar)div class="col-md-3 col-md-offset-1 blog-sidebar"


可我的浏览器显示的是这样的界面,侧边栏在博客正文的下边而不是右边!!!各大浏览器都试过,我想应该可以排除浏览器的问题。请帮助帮助我吧!
加载中
0
张亦俊
张亦俊

给你个建议啊,当你百思不得其解的时候F12打开开发者工具,确定在控制台上没有输出任何错误就可以了。

3
自由自在的小鱼
自由自在的小鱼
你这典型的属于调戏
1
ckinmind
ckinmind
你这明显样式文件就有问题啊
0
首席撸出血
首席撸出血
col-md-8    自己看一下bootstrap的说明MD对应的最大宽度的970px,但是你的电脑分辨率肯定不止这个宽度,使用col-lg-8   试试
0
追梦人物
谢谢,已经解决了。并不是布局问题,而是不小心把bootstrap.min.css删了。。。
0
追梦人物
我真的不是故意的,不知道什么时候抽的风!
0
负心杏

直接用chrome系浏览器,审查元素看css,所有问题都能明白。

像你这个,一眼就可以看出,所有class都没有多少样式,就可以想到是引用css文件的问题了。

0
追梦人物
谢谢!确实是我二了
返回顶部
顶部