css - 三个 div 并排,内部 div 宽度为 100%

标签 css html

两个外部 div 需要始终保持特定大小,因为中心 div 需要适合外部 div 之间的空间。有人能指出我正确的方向吗

最佳答案

这是使用前面提到的 html 的一个,尽管 jQuery 会收集两侧 div 的宽度并从容器中减去它们的宽度,然后将其分配给中心 div。我假设你需要它而不是百分比宽度,否则你可以只分配给它们。我还计算了左侧和右侧的宽度,以考虑您想要制作不同尺寸的可能性。这也不是响应式的,因此它会根据页面加载进行计算,但如果您调整屏幕大小,它就会崩溃。

$(document).ready(function () {
  var contWidth = $('#container').width();
  var leftWidth = $('.left').width();
  var rightWidth = $('.right').width();
  var finalWidth = contWidth - leftWidth - rightWidth;

  $('.content').width(finalWidth);
});

Here's a pen

关于css - 三个 div 并排,内部 div 宽度为 100%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24376781/

相关文章:

html - 为什么我的图像尺寸过大?

html - HTML LocalStorage 中的数据在其他窗口/选项卡中可用所需的时间

html - 无法找到声明此颜色的位置

CSS:不能使用 alpha 过滤器

html - CSS定位: absolute/relative overlay

javascript - 在 BookBlock.js 中播放和暂停

html - Qt - 获取托管在 Internet 上的网页的源代码(HTML 代码)

html - PNG图像在IE7中扭曲混浊

html - 如何在 vr 背景上有可滚动的 2d html 元素?

css - Chrome 在使用 appcache 时阻止对谷歌字体的请求