Fieldset background colour

8 posts, 2 answers
  1. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 15 May 2009 Link to this post

    Hi,

    I've got an issue with the fieldset's that are rendered.  On IE7 I end up with a white background and on IE6 it's a light blue background (using the web20 skin).  Is there a way to force the css to render properly on one or the other browser so that they can be consistant?

    Regards,

    Jon
  2. Martin
    Admin
    Martin avatar
    585 posts

    Posted 16 May 2009 Link to this post

    Hi Jon,

    Actually, this is not an issue with RadFormDecorator, but rather a browser behavior.

    In brief - on some of the skins (including Web 2.0) we are using a .png semi-transparent image that as is in your case is not visible on a white background under IE7. The reason you see it in IE6 is that IE6 does not support png alpha channel (of course, there is a fix - the alpha image loader CSS filter, but unfortunately it is not applicable in that particular case) and you simply see the solid blue color background.

    Now, in order to help, I need you to tell me which case do you prefer - the one with blue background, and the transparent fieldsets. Once I know this, I will give you a solutuion.

    Kind regards,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 17 May 2009 Link to this post

    Hi Martin,

     

    Yes that PNG issue on IE6 is a real pain.  I can't believe that MS never patched that.

     

    Let's go with the blue option as I can then colour it white if necessary.  Also it then fits in better with the other sections of my site.

     

    Regards,

     

    Jon

  5. Answer
    Martin
    Admin
    Martin avatar
    585 posts

    Posted 19 May 2009 Link to this post

    Hi Jon,

    Please, find attached the new image for fieldset background. I changed it to .gif instead of .png, and referred as an external file. Now you can edit it with PhotoShop and give it a different color.

    Below is the CSS you need to override the skin settings:

    <style type="text/css">
    .rfdFieldset
    {
        background-image: url('FieldsetBgr.gif') !important;
    }
    </style>


    If you edit the image in PhotoShop, do not forget to set the color information of the file to RGB, as the original gif file is of Indexed Color. Otherwise the color you apply will not be the correct one. This could be done from the menu bar Image > Mode > RGB Color. Then you may select the color you need, and use the paint bucket tool to set the new color to the image. Once you are over and done choosing a color, you need to set the file as Indexed Color again (Image > Mode > Indexed Color) and save it.

    Best wishes,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 19 May 2009 Link to this post

    Superb, thanks very much Martin.

    I must admit that I'm kicking myself over the simplicity of the fix.  I think that I mucked up when I was trying to change the CSS of the fieldset rather than the named style...

    Thanks again,

    Regards,

    Jon
  7. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 09 Jul 2009 Link to this post

    Hi Martin,

    This issue came up again on the Q2 release.  It looks as though the style changed so the fix that worked before now fails.  I've got it working but using fieldset explicitly as below:
     
    fieldset  
    {  
        background-imageurl('FieldsetBgr.gif') !important;  

    Can you forsee any issues solving the problem this way?

    Regards,

    Jon
  8. Answer
    Martin
    Admin
    Martin avatar
    585 posts

    Posted 10 Jul 2009 Link to this post

    Hello Jon,

    When we developed the improvements of FormDecorator, one of our main goals was to make full use of the word "cascading" in CSS. In other words - in order to reduce the generated markup on the client and respectively the CSS code, we are now using CSS inheritance, rather than class names (where it is possible, of course). This is why the fix I gave you a couple of months ago has stopped working after the upgrade. The solution you've found is the correct one, and it shouldn't have negative impact at all.

    All the best,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  9. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 10 Jul 2009 Link to this post

    Thanks for that Martin,  all makes sense.  At least I can now remove one of the entries in the CSS. 

    Regards,

    Jon
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017