Twitter引导不是移动友好的

Question

因此，我正在研究一个学习twitter引导项目，但进入问题是，该网站实际上并不友好，在大屏幕上看起来很糟糕。

这里是链接：

jsfiddle: http://jsfiddle.net/6LsG7/ 

粘性页脚也涵盖了很多内容。

Answer 1

看来你并没有使用bootstrap提供的任何类。相反，你正在创建自己的ID？ Bootstrap有一个结构化的框架，使用“容器”，“导航”，“列”等类。

为了获得响应式设计，您必须遵守预先提供的课程。我可能会建议你看看一个所见即所得的引导布局制作者，比如LayoutIt。

Answer 2

Bootstrap带有一个类似网格的体系结构，它允许您在页面中创建节，以便它们全部排队并适当堆叠。先熟悉这一点，然后为每个部分分配正确的类。例如：

col-lg-12将创建一个100％宽的区域。
COL-LG-11将创建一个节〜90％宽
...

COL-LG-6将创建一个节50％宽

等等。

所以创建您的divs或部分的正确位置。将行类添加到每个可堆叠的部分。 如果你在这一行里面有两个侧面，添加一个col-lg-6，它们将排列在彼此的旁边，并在每个移动设备上排列。

现在，我马上看到了明显的问题。

在你的body标签之间，创建一个包装类div，它将包含你的页面并定义它的宽度。

不要使用这么多的定位。特别位置：固定。这是让事情变得粘稠和混乱的原因。你想利用你的边距，填充，浮动和显示属性来正确对齐事物。

在我递交任何代码之前试一试。我想先看看你的大脑工作。然后我们会再拍一些麻烦。