1

I am trying to get something like this blog which has:

But what I get is

(I am not trying to copy him, obviously I will change the image, etc.)

The borders are getting cut, because the width of the parent container (sidebar) is less than the width of the image. I google a lot, but all I found is overflow:visible, which somehow is still not working. Here is the output.

4

3 回答 3

1

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

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

于 2013-04-14T09:57:22.817 回答
1

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

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

于 2013-04-14T09:24:46.503 回答
1

只需两个简单的步骤：

  1. overflow: hidden;从中删除.sidebar .widget。
  2. 两边加负边距，.sidebar h2弥补宽度差。
于 2013-04-14T09:25:31.263 回答