I am using the rounded corners control on a panel control. I have the margin of the panel defined with CSS. This causes a gap the size of the margin setting between the panel and the Rounded Corner effect. Am I doing something wrong or is this a bug with the extender?

<JasonRCS> wrote in message news:1287524@forums.asp.net...

I am using the rounded corners control on a panel control. I have the margin of the panel defined with CSS. This causes a gap the size of the margin setting between the panel and the Rounded Corner effect. Am I doing something wrong or is this a bug with the extender?

---

http://forums.asp.net/thread/1287524.aspx

This ends up being a mutually exclusive situation unfortuntely.  If someone has an idea for a solution I am all ears.

The only way I know of doing the rounded corners without custom bitmaps is to add elements to the control.  Let's call them adornments.

So, you can either add the elements outside of the control you're targeting or inside.

If you add them outside it falls down quickly.  If you have any positioning set on the thing you are targeting (relative or absolute), then the adornments get left behind.  So that's a major problem.

If you add them inside the control (which is what we do), it generally works better, but there are combinations of styles that we can't handle, margin being one of them.

In most cases you can accomplish what you need to by composition - meaning if you wrap another div/panel around the outside of your object and apply the rounded cornders to that one or vice-versa you can make it do what you want.

Thank you both for your comments. I just wanted to make sure that is the way it is supposed to work. I will get by with using an embedded div for now.

I am not a JavaScript person, but would it be possible for the control to modify the border property of the element? This would allow the modification to be reside between the padding and margin attributes of an element. Just throwing ideas out there. I know the Mozilla browsers support a proprietary  attibute of moz-radius to do this with borders.

Thank you agian for your help!

Jason

Sorry for the extra junk at the bottom... Google Spell Check gone bad!

The modifications are just a bunch of added DIVs, so they can't live in that zone unfortunately.

If the embedded DIV trick works for you, stick with that.

Same problem here - although I have previously managed to set up CSS only rounded corners which do not suffer from this problem, so I'm going to compare and contrast with the extender, to see if I can fix it up.

 Should you happen to want a work-around in the meantime, e.g. my example, where I wanted "margin-top: 10px" on a div with rounded corners (so that there was a blank space between two divs which are one above the other), you can wrap an extra div around your panel-with-rounded-corners, and put the margin on that (extra) div - leaving the rounded corners as is.

 

Cheers,

 Matt

Hi,

Remove the height and width attributes from the target panel. These are added by default and raises havoc with the calculations for the rounded corner extender because the target panel will dynamically size if the content exceeds its bounds. That should work for ya!

Regards,

Rik C.