在单行填充空间中显示两个 div - CSS

2024-01-24

我有两个divdiva and divb。它们的高度是固定的30px。我想将它们显示在一行中,一个接一个。这可以通过给它们宽度来完成10% and 90%分别由float: left。这很好用。但我给了他们一个边框1 px这会扰乱计算。我给第二个 div 的宽度为88%并且正在工作。但该 div 后面有一个空格。

我希望两个 div 显示在一行中。页面重新调整大小,我希望 div 填充空间,这样我就不能给它们固定的宽度。第一个div可能被赋予固定宽度,因为我只是想要它150 px宽的。但第二个 div 必须更宽才能填充空间。

我得到的是这个;

我想要这个:

Here http://jsfiddle.net/blasteralfred/76Raj/是小提琴。


Add a width: 100%到正文并指定float: left;在 div1 上并删除float: left;在 div2 上。

如果您在子元素上使用百分比宽度或高度,则还必须在父元素或容器元素上指定百分比宽度或高度。

那应该解决它! :)

在这里看到这个小提琴 http://jsfiddle.net/76Raj/3/

祝你好运!

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

在单行填充空间中显示两个 div - CSS 的相关文章

  • 仅 IE9_有时_会忽略

    我们正在开发一个大量使用 这是典型的 TYPO3 网站 该网站是在子目录中开发的 稍后将被重新定位到顶级目录 因此我们无法轻易删除 我们的客户告诉我们 有时当她浏览新页面时 她得到的页面内容没有应用布局 我们对此进行了调试 仅在 IE9 中
  • 如何在数据表中colspan rowspan?

    I am trying to use colspan and rowspan attributes with jQuery Datatables where a product sku can span 2 rows and a week
  • 如何在 PHP 的 HTML 页面中显示错误消息?

    我有以下登录表单 login php 其中要求输入用户名和密码
  • 更改元素的顺序

    我正在创建一个浮动宽度的网站 用户在智能手机上使用从全高清分辨率到约 600 像素的屏幕 这似乎是一个不错的主意 这就带来了一个非常有趣的问题 当用户使用比最佳分辨率更小的分辨率时 页面的高度会增加很多 这意味着更改某些元素 例如某些图像
  • 使用 highcharts 时,为什么 Bootstrap 选项卡显示宽度不正确的选项卡窗格 div?

    因此 我正在使用 Twitter 的 Bootstrap 创建一个包含选项卡式内容的页面 但我的起始活动 div 的内容始终与其他选项卡的内容不同 例如 我在不同的选项卡中使用 highcharts js 放入图表 但活动选项卡始终显示正确
  • 先按行再按列布局 div

    我有一个容器div and 3 div里面如下 div div 1 div div 2 div div 3 div div 不知道每一个的内容div内部 但它们的高度和宽度是可变的 集装箱的高度由最高的决定div inside 我想展示这些
  • 如何消除 HTML 内容周围的边距?

    以下 HTML 显示正常 div style width 100px height 100px background red div Hello div div
  • jQuery - 如何从 div > p 获取文本

    如何从 div 类中获取主题名称 div class subject img src image eng jpg p English p div div class subject img src image bio jpg p Biolo
  • 我如何能够以两行显示标题,并且每行的字体大小不同?

    我正在使用 Google Chart API 创建时间线图 并希望将图的标题修改为两行 问题 我如何能够显示具有不同字体大小的两线图表标题 电流输出 理想输出 相关研究 我唯一能找到的是有人试图用饼图来做到这一点 但我尝试了但无法使其发挥作
  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 悬停此元素时隐藏元素后的伪元素

    我的菜单垂直放置在页面左侧和菜单之间 li 我有一个 after那是一个分隔符 我想要的是当我悬停元素本身 如果它是第一个元素 时隐藏 after 元素 或者当它是中间元素时隐藏上面和底部的元素 如果它是最后一个子元素 则隐藏 after前
  • 将图像作为框架放置在 iframe 周围?

    我有一个网站尝试以移动格式显示 但在宽屏幕上 我确信 iframe 是正确的选择 我正在尝试将 iframe 加载到 iPhone 的图像中 你可以看一个例子here http webfro gs south tour iframe tes
  • 最大宽度调整以适应文本?

    不是最好的标题 但无论如何 我有一个元素max width和一些文字 如果文本长度超过一行所能容纳的长度 我会得到以下结果 My text here hello everyone 换句话说 它占据了完整的最大宽度 但由于单词向下移动 右侧有
  • 如何选择具有“A”类但不具有“B”类的 div?

    我有一些 div div class A Target div div class A B NotMyTarget div div class A C NotMyTarget div div class A D NotMyTarget di
  • Jquery 数据表列总和

    我只是参考一下这个链接 https datatables net examples advanced init footer callback html了解如何获取 jquery 数据表中的列总计 但我已经完成了一半的项目 我在html页面
  • php - 解析html页面

    div divbox div p para1 p p para2 p p para3 p table class table tr td td tr table p para4 p p para5 p 有人可以告诉我如何解析这个 html
  • 不可勾选的单选按钮与专有的复选框

    从 UI 角度来看 是拥有一组具有取消选中功能的单选按钮更好 还是拥有一组独占的复选框 意味着一次只能选中一个 更好 Update 我没想到对此会有如此负面的反应 如果我给出一个更接近其使用方式的示例 也许会有所帮助 我有一个充满数据绑定内
  • 图像背景不透明度不影响边框

    如何设置背景不透明度而不影响边框线不透明度 我找到的解决方案没有帮助 div class selected img src assets img image product 1 thumbnail jpg alt product 1 thu
  • 表格行未扩展到全宽

    我有一个表格 当我将表格的宽度设置为 100 并将表格行的宽度设置为 100 时 没有任何反应或宽度发生变化 Table Normal position relative display block margin 10px auto pad
  • 在 Nexus 7 2013 上更改方向时 CSS 媒体查询不起作用

    我目前正在我的笔记本电脑 台式电脑和 Nexus 7 2013 上测试 CSS 媒体查询 除了 Nexus 7 之外 它们在台式机和笔记本电脑上都运行良好 当我更改方向时 除非刷新页面 否则样式不会应用 例如 以纵向模式握住设备时 页面正常

