开发者

CSS3: Transparent Rounded Corner Problem

开发者 https://www.devze.com 2023-01-13 06:52 出处:网络
Site is located here: CLICK TO VIEW THE WEBSITE Here is an image of the problem: As you can see, using CSS3 border-radius, and background: transparent I was able to make what looks like a \"cutout\

Site is located here: CLICK TO VIEW THE WEBSITE

Here is an image of the problem:

CSS3: Transparent Rounded Corner Problem

As you can see, using CSS3 border-radius, and background: transparent I was able to make what looks like a "cutout" from the div. The problem should be obvious that the corners are transparent as well.

I know I could just use an image and problem would be solved, but I want to use CSS3. I think there is probably some ingenious way to get around this problem, but I am not thinking of it. I do want to note that I am using css3pie.com to al开发者_高级运维low IE6 through IE8 CSS3 functionality.


This is a bit hacky

This rules apply to the p tag

-webkit-box-shadow: #A3AFC6 0px -4px 0px 3px;


This worked for me in the developer toolbar in Chrome...

On div.middle_bg set the height to 85px. Then set the background on the p tag inside it.

0

精彩评论

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