我对css问题很难过。我在这里设置了一个测试页面：http://georgecrawford.com/test/供您检查。
我有一个左浮动的侧边栏 div，以及一个跟随它的主内容 div（它应该环绕它）。如果内容只是段落，则没有问题，因为文本在浮点周围很好地包装。但是，我在内容中有一些blockquote，我希望它们具有背景颜色和/或边框。这些中的文本没有问题，当然它很好地包围了侧边栏。但是，blockquote本身会跨越内容 div的整个宽度，这意味着它周围的边框将会运行在侧边栏的顶部。
如何确保内容 div中的blockquote水平缩短为与文本行（“行框”）相同的宽度？段落具有相同的行为，但我的段落周围不需要边框！
感谢您的帮助！
答案 0 :(得分：6)
我偶然发现了解决这个问题的可能性。
如果我使用CSS属性blockquotes设置所有overflow: auto，那么当它们与浮动的侧边栏重叠时，会使它们减小到所需的宽度。我已在http://georgecrawford.com/test/更新了演示版，因此您可以看到差异。它在Safari / OS X中非常完美，但我还没有在其他浏览器中测试过。
有何评论？这个解决方案有什么缺点吗？非常感谢你的帮助。
答案 1 :(得分：2)
在IE 9中，“overflow：auto”修正了一个div浮动到一侧的块引用底层或覆盖，但溢出修正不允许在两个blockquote边界上使用标准的blockquote缩进。
background-color: #ccdfff;
border: 5px #dfefff solid;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
color: #003366;
line-height: 2em;
letter-spacing: 0.2em;
overflow: auto;
padding: 20px;
这会使blockquote向右推到“float：right”div的左边缘。 IE9忽略Blockquote边界右边距。 Chrome显示正确的blockquote缩进没有问题。
我测试了父子调整，还有显示，浮动和位置选择器，但这些都没有帮助。当blockquote位于浮动div旁边时，任何人都知道如何纠正IE blockquote边缘崩溃？
答案 2 :(得分：1)
问题不在于blockquote - 它只是做了它所说的，它延伸到它的父母宽度的100％。标识div的父content没有float属性，因此横跨浮动的div。
您可以尝试将侧边栏作为孩子放入content，而不是旁边的兄弟姐妹吗？我认为然后，blockquote应遵守宽度规则。
或者，您可以随时将blockquote设置为display: inline，但这可能不是您想要的，因为它不会再拉伸到整个宽度。