如何在父元素之外增加子元素的宽度答案

【问题标题】：How to increase width of child element beyond parent element如何在父元素之外增加子元素的宽度
【发布时间】：2013-04-06 12:35:34
【问题描述】：

我正在尝试获得类似 this blog 的内容：

但我得到的是

（我不是想抄袭他，显然我会改变图像等）

边框被剪掉了，因为父容器（侧边栏）的宽度小于图像的宽度。我用谷歌搜索了很多，但我发现的只是overflow:visible，不知何故仍然无法正常工作。这是output。

【问题讨论】：

标签： html css width parent-child

【解决方案1】：

尝试为所需元素的边距分配一个负值（例如，{margin-left: -20px }）。

不要忘记从父元素中移除溢出属性。

【讨论】：

【解决方案2】：

只需两个简单的步骤：

从.sidebar .widget 中删除overflow: hidden;。
在.sidebar h2两侧添加负边距，弥补宽度差异。

【讨论】：

实际上我已经完成了 ctrl+f 并将溢出：到处可见并删除溢出：隐藏在 .sidebar 中，所以 .siderbar.widget 被排除在外..非常感谢

【解决方案3】：

根据您的问题要求：您可以应用负边距值，例如margin-left: 15px; 并给出position: relative;，您可能还需要定义您的风格float: left;。

但或者，你可以定义你的父元素大于你的内容，例如，你的内容是 200 像素宽，你的左右图像是 15 像素 + 15 像素 = 30 像素，那么您的父元素应为 230 像素宽，现在通过将浮动值赋予所有三个图像的左侧来排列您的元素，并将内容宽度现在定义为 200 像素并将其居中提供margin: 0 auto; 以完成您的工作。

【讨论】：