查看布局 here ，我想将整个页面的最小宽度限制为 600px。我试过设置内容的最小宽度，但右侧与它重叠。
有人可以推荐一种更正此问题的方法，或满足此要求的其他布局吗？
在此要记住的另一件事是内容在代码中出现的顺序 - 1) 2) 3) 以及页面上显示的顺序。任何一列都应该能够将页脚向下移动，我想再定义两个区域:当前标题在代码中显示为 4)，5) 是 4)< 上方的小内容栏/p="">
简而言之，在代码中，页面内容区域将在页面上显示如下(从上到下排序，从 1 开始):
7) top menu
5) header
4) contentbar
2) 1) 3)
6) (footer)
谢谢。
在 Midas 的帮助下，我几乎得到了我要找的东西。下面的问题是，当浏览器宽度减小时，右侧列不会将页脚向下移动，也不会锁定到最小宽度的位置。此外，我仍然无法将顶部菜单栏的所有内容都向下推，因为它只是与标题重叠:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Holygrail1</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
* {
margin:0; padding:0
}
body {
font:76% Arial, Helvetica, sans-serif
}
p {
margin:0 10px 10px
}
a {
display:block; color:#981793; padding:10px
}
#container
{
margin-top:104px; min-height:400px;
min-width:700px;
top:20px;
}
#wrapper {
float:left; width:100%
}
#content {
margin: 0 200px 0 200px
}
#content p {
line-height:1.4
}
#leftbar {
background:#b9caff; float:left; width:200px; margin-left:-100%
}
#rightbar {
position: absolute;
background:#ff8539;
right:0px;
width:200px;
}
#header {
position:absolute; top:0; width:100%; height:266px;
}
#header h1 {
line-height:80px; padding-left:10px; background:#eee; color:#79b30b
}
#contentbar {
position:absolute; top:80px; width:100%; z-index:1
}
#footer, #contentbar {
background:#333; color:#fff
}
#footer p, #contentbar p {
margin:0; padding:5px 10px; line-height:14px
}
#footer {
clear:left; width:100%
}
#topbar {
position:absolute; top:0px; width:100%; z-index:1;
height: 20px;
background-color:red;
}
</style>
</head>
<body>
<div id="container">
<div id="wrapper">
<div id="content">
<p><strong>1) Content here.</strong> column long long column very long fill fill fill long text text column text silly very make long very fill silly make make long make text fill very long text column silly silly very column long very column filler fill long make filler long silly very long silly silly silly long filler make column filler make silly long long fill very.</p>
</div>
</div>
<div id="leftbar">
<p><strong>2) leftbar here.</strong> long long fill filler very fill column column silly filler very filler fill fill filler text fill very silly fill text filler silly silly filler fill very make fill column text column very very column fill fill very silly column silly silly fill fill long filler</p>
</div>
<div id="rightbar">
<p><strong>3) More stuff here.</strong> very text make long column make filler fill make column column silly filler text silly column fill silly fill column text filler make text silly filler make filler very silly make text very very text make long filler very make column make silly column fill silly column long make silly filler column filler silly long long column fill silly column very</p>
<p>very make make fill silly long long filler column long make silly silly column filler fill fill very filler text fill filler column make fill make text very make make very fill fill long make very filler column very long very filler silly very make filler silly make make column column</p>
<p>fill long make long text very make long fill column make text very silly column filler silly text fill text filler filler filler make make make make text filler fill column filler make silly make text text fill make very filler column very</p>
<p>column text long column make silly long text filler silly very very very long filler fill very fill silly very make make filler text filler text make silly text text long fill fill make text fill long text very silly long long filler filler fill silly long make column make silly long column long make very</p>
</div>
</div>
<div id="contentbar"><p>4) Content bar here.</p></div>
<div id="header"><h1>5) Header</h1></div>
<div id="footer"><p>6) Here it goes the footer</p></div>
<div id="topbar"><p>7) Top Bar </p></div>
</body>
</html>
最佳答案
因为这不是付费代码网站，所以我不会为您编写所有代码。
这可能是个愚蠢的问题，但这不适合你吗？
body {
min-width: 600px;
}
关于css - 需要 3 列 CSS 布局，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6257424/
当我使用Bundler时，是否需要在我的Gemfile中将其列为依赖项？毕竟，我的代码中有些地方需要它。例如，当我进行Bundler设置时:require"bundler/setup" 最佳答案 没有。您可以尝试，但首先您必须用鞋带将自己抬离地面。 关于ruby-我需要将Bundler本身添加到Gemfile中吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/4758609/
我在MiniTest::Spec和Capybara中使用以下规范:find_field('Email').must_have_css('[autofocus]')检查名为“电子邮件”的字段是否具有autofocus属性。doc说如下:has_css?(path,options={})ChecksifagivenCSSselectorisonthepageorcurrentnode.据我了解，字段“Email”是一个节点，因此调用must_have_css绝对有效!我做错了什么？ 最佳答案 通过JonasNicklas得到了答案:No
我注意到像bundler这样的项目在每个specfile中执行requirespec_helper我还注意到rspec使用选项--require，它允许您在引导rspec时要求一个文件。您还可以将其添加到.rspec文件中，因此只要您运行不带参数的rspec就会添加它。使用上述方法有什么缺点可以解释为什么像bundler这样的项目选择在每个规范文件中都需要spec_helper吗？ 最佳答案 我不在Bundler上工作，所以我不能直接谈论他们的做法。并非所有项目都checkin.rspec文件。原因是这个文件，通常按照当前的惯例，只
我实际上是在尝试使用RVM在我的OSX10.7.5上更新ruby，并在输入以下命令后:rvminstallruby我得到了以下回复:Searchingforbinaryrubies,thismighttakesometime.Checkingrequirementsforosx.Installingrequirementsforosx.Updatingsystem.......Errorrunning'requirements_osx_brew_update_systemruby-2.0.0-p247',pleaseread/Users/username/.rvm/log/138121
是否可以为特定(或所有)项目使用多个布局？例如，我有几个项目，我想对其应用两种不同的布局。一个是绿色的，一个是蓝色的(但是)。我想将它们编译到我的输出目录中的两个不同文件夹中(例如v1和v2)。我一直在玩弄规则和编译block，但我不知道这是怎么回事。因为，每个项目在编译过程中只编译一次，我不能告诉nanoc第一次用layout1编译，第二次用layout2编译。我试过这样的东西，但它导致输出文件损坏。compile'*'doifitem.binary?#don’tfilterbinaryitemselsefilter:erblayout'layout1'layout'layout2'
我有一个div，它根据表单是否正确提交而改变。我想知道是否可以检查类的特定元素？开始元素看起来像这样。如果输入不正确，添加错误类。 最佳答案 试试这个:browser.div(:id=>"myerrortest").class_name更多信息:http://watir.github.com/watir-webdriver/doc/Watir/HTMLElement.html#class_name-instance_method另一种选择是只查看具有您期望的类的div是否存在browser.div((:id=>"myerrortes
这个问题在这里已经有了答案:关闭10年前。PossibleDuplicate:Rubysyntaxquestion:Rational(a,b)andRational.new!(a,b)我正在阅读ruby镐书，我对创建有理数的语法感到困惑。Rational(3,4)*Rational(1,2)产生=>3/8为什么Rational不需要new方法(我还注意到例如我可以在没有new方法的情况下创建字符串)？
我需要用任何语言编写一个算法，根据3个因素对数组进行排序。我以度假村为例(如Hipmunk)。假设我想去度假。我想要最便宜的地方、最好的评论和最多的景点。但是，显然我找不到在所有3个中都排名第一的方法。Example(assumingthereare20importantattractions):ResortA:$150/night...98/100infavorablereviews...18of20attractionsResortB:$99/night...85/100infavorablereviews...12of20attractionsResortC:$120/night
修改(澄清问题)我已经花了几天时间试图弄清楚如何从Facebook游戏中抓取特定信息；但是，我遇到了一堵又一堵砖墙。据我所知，主要问题如下。我可以使用Chrome的检查元素工具手动查找我需要的html-它似乎位于iframe中。但是，当我尝试抓取该iframe时，它是空的(属性除外):如果我使用浏览器的“查看页面源代码”工具，这与我看到的输出相同。我不明白为什么我看不到iframe中的数据。答案不是它是由AJAX之后添加的。(我知道这既是因为“查看页面源代码”可以读取Ajax添加的数据，也是因为我有b/c我一直等到我可以看到数据页面之后才抓取它，但它仍然不存在)。发生这种情况是因为
这个问题在这里已经有了答案:HashsyntaxinRuby[duplicate](1个回答)关闭5年前。我有一个Recipe，其中包含以下未通过lint测试的代码:service'apache'dosupports:status=>true,:restart=>true,:reload=>trueend失败并出现错误:UsethenewRuby1.9hashsyntax.supports:status=>true,:restart=>true,:reload=>true不确定新语法是什么样的...有人可以帮忙吗？