Fieldset Round Corner and Padding Issues in IE, Internet Explorer

[Vargis]

Hi
We have facing rounded corner issues and padding in internet explorer.
Also legend color is different both IE and Moz ..not checked in Chrome yet. :(
Please refer the attachment.

[Danail Vasilev]

Hi Vargis,

RadFormDecorator creates a table in older browsers that do not support CSS 3(e.g. IE7/IE8), in order to simulate the rounded corners, while in new browsers it uses CSS 3. That is why there is some inconsistency in the padding of the elements that are inside of the FieldSet under older and newer browsers. You can set padding of the elements that are inside of the FieldSet, so that they fit in older browsers as well.

Regarding the FieldSet issue under IE8 - this may result due to the set of a global CSS rule applied to TD/TR tag. I suggest that you set TD/TR rules for the particular table not the whole page.

Regarding the inconsistency of the legend color - I was not able to reproduce it. Could you test our online demos and then tell us what is the problematic one and the applied skin. Otherwise, if the issue is related to RadFormDecorator, you can open a support ticket and send us a runnable project, so we can do an investigation locally.

I also advise that you make sure your browse is not zoomed, because this can also break pages.

All the best,
Danail Vasilev
the Telerik team

[Vargis]

Then can you please specify what CSS property is to set for the particular table/td.

[Danail Vasilev]

Hi Vargis,

I am guessing that you might have applied some global CSS rules to Table/TR/TD elements, that can affect the proper rendering of the rounded corners under IE8.

From the provided screenshot I believe there is a padding or margin CSS rule applied to one of above mentioned HTML elements. I would suggest you to examine the custom CSS registered on the page and remove any margin/padding applied to table, td, tr, fieldset global selectors.

If the above suggestion does not fix the issue we will need a runnable example so we can examine and debug it locally, so could you open a formal support ticket and provide an example.

All the best,
Danail Vasilev
the Telerik team

[Vargis]

Actually fieldset have a nice padding in all browsers except in IE.
Also except IE fieldset have full width. So we added width for table and padding for fieldset respectively.

table{border-collapse:collapse; width:100%}
fieldset {padding:3px 5px; margin:0}
legend {font-weight:bold!important; font-size:11px!important}

Here I am attaching a screen shot of the page
without using the above Global CSS.

In this you can see the RadGrid Horizontal Scroll is not aligned also.

[Vargis]

Removed table Global CSS properties

Just add this for enhance legend
legend {font-weight:bold!important; font-size:11px!important}

Still facing white space issue in IE8
You can see that white space is only in fieldset which have no legend.
Please refer the attachments. Also no proper padding in left side.

[Danail Vasilev]

Hi Vargis,

Regarding the improper padding of the decorated Fieldset under IE8/IE7, you can fix it by applying the following CSS rules:

<style type="text/css">
    /* IE8 CSS hack */
    @media \0screen {
        .rfdRoundedContent fieldset {padding: 0 10px 10px 10px;}
    }

     /* IE6 and IE7 CSS hack */
    .rfdRoundedContent fieldset {*padding: 0 10px 10px 10px;}
</style>

Regarding the white space issue in IE8, I could not reproduce it - you can watch a short video with the test here. Could you try to reproduce this issue with the VS sample I have attached in the archive and then tell us what changes you have done?

Could you also confirm the version of RadControls you are using?

Kind regards,
Danail Vasilev
the Telerik team

[Vargis]

How beautiful in Mozilla Firefox .......

Hi Boss
I had added the CSS mentioned above but still have problem in IE8.
Please see the attachments

Hi Danail,

Please give me a solution for IE ...Here things are going so worsed please respond
I had attached IE8 rendering and Mozilla

It is mainly occuring when i add some div inside this fieldset (Div Class having float property).