Firefox 5.0 and RadTooltip problem

4 posts, 1 answers
  1. LevizBB
    LevizBB avatar
    8 posts
    Member since:
    Jun 2011

    Posted 13 Jul 2011 Link to this post

    Hello,

    I have a problem with the RadToolTip design (CSS) on the Firefox browser.

    I'm trying to overwrite the default CSS but Firefox style keep the default style.

    Here is the CSS I'm trying to overwrite :

    div.RadToolTip table.rtWrapper td.rtWrapperRightMiddle{
        background-position: -2px 0;
    }
     
    div.RadToolTip table.rtWrapper td.rtWrapperBottomLeft {
        background-position: 0 -58px;
    }
     
    div.RadToolTip table.rtWrapper td.rtWrapperBottomCenter {
        background-position: 0 -114px;
    }
     
    div.RadToolTip table.rtWrapper td.rtWrapperBottomRight {
        background-position: right -58px;
    }

    In the attached picture below, you will see the problem.

    Thanks for your help.
  2. Answer
    Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 13 Jul 2011 Link to this post

    Hello Visar,

    The RadToolTip's skin seems fine on my end in FF5 (as in all other major browsers), as you can see from the attached screenshot. If it looks like the screenshot on your end please make sure that you do not have global CSS selectors for elements such as tr, td, table, ul, li, span, a, etc in your custom CSS, as they could affect the ToolTip's skin and borders, which heavily rely on CSS and background images. If that is the case please make your selectors heavier so that they do not affect all elements on the page, for example by applying CSS classes. You can easily confirm if this is the reason by temporarily disabling all your custom CSS on the page.

    In case you, for some reason, wish to override the default CSS of the RadToolTip I would recommend adding the !importand modifier in your rules:
    div.RadToolTip table.rtWrapper td.rtWrapperRightMiddle
    {
        background-position: -2px 0 !important;
    }
      
    div.RadToolTip table.rtWrapper td.rtWrapperBottomLeft
    {
        background-position: 0 -58px !important;
    }
      
    div.RadToolTip table.rtWrapper td.rtWrapperBottomCenter
    {
        background-position: 0 -114px !important;
    }
      
    div.RadToolTip table.rtWrapper td.rtWrapperBottomRight
    {
        background-position: right -58px !important;
    }




    All the best,
    Marin
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. LevizBB
    LevizBB avatar
    8 posts
    Member since:
    Jun 2011

    Posted 13 Jul 2011 Link to this post

    Thanks for your answer.

    I have put the !Important as in your code.

    I don't know why it isn't working with Firefox.
    I tried to manipulate the CSS with Firebug without any result.

    Thanks again.
  5. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 13 Jul 2011 Link to this post

    Hello Visar,

    Please try clearing the browser's cache, temporary files, etc, you could also try rebuilding the project and/or restarting VS, the browser, the OS..the idea is to make sure that the page is loaded freshly.

    As for the inability to modify the CSS through FireBug - this is not an issue I have seen yet, but it seems that the firebug installation may be buggy, or some other add-on might be interfering. Please try disabling all add-ons, but firebug (I would also recommend uninstalling and installing it anew).


    All the best,
    Marin
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Back to Top