Html Twitter引导修复了布局问题
我在使用Twitter引导时遇到了一个奇怪的问题。设置一个测试页面，其行为应与以下示例类似：。以下是html：Html Twitter引导修复了布局问题,html,css,twitter-bootstrap,responsive-design,Html,Css,Twitter Bootstrap,Responsive Design,我在使用Twitter引导时遇到了一个奇怪的问题。设置一个测试页面，其行为应与以下示例类似：。以下是html： <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="/assets/24d7eb4f/css/bootst
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/assets/24d7eb4f/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="/assets/24d7eb4f/css/bootstrap-yii.css" />
<link rel="stylesheet" type="text/css" href="/assets/24d7eb4f/css/bootstrap-responsive.min.css" />
<script type="text/javascript" src="/assets/8b15478e/jquery.js"></script>
<script type="text/javascript" src="/assets/24d7eb4f/js/bootstrap.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="span4" style="border: 1px solid red;"></div>
<div class="span4" style="border: 1px solid red;"></div>
<div class="span4" style="border: 1px solid red;"></div>
</div>
</div>
</body>
span4我错过了什么 边框将像素添加到宽度，因此
span4边框：1px纯红
您可以提供背景而不是边框来进行测试
检查应用边框
会通过在span
上增加一些宽度来破坏布局
处理“列样式”的本机引导解决方案是.well
元素
HTML
这样，您将尊重本机布局并从.well
元素中获益，但请记住，您必须使用自己的.well
样式（使用.well with my style
类）覆盖.well
样式。注意：我在这里使用Twitter引导作为Yii的附加组件。不过这应该不是问题。嗨，谢谢@simbirsk的反馈。你是对的，当然，你会得到一些额外的边界填充。把我扔到这里的是，我在导航和制表符中使用了这个，这会产生和这个边界相同的效果。我说得对吗？只要每个选项卡内的布局是流动的，选项卡（左或右，我支持）就不会引起任何问题。我想这是另一个问题。嗨，谢谢@anpsmn的反馈。你是对的，当然，你会得到一些额外的边界填充。把我扔到这里的是，我在导航和制表符中使用了这个，这会产生和这个边界相同的效果。我说的对吗？是的，边框会增加像素，如果没有足够的空间，会使元素移到下一行。
<div class="row">
<div class="span4">
<div class="well well-with-my-style">
</div>
</div>
<div class="span4"></div>
<div class="span4"></div>
</div>
.well-with-my-style {
border: 1px solid red;
background: none;
/* whatever... */
}