随机推荐

  • 来电显示检测:不适用于某些手机

    当有人打电话时 我使用以下方法来检测来电显示 在表单加载时我设置以下代码 this serialPort1 PortName COM3 this serialPort1 BaudRate 9600 this serialPort1 Data
  • mysql UPDATE 比 INSERT INTO 快吗?

    这更多的是一个理论问题 如果我运行 50 000 个插入新行的查询和 50 000 个更新这些行的查询 哪一个将花费更少的时间 插入会更快 因为使用更新 您需要首先搜索要更新的记录 然后执行更新 尽管这似乎不是一个有效的比较 因为您永远无法
  • 在 R parallel::mcparallel 中,是否可以限制任一时间使用的核心数量?

    在 R 中 mcparallel 函数在parallel每次调用包时 它都会将新任务分叉给工作人员 例如 如果我的机器有 N 个 物理 核心 并且我分叉了 2N 个任务 那么每个核心都会开始运行两个任务 这是不可取的 我宁愿能够开始在 N
  • 在 React Native 中创建自定义底部选项卡导航器

    大家好 我想在 React Native 中创建时尚且自定义的底部选项卡导航 任何人都可以知道如何创建上面提到的内容 const customTabBarStyle activeTintColor 0091EA inactiveTintCo
  • 如何构建 libjpeg 9b 的 DLL 版本?

    我想构建 libjpeg 9b 的 DLL 版本 根据文件here https msdn microsoft com en us library ms235636 aspx 看来我们需要添加一个预处理器 declspec dllexport
  • IE9 的foreignObject 的替代品

    我真的很喜欢foreignObject通过svg显示HTML区域 但今天我发现它在IE9中不起作用 为什么我不惊讶 好的 所以我正在寻找一个适用于 IE9 的替代方案 但这似乎很困难 使用foreignObject 来显示多个HTML 元素
  • WordPress插件翻译问题

    我用 poedit 翻译了我的插件 它在本地主机上运行良好 在新的 WordPress 安装上 但是当我将插件上传到服务器上的现有站点上时 一些俄语字符丢失了 相反 我得到的是拉丁文 我用 utf8 编码了 poedite 文件 在标头中我
  • 无法使用 IOptionsMonitor 检测 ASP.NET Core 中的更改

    我正在开发 Asp Net Core 应用程序 我想在运行应用程序后更改配置设置 我正在使用 IOptionsMonitor 但它没有检测到更改 在 Startup cs gt Configuration 方法中我有 services Co
  • 如何在haskell中输入整数? (在控制台输入)

    如何在控制台中输入整数 将其存储在变量中 然后将其作为我创建的函数的参数传递 到目前为止 为了使其有效 我必须执行以下操作 在最后一行中 您可以看到我如何应用该函数 我想要做的是通过控制台请求变量作为整数应用于函数 然后打印结果 mayor
  • tableView: cellForRowAtIndexPath: 不仅为可见单元格调用?

    我有一个带有部分的 tableView 可以打开和关闭 因此 当我点击一个部分将其打开时 它会被单元格填满并且 UITableViewCell tableView UITableView tableView cellForRowAtInde
  • 显示:无不适用于选项

    Demo here http jsfiddle net Wener WC9yy HTML display none b not works b the hidden can b not select b br
  • Grunt 错误:找不到模块“time-grunt”

    我尝试安装 time grunt 本地和全局 清除 npm 缓存 更新 npm 但没有任何帮助 我得到 Loading Gruntfile js tasks ERROR Error Cannot find module time grunt
  • 错误:“TypeError:hidden_​​tag() 缺少 1 个必需的位置参数:'self'” 在 Flask、python 中

    我一直在创建一个基于论坛的学习系统 类似于评估项目的堆栈溢出 我对 Flask 相当陌生 但我相信我对 Python 有很好的了解 我一直在关注Flask 教程并使其适应我的项目 每当我尝试访问名为 adduser 的页面 带有用于添加用户
  • 如何在.NET中以编程方式密码保护pdf?

    我需要使用 C 中的密码以编程方式保护 PDF 文件 同一个PDF文件必须以不同的名称和不同的密码保存 有谁知道这个方法 请不要使用昂贵的工具 可以使用以下方法完成锐文 http itextpdf com using var input n
  • Lerna bootstrap 不链接本地依赖项?

    使用 lerna 和本地依赖项的正确方法是什么 我已经在 mono 存储库中配置了两个模块 以将 lerna 与本地依赖项一起使用 我期望 lerna bootstrap lerna run test 足以下载所有外部依赖项 链接本地依赖项
  • 从音频获取对数字节频率数据

    我之前问过一个与此类似的问题 但它没有解决我的问题 并且解释得不好 这次我制作了插图 希望能更好地解释 我的音频播放器有一个简单的频谱分析仪 频率存储在一个数组中 该数组在每次更新时都会更新requestAnimationFrame 数组看
  • 在C中嵌入python,未定义符号:PyExc_ImportError

    我正在尝试为 Audacious Media Player 编写一个加载 python 模块的插件 python嵌入代码来自python 2 6来源 嵌入 演示 这可以使用命令行进行编译 gcc o demo demo c lpython2
  • 使用全局调度队列时,为什么 NSURLConnection 委托方法不会被调用?

    当我执行以下操作时 dispatch async dispatch get global queue DISPATCH QUEUE PRIORITY HIGH NULL create NSURLRequest create NSURLCon
  • vscode 扩展中上下文菜单项的子菜单

    我看到很多 github 问题似乎表明 在 2020 年 9 月添加了添加子菜单的功能 当我们单击自定义上下文菜单项 例如在资源管理器 上下文中 时 该子菜单会下拉 但我找不到它在扩展文档中 有人可以指点我吗 谢谢 尼勒什 语法 contr
  • 在单行填充空间中显示两个 div - CSS

    我有两个divdiva and divb 它们的高度是固定的30px 我想将它们显示在一行中 一个接一个 这可以通过给它们宽度来完成10 and 90 分别由float left 这很好用 但我给了他们一个边框1 px这会扰乱计算 我给第二