Rotator Styling

[Angie]

I've bumped up against an issue where in the basic rotator, my button on the right overlaps the content.  This happens only in Chrome, and it looks fine in all other browsers.  I haven't added any styling and I'm doing it on a blank test page.  So either the existing default styling is off, or there is some setting (like my widths?)  that I need to adjust.  Any help is appreciated.

 

 

<telerik:RadRotator RenderMode="Lightweight" ID="RadRotator1" OnItemDataBound="RadRotator1_ItemDataBound" runat="server" Width="930px" Height="200px"
                            RotatorType="Buttons"  ItemHeight="200" ItemWidth="896"   >
    <Items>
        <telerik:RadRotatorItem></telerik:RadRotatorItem>
    </Items>
     <ItemTemplate>
           test test test
    </ItemTemplate>
</telerik:RadRotator>

[Angie]

Updated to add that I've tried the styling solution and it doesn't work.

.RadRotator .rrButton.rrButtonRight
      {
          right: 0px !important;
      }

[Vessy]

Hi Angie,

We are aware of the reported issue in some of our previous releases but it has been working properly in or latest versions. Can you upgrade to the latest version of the controls and see whether this will resolve the problem (2016.1.225)?

Meanwhile, you can try fixing the problem temporary with a similar CSS style:

.RadRotator .rrButtonRight
{
    margin-right: -17px !important;
}

Regards,
Vessy
Telerik