将列引导至相同高度并让子列匹配高度

2024-03-29

正如标题所暗示的,我正在努力获得正常的均匀性和干净的线条<table>提供,但具有 Bootstrap 网格系统的响应能力。我用过部分解决方案在这里找到 http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-columns-of-same-height,使列的高度相互匹配。

Here's 我在 JSFiddle 中的布局 http://jsfiddle.net/Kragalon/aar9wuxc/2/(大致)。蓝色边框用于使列显示在相同的高度。

问题是,内部 div 的高度不匹配。右侧部分将是一个聊天室,因此文本区域以及标题都是固定高度,因此我试图让消息区域占据额外的高度。我似乎无法得到display:flex在那里工作。

我不介意解决方案是用 Javascript 还是 CSS,只要它是响应式的。

另外,如果您认为我应该将列设置为具有内部的样式divs并给它们添加边距,这似乎不起作用。感谢您的帮助,我很感激!


None

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

将列引导至相同高度并让子列匹配高度 的相关文章

  • 使用 jQuery 对 CSS 变换进行动画处理

    我正在尝试为 div 制作动画 并让它绕 y 轴旋转 180 度 当我调用以下代码时 出现 jQuery 错误 my div animate transform rotateY 180deg webkit transform rotateY
  • 页面其余部分完成加载后延迟加载 html5 视频

    我有一个视频元素用作我正在构建的页面底部部分的背景 我试图通过将 src 存储为 data src 属性并使用 jQuery 在其他资源加载后将其应用到 src 属性 因为它不是英雄图像或任何东西 我想加载海报以节省加载时间 然后稍后加载视
  • History.pushState和页面刷新

    我开始研究 HTML5 新历史 API 不过 我有一个问题 如何处理页面刷新 例如 用户单击一个链接 该链接由 js 函数处理 该函数 异步加载页面内容 使用history pushState 更改URL 用户刷新页面 但是服务器上当然不存
  • 使用 Jquery 更改 css 属性时的事件检测

    有没有办法检测元素的 显示 css 属性是否更改 是否更改为无 块或内联块 如果没有的话有什么插件吗 谢谢 Note 突变事件 https developer mozilla org en US docs Web Guide Events
  • 有没有等效的 gulp 插件来执行“grunt Bower”?

    With grunt 我可以使用命令grunt bower 由 提供grunt bower requirejs https github com ck86 gulp bower files 自动生成RequireJS我本地的配置文件bowe
  • ajax 调用成功后点击链接 href

    我有一个正常的链接 a href http www google com class continue Continue a 我已将点击绑定到一个事件来发布 ajax 请求 如下所示 continue click function ajax
  • 是否可以向 JavaScript 函数发送可变数量的参数?

    是否可以从数组向 JavaScript 函数发送可变数量的参数 var arr a b c var func function debug alert arguments length for arg in arguments alert
  • 在 Typescript 中从基类创建子类的新实例[重复]

    这个问题在这里已经有答案了 我想创建新实例Child班级来自Base类方法 这有点复杂 但我会尽力解释 这是一个例子 class Base constructor clone Here i want to create new instan
  • 仅使用 CSS 向电话号码添加空格

    我有一个生成 HTML 电话号码的页面 如下所示 div class phone 01987123456 div 我想要的只是在数字内添加一个空格 如下所示 01987 123456 生成的数字和 HTML 始终相同 但我只能访问客户端代码
  • 如何在 AWS Amplify 上运行 React/Redux 应用程序的代理

    我最近实施了Proxy 在 Express js 中 对于我的反应应用程序发出请求时隐藏 API URL 当我在本地主机上运行代理和应用程序时 它工作得非常好 现在我已准备好将我的应用程序部署到AWS 放大 我对如何让我的代理在那里运行有点
  • 如何在没有 DOM 的情况下将 javascript 作为 node.js 脚本运行?

    https github com jasondavies d3 cloud https github com jasondavies d3 cloud是一个使用 D3 库的 javascript 文字云 这是一个交互式演示 http www
  • 使用 Google 地图 API 进行反向地理编码

    我正在研究 JavaScript Google Map API 版本 3 更准确地说 正在研究反向地理定位 在 的帮助下官方文档 http code google com intl fr apis maps documentation ge
  • JavaScript:嵌套循环?

    我想实现这样的动画 序列 动画以循环开始 想象一下car从 x1 移动到 x2 然后暂停 1 秒 然后再次播放动画 想象一下car从 x2 移动到 x3 等 the car循环是通过向汽车左侧添加 1px 来实现的 值 但我无法弄清楚嵌套循
  • jQuery clone() 复制数据...有时...?

    使用下面的示例 我有一个tr我正在复制 它包含一个 jQueryautocomplete 第一次克隆时 自动完成功能不起作用 因为附加的data items 一片空白 第二次单击 添加 按钮时 自动完成功能将起作用 此后 再次单击 添加 会
  • JQuery 屏蔽输入插件不起作用

    我已将 JQuery Masked 输入插件添加到我的 Web 项目中 但它根本不起作用 该插件可以在这里找到 http digitalbush com projects masked input plugin http digitalbu
  • HTML 文本框,自动突出显示文本

    我将如何制作一个包含预先存在的文本的文本框 当用户在其中单击时 其中的所有文本都会突出显示 例如 YouTube 在其视频上使用嵌入代码的文本框的方式相同 谢谢 如果我正确理解你的问题 你可以使用一些javascript 未经测试的代码
  • 有没有用 Javascript 编写的开源 JSDoc 解析器?

    我正在寻找一个可以在我的项目中使用的 JSDoc 解析器 我正在寻找可以传递 JSDoc 注释并接收该注释含义的结构化描述的东西 我见过的大多数工具似乎都能够将 JSDoc 注释转换为 HTML 或其他格式 我正在寻找能够提供可用于输入其他
  • ESLint 如何集成到 Create React App 中?

    当我跑步时npx create react app some name 为我创建了一个简单的 React 项目 当我随后窥视package json 似乎有一些 ESLint 存在的证据 因为有 eslintConfig extends r
  • IE 中带有“删除”方法的 jQuery.ajax 问题

    我有一个页面 用户可以使用按钮编辑各种内容并选择触发 ajax 调用 特别是 一个操作会导致远程调用一个 url 其中包含一些数据和 放置 请求 这 因为我使用的是宁静的 Rails 后端 会触发我的更新操作 我还有一个删除按钮 它调用相同
  • 使用命令行将 MediaWiki 维基文本格式转换为 HTML

    我倾向于编写大量文档 因此 MediaWiki 格式对我来说很容易理解 而且比编写传统 HTML 节省了我很多时间 然而 我也写了一篇博客 发现一直从键盘切换到鼠标来输入正确的 HTML 标签会增加很多时间 我希望能够使用 Mediawik

随机推荐

  • 我在使用 m2eclipse 时遇到构建错误,但在命令行上使用 maven2 时却没有构建错误 - 是我的 m2eclipse 配置错误吗?

    我安装了 m2eclipse 在 Eclipse 中构建一个 java 项目 我导入项目如下 Import gt Maven gt Existing Maven Projects gt Import Maven Projects gt Se
  • Intellij 检查更新:无法连接

    下面的屏幕截图已经出现好几天了 其他人看到这个吗 注意 为了确保这不是一般的连接错误 除了能够发布此软消息之外 我还进行了 github pull 这有力地表明我的网络代理已被正确禁用 并且工作正常 所以这条消息令人费解 要解决此问题 选择
  • 为什么windbg命令以.开头或者 !

    之间有什么区别吗 和 WinDbg 中有不同类型的命令 常规命令 例如kb适用于调试会话 例如 显示堆栈转储等 元命令以点为前缀 例如 load 元命令适用于调试器本身 例如 加载扩展 显示帮助等等 扩展命令以感叹号为前缀 例如 analy
  • 通过克隆/推/拉传播远程位置

    我们的项目使用了几个第三方开源库 其中一些需要自定义修改 对于每个库 我们创建了自己的本地 git 存储库 并将原始源位置添加为vendor远程 从那里克隆 根据需要修改它并将其推送到内部远程存储库 我们称之为origin 然后 这些存储库
  • 从数组公式返回单个单元格

    我想从这个公式中获得一个值 即收盘价 GoogleFinance NASDAQ AAPL close 12 13 2012 1 1 相反 此公式填充 2 个标题行 日期 收盘价 然后填充两个值 日期和收盘价 529 69 有没有办法只返回收
  • android.hardware.camera2.CaptureRequest 可以与 OpenCV 一起使用吗?

    我已经为此工作好几天了 我有一个基于 OpenCV JavaCameraView 的项目 我正在尝试与 Android 集成android hardware camera2 CaptureRequest我用来控制相机对光的敏感度的对象 Th
  • 当尝试将重复对象插入集合时,正确的 .NET 异常抛出是什么?

    我有一个 Asset 对象 它有一个属性 AssignedSoftware 它是一个集合 我想确保同一个软件不会多次分配给资产 在 Add 方法中 我检查软件是否已存在 如果存在 我想抛出异常 是否有我应该抛出的标准 NET 异常 或者最佳
  • 将 pandas 0.13.0“打印数据帧”更改为像早期版本中那样打印数据帧

    在 pandas 的新版本 0 13 0 中 数据帧 df 使用以下命令打印在一长串数字中 df or print df 而不是像以前那样进行概述 现在只能使用 df info 是否可以更改默认的 df 或 print df 命令以显示 I
  • 将 youtube url 转换为 iframe 嵌入代码

    我一直在尝试找到一个正则表达式模式来用 iframe 嵌入代码 C 替换字符串中的所有 youtube URL 显然必须提取视频 ID 以下是应匹配的 url 模式 http www youtube com watch v bSiDLCf5
  • 调用异步任务

    我正在播放广播流 我想在流中的歌曲发生变化时生成通知 我正在使用streamscraper http code google com p streamscraper 来获取当前流的元数据 并且我尝试在元数据更改时生成通知 这是我为实现此目的
  • Firebase 存储同步上传

    我正在尝试上传到 GcmTaskService 内的 Firebase 存储 我想同步上传 但所有上传方法 putBytes putFile 都是异步的 我没有找到任何方法来等待上传完成 有什么办法可以同步上传吗 是的 如果您不在 UI 线
  • 返回关联 PHP 数组的前 n 个值?

    我有一个 PHP 数组 排序后如下所示 Array 542 gt 30 588 gt 29 77 409 gt 19 9 237 gt 19 47 457 gt 17 73 410 gt 15 86 实际的数组相当长 最初 按键按顺序设置
  • 用于分割 .csv 文件的批处理文件

    我有一个非常大的 csv 文件 gt 500mb 我希望在命令提示符下将其分解为较小的 csv 文件 基本上是试图在Windows中找到Linux 分割 功能 这必须是一个批处理脚本 因为我的机器只安装了 Windows 并且请求软件很痛苦
  • 确定扑克中的获胜金额而不创建边池

    我正在尝试运行扑克模拟并拥有有关扑克桌的以下数据 每个玩家为底池贡献了多少 每个玩家的 手牌得分 翻牌后 即 如果player 0 score player 1 score 他们并列 我一直在计算每个玩家应该赢得多少 而不需要创建边池并将玩
  • 使用 Vue.Js / Inertia.js 和 Laravel 对结果进行分页

    我正在尝试在 Vue Js 中对来自 Laravel 的数据进行分页 我也在使用 Inertia js 在我的 Laravel 控制器中 我有 data participants User with groups gt select id
  • Javascript:将值返回给回调函数外部的变量[重复]

    这个问题在这里已经有答案了 我有一个非常具体的问题 希望有人可以帮助我 我对 Javascript 很陌生 对 NodeJS 则更陌生 我在用lodash s forIn遍历并添加到数组内的对象的功能 整个事情看起来是这样的 id 20 k
  • Visual Studio 2022 无法构建任何项目

    每次我在 Visual Studio 2022 中构建任何项目时 我在构建输出中得到的都是 Build started 1 gt Build started Project ConsoleApp7 Configuration Debug A
  • 使用 socket.io 处理超大消息

    我有一个 nodejs 项目 它生成多个与套接字 io 通信的进程 该进程既发送数据又接收数据 有时在功能开发过程中 其他程序员可能会犯错误 导致我的套接字基础结构代码发送超过大小 X 例如 超过 500MB 的大消息 我正在寻找一种方法来
  • 如果超过一组特定的行发生更改,如何让 git 仅识别文件已更改?

    在我当前的项目中 我尝试使用 git 来版本控制文本文件 这些文件由生成代码的软件使用 这本身不是问题 问题是每次我生成代码时 它都会自动更新此文件的属性 例如代码生成的日期以及我的名字 你可以想象它看起来像这样 SomeHeader So
  • 将列引导至相同高度并让子列匹配高度

    正如标题所暗示的 我正在努力获得正常的均匀性和干净的线条 table 提供 但具有 Bootstrap 网格系统的响应能力 我用过部分解决方案在这里找到 http www minimit com articles solutions tut