Bootstrap:CSS - 列表组项目的高度

2023-12-21

请考虑关注 JSFiddle:

http://jsfiddle.net/7W2r4/12/ http://jsfiddle.net/7W2r4/12/

您可能会注意到:list-group-item已经完全崩溃了。而且我似乎无法让它自动调整。 (例如。height:auto;)

然而当我提供 css 规则时:height:20px;,然后调整行大小。 如何使列表组项目的高度适应内容的大小?

感谢您的时间。


你可以加overflow:hidden或其他“清除修复”代码到列表组项目,如果您需要保留项目中的浮动。浮动总是会导致浮动物品的高度出现问题。清除它们或设置溢出将强制正确计算高度。看CSS:浮动div的高度为0 https://stackoverflow.com/questions/9024494/css-floating-divs-have-0-height欲了解更多信息。

.list-group-item
{
  overflow:hidden;  
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd;
}

由于您使用的是 Bootstrap,因此您可以添加class="clearfix"为 HTMLlist-group-items

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Bootstrap:CSS - 列表组项目的高度 的相关文章

随机推荐

  • 如何让 Wintersmith 中的文章不在其自己的子目录中?

    在 Wintersmith 中 默认博客模板从 content articles index md 生成帖子 这很好 因为它允许将图像等关联文件包含在文章中 但实际上 大多数 博客文章 只是与模板关联的文本内容 必须创建子目录是一个小烦恼
  • iPhone,“尝试注册的过滤专辑列表超过最多 5 个。这将失败。”错误

    当我尝试从照片库中读取图像时 出现错误 尝试注册的过滤相册列表超过最多 5 个 这将失败 图像未读取 知道如何解决这个问题吗 我认为您没有检查源类型 你可能正在做 self sourceType UIImagePickerControlle
  • Unix Shell编程:打印时添加空行

    我试图列出目录中的所有文件 但是如何用空行分隔每个文件 基本上每个文件都用空行分隔显示 我正在尝试使用 for 循环 我确实尝试了几个例子 但没有一个真正通过在之间间隔空行来起作用 for i in ls do echo n ls l do
  • 在所有视图中创建 Telerik Sidedrawer

    我已经成功地让 Telerik Side drawer 在一个视图中工作 但我坚持将其制作成一个可以全局使用的组件 我想避免将其复制并粘贴到每个视图中 所以我的问题是如何将其变成可重用的组件 所以当你使用page router outlet
  • MySQL - 如果尚不存在则插入

    我想执行这个 MySQL 查询 INSERT INTO cron stats user VALUES int d by user 每当此类用户尚不存在时 如下所示 SELECT 1 FROM cron stats WHERE user in
  • git log 中带有 tformat 的额外换行符

    当我使用git log pretty oneline shortstat 我得到了我的日志的紧凑表示 git log pretty oneline shortstat 73c6eecd930c2f66d5c1e87fcca7ca9b0e35
  • 需要一些有关使用 PERL 的 IRC BOTS 的信息

    有谁知道有一款用 Perl 编写的好 irc 机器人吗 我只需要一个简单的登录到该频道 然后根据用户所说的内容进行回复 e g 用户
  • 只让实例访问标签本身?

    看着这个帖子 https serverfault com questions 686526 how do you tag and name the ec2 instance that was launched by an ec2 spot
  • AppStore iOS 应用新版本提交问题

    您好 提前致谢 在尝试使用应用程序加载器向 AppStore 提交新版本的 iOS 应用程序时 我收到了以下消息 ITC apps validation prerelease build missing 并停止提交 我在使用以前版本的 iT
  • GRPC:用Java/Scala制作高吞吐量客户端

    我有一项以相当高的速率传输消息的服务 目前它由 akka tcp 提供服务 每分钟生成 350 万条消息 我决定尝试一下 grpc 不幸的是 它导致吞吐量小得多 每分钟约 500k 条消息 甚至更少 您能推荐一下如何优化吗 My setup
  • 错误:我的 Prolog 代码中超出本地堆栈

    我无法弄清楚为什么给定 Prolog 代码的以下查询会生成错误Out of local stack 序言代码 likes g c likes c a likes c b likes b a likes b d likes X Z likes
  • PHP DOM UTF-8 问题

    首先 我的数据库使用 Windows 1250 作为本机字符集 我将数据输出为 UTF 8 我在我的网站上使用 iconv 函数将 Windows 1250 字符串转换为 UTF 8 字符串 并且效果完美 问题是当我使用 PHP DOM 解
  • 列出 Capybara/Poltergeist 元素的子元素

    我四处寻找 但找不到办法做到这一点 我们正在 EmberJS Rails 应用程序上的 Cucumber 功能中使用 Poltergeist 驱动程序运行 Capybara 测试 我无法使用 page driver debug 因为我在无头
  • 从 Swagger/OpenAPI 生成 Spring MVC 控制器

    有没有办法根据 Swagger OpenAPI 规范生成控制器 Spring MVC 代码 我知道 Swagger 可以从现有的 Spring 代码生成 但是反过来也可能吗 您基本上是在寻找生成 swagger 服务器端代码 如果您想在构建
  • 重新排列数据:从水年转换为日历年

    我有一个表 其中包含来自流量计的数据 排列如下 Water Year May Jun Jul Aug Sep Oct Nov Dec Jan Feb Mar Apr 1 1953 1954 55 55 43 62 30 46 26 17 2
  • 如何在Android中获取MP3文件的持续时间[重复]

    这个问题在这里已经有答案了 我正在开发一个媒体播放器项目 我想根据我正在播放的 MP3 文件的长度旋转图像 即当歌曲结束时图像应该停止旋转 我想获取所选 MP3 文件的持续时间 以便可以对旋转进行计时 我读了这个问题在 Android 中从
  • 构造函数中“this”关键字的作用是什么?

    我刚才正在查看 MSDN 的示例代码 发现 namespace IListSourceCS public class Employee BusinessObjectBase private string id private string
  • 等待所有线程完成java中的工作

    我正在编写一个具有 5 个线程的应用程序 这些线程同时从 Web 获取一些信息并填充缓冲区类中的 5 个不同字段 当所有线程完成其工作时 我需要验证缓冲区数据并将其存储在数据库中 我该如何做到这一点 当所有线程完成工作时收到警报 我采取的方
  • 如何从分隔类型文件中的特定行打印特定字段

    我有一个排序的分隔类型文件 我想提取特定行中的特定字段 这是我的输入文件 somefile csv efevfe 132143 27092011080210 howdy hoodie adfasdfs 14321 2709201108184
  • Bootstrap:CSS - 列表组项目的高度

    请考虑关注 JSFiddle http jsfiddle net 7W2r4 12 http jsfiddle net 7W2r4 12 您可能会注意到 list group item已经完全崩溃了 而且我似乎无法让它自动调整 例如 hei