html - CSS 有助于在图像上定位销售横幅

Question

我正在尝试将此促销横幅放置在图像上。红色边框是一个固定宽度的 div，它的宽度与我需要的页面布局一样宽。不管图片有多大，我都需要留出这么宽的空间。

黑色边框是一个与图片一样宽的div，我试图在图片顶部的右上角显示促销横幅。

示例:http://jsfiddle.net/d5nxT/

我知道我的显示和位置有点乱。我只需要图像和销售范围具有相同的设置，除了销售范围向右浮动并且具有比图像更高的 z-index。

Answer 1

查看 fiddle 和演示:

fiddle :http://jsfiddle.net/d5nxT/2/

演示:http://jsfiddle.net/d5nxT/2/embedded/result/

float:right, z-index, position:relative, display:inline-block 都不是必需的。