开发者

markup trouble about a div and a hole in its border

is it possible to have a <div style="border:1px solid red"> element (with some content, doesnt matter what is it exactly), and some element outside this div, which has a background:white property, and overlaps this div for 1 pixel at least? so that the border of div will not be of ideal rectangle form, but with a "hole"? and, preferrably, it is don开发者_JAVA百科e not using any absolute positioning. and it works in all major browsers..? please give me just some idea, or probably it won't work out at all


You can use a negative margin:

<div style="border:1px solid red; background: blue;">Stuff
    <div style="background: white; margin-left: -1px;"> Other Stuff</div>
</div>

http://jsfiddle.net/VzU8w/1/

And if the element is outside of the border: red element:

<div style="border:1px solid red; background: yellow;">Stuff</div>
<div style="background: white; margin-top: -1px;">Other Stuff</div>

http://jsfiddle.net/VzU8w/2/


If you don't use absolute positioning, use float and margin

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