问题标签 [skeleton-css-boilerplate]

我为我的网站使用了响应式 Skeleton 框架（样板）（你可以从这里获得它：http ://www.getskeleton.com/ ）。

我有<ul>不同高度的列表列。要清除嵌套列，CSS 说我需要将.clearfix类放到父元素中。

我已经尝试放置类，但它不会清除嵌套列。由于我使用的是<ul>列表项，因此我不能将元素放入或放入<ul>元素中。

有什么解决办法吗？

我的html代码：

在 Skeleton CSS 中，第一列的高度为 500px，然后 (d) 和 (e) 列应该移动到底部/第二行，或者换句话说我需要清除嵌套列。

我想在<li class="clear"></li>我移到另一排时再放一个空的，它可以工作，但我正在寻找替代解决方案。比添加空更合适的东西<li>

谢谢你。

这是一个挑战！

我目前正在使用 GetSkeleton 并且有 3 个基本列

您会注意到，框 3 中有更多内容。我怎样才能使框 1 和框 2 与底部对齐 - 但要保持响应。

当我第一次被介绍到骨架来帮助响应行为和东西时，我开始使用 UI 框架。

然后我转向 Bootstrap，因为我觉得它提供的只是骨架。现在我喜欢 Zurb 的 Foundation 及其功能。

阻止我轻松（或相对轻松）切换不同框架的原因是我将特定于框架的样式添加到代码本身，例如 css 类、btn、row、spanX 等。

现在，每次我想更改框架时，我都需要转到代码并修改每个实例。我主要在 Rails 和 Node.js 上构建应用程序。是否有任何工具/方法可以让我不必修改源代码，一种可以让我将样式信息标记分开，以便我只在进行切换时更改它们？

对于我的一个项目，我第一次使用 Skeleton Boilerplate。而且我正在寻找将 div 置于 Skeleton 中心而不违反 Skeleton 规则的最佳实践。

目前，我的登录页面结构如下。

HTML：

CSS：

如您所见，#loginBox 具有固定的宽度/高度，它应该始终位于页面的中心。margin: 0px 自动代码使其水平居中。但这是 Skeleton 中的最佳实践吗？Skeleton 是否提供了更好的方法？

另外我怎样才能提供它的垂直居中？

您好，我对响应式设计没什么问题。我不知道如何在左侧添加图像，在右侧添加文本。

我正在和骷髅一起工作。

我应该怎么办 ？

更新：一些代码

我正在尝试使用骨架框架来实现完整的背景宽度。目前，运气不好。

这是它现在的样子： http: //shrani.si/f/3A/Uy/28somHnh/capture.png

谢谢大家帮助我。

我正在为我的简单网站（http://tinyurl.com/mmzt9qa）使用 Skeleton 样板。主页运行良好，但由于某种原因，当我在 960 像素 div 框（又名 16 列）中插入 960 像素图像时，布局稍微向左移动（这在徽标上尤其明显，因为该网站非常基本）。在没有大图像的页面上一切都很好。我检查了是否添加了任何填充/边距，但我看不到任何东西......基本上：

例如检查网站上的第一个链接，然后检查第五个（麦当劳 - Playland），你会明白我的意思。我尝试降低图像大小，但即使在 500px 宽度上它也会做同样的事情......

I had experience with Twitter Bootstrap and Foundation, and I personally think the only thing I want to use is their grid system. Other features are just bloated.

So I read about the prospect of a grid layout. All of the articles I found are oriented toward an 'artistic' explanation (golden ratio ect). I am a coder at heart, I need a clear & logical reason to use a grid layout (for example: 'columns can be easily stacked on top of each other on mobile screen, and expand horizontally on larger screens'). Can someone give me the pros and cons of applying a grid system to my website? Personally do you think using a grid system is good?

If the answer is yes, should I use a premade grid system like from Twitter Bootstrap/Foundation or just make one for my own? All of the other features are unnecessary for me an irrelevant to my problem.

Thanks! :D

我很难弄清楚这里发生了什么：http: //traviskoenig.brentthelendesign.com/html/。正文内容、页脚和页面顶部的 28px 边距周围有一个奇怪的边框。我不确定这里发生了什么，但 Firebug 向我展示了这段代码：

html { margin-top: 28px !important; }

有没有人对这些奇怪的差距有任何想法？任何帮助将不胜感激，如果还有其他与此问题类似的问题，我深表歉意。

有类似的问题，但他们都没有解决这个问题。

我使用骨架框架 ( http://www.getskeleton.com ) 构建了我的网站。出于某种原因，当我尝试对网站主 div 中的内容应用填充或任何大于 5px 的边距时，文本部分会跳到图像下方。我试过使用他们的“offset-by”类，但同样的事情发生了。我试过使用

margin:0 auto;在该部分的所有 div 上，但无济于事。我也尝试过使用text-align:center;，但这也不起作用（奇怪的是，这仅将 h1 元素集中在该部分中，而没有其他...）。

我遇到的另一个问题是我希望所有背景都扩展以适应浏览器窗口的宽度，并且所有内容都应该保持在中心，但这似乎不适用于这种布局。如果我将容器 div 的宽度设置为 100%，它确实会扩展，但我最终不得不将所有列和偏移量类设置为 100%，然后这会打乱导航等。我想保持我的布局如何我现在有了它，但我只想扩大背景（包括页脚高度）并让所有内容居中。

这是它在浏览器中的截图：http: //i.imgur.com/K3LAshv.png

任何人都可以看看代码，让我知道我应该在这里修复什么吗？我在 JSFiddle 上添加了我的代码：http: //jsfiddle.net/z9uVK/

提前谢谢了！！