html - 删除 Bootstrap 中的相邻列空白

标签 html css image twitter-bootstrap whitespace

<分区>

我将只发布一张图片以使这一切更容易理解,因为发布 JSfiddle 将涉及大量的 html 和大量格式化 CSS(响应式图片三 Angular 形)。

我在 bootstrap 中有两行,一行有 3 个 div,每个都是“col-sm-4”。第二行有 4 个 div,每个“col-sm-3”。列相邻的地方有很大的空白间隙,因为图像是三 Angular 形的。无论如何,是否可以重叠列(或完全做其他事情)以删除该空白并使所有三 Angular 形更接近且大小相同?

Screenshot of webpage in desktop view

最佳答案

col-sm-4 在设备视口(viewport)上占 33.33% 的宽度尝试通过赋予它更高的特异性来减少样式表中 .col-sm-4 的宽度,这意味着 .col-sm-4 在 bootstrapmin 中占 33.33%样式表中的 .css 将外部 div 类名称指定为 triangle-container,并在样式表中声明 .traingle-container .col-sm-4 并将它们的宽度设为 15%。以这种方式,它们靠得更近了。

关于html - 删除 Bootstrap 中的相邻列空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28082031/

上一篇:html - CSS 3D 容器,如帖子中所示

下一篇:css - Firefox 中的 Foundation Reveal 问题

相关文章:

javascript - 将图像 src 设置为数据 URL 是否应该立即可用?

java - ListView JavaFX 中的自定义项目

javascript - Angular 阅读更多按钮隐藏(不 chop )div 内容

javascript - javascript/html 中的 Chrome 和 Apple iphone 表情符号

html - 以HTML格式生成Shell脚本输出并发送邮件

html - 如何在移动设备上将 div 移动到另一行?

html - 如何对这些无序列表使用带 anchor 的行 strip 化?

image - 在图片中创建一个钻石

javascript - 如何使用 JS 编辑 CSS 变量?

javascript - .on(click) 事件在 IOS 移动设备上滚动时在固定位置元素上触发