gpt4 book ai didi

css - div 中的蓝图 css pre 未按预期显示

转载 作者:太空宇宙 更新时间:2023-11-04 05:33:54 25 4
gpt4 key购买 nike

我正在尝试弄清楚 blueprint css 框架是否适合我,但在此过程中我遇到了以下问题。问题是我有两个预包装在一个带有 span-12 类的 div 中,但它们没有在两列中并排显示,出于某种原因,一个环绕另一个到底部。如果将以下代码复制到某个 html 文件中,则演示该问题的代码应该可以正常工作:

<html>
<head>
<link rel="stylesheet" href="http://github.com/joshuaclayton/blueprint-css/raw/63795c8bfe31cbbfad726f714bf8d22770adc7ad/blueprint/screen.css" type="text/css" media="screen, projection">
</head>
<body>
<div class="container">
<div class="span-24">
<div class="span-12" style="background:#eee;"><pre>Hello world asdf asdf asdf asd fas df asd fas dfas dfasd f</pre></div>
<div class="span-12" style="background:#ccc;"><pre>Hello world asdf asdf asdf asd fas df asd fas dfas dfasd f</pre></div>
</div>
</div>
</body>
</html>

最佳答案

换行的原因与
 标签无关。 

每个

的宽度为 470px,右边距为 10px。对于这两者,这总共是 960px,比你包含的
(950px) 宽 10px。

这里的解决方案是使用“last”类(由Blueprint CSS框架提供)到最后一个

:

<div class="span-12" style="background:#eee;"><pre>Hello world asdf asdf asdf asd fas df asd fas dfas dfasd f</pre></div>
<div class="span-12 last" style="background:#ccc;"><pre>Hello world asdf asdf asdf asd fas df asd fas dfas dfasd f</pre></div>

此类删除右边距并允许

适合其容器。

您可以在此处查看演示:http://demo.raleighbuckner.com/so/1353282/

关于css - div 中的蓝图 css pre 未按预期显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1353282/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com