DataPager icons - Wrong icons on hoover

[Philippe]

Hello,

I have a simple radDataPager with the Bootstrap skin.

The first, previous, next and last icons are wrongly displayed when the mouse hoovers the buttons (see the four pictures).

The markup:

<div class="SearchPagerContainer">
  <telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="lvArticles" PageSize="24" Skin="Bootstrap" Style="margin-left: 3px; margin-top: 2px" OnInit="RadDataPager1_Init">

    <Fields>
      <telerik:RadDataPagerButtonField FieldType="FirstPrev" />
      <telerik:RadDataPagerButtonField FieldType="Numeric" PageButtonCount="4"/>
      <telerik:RadDataPagerButtonField FieldType="NextLast" />
      <telerik:RadDataPagerPageSizeField PageSizeComboWidth="70" PageSizes="12;24;48" PageSizeText="# par page: " HorizontalPosition="NoFloat" />
    </Fields>
  </telerik:RadDataPager>
</div>

It seems to be basic, but it does not work.

Any idea ?

Philippe

[Doncho]

Hi Philippe,

Thank you for the screenshots!

Probable causes for the demonstrated appearance problem could be RenderMode conflict or Enabled Compatibility mode of InternetExplorer.

I would suggest you review the RenderMode Conflict ("mixed render modes") section and ensure there are no mixed render modes on the page.

If the reported issue appears on InternetExplorer only, make sure the compatibility mode is disabled as per the instructions in Disable the Compatibility View mode of Internet Explorer article

In case these are not helping, please try the suggested solutions for common Skin issues described in the Incorrect or Distorted Appearance section in our Skins Troubleshooting article.

Looking forward to your feedback.

Kind regards,
Doncho
Progress Telerik