Misalignment of rows

[Ryann]

Hi,

I am using row hover for my grid.But its causing the rows to misalign. please help me with a solution.

Thanks,
Ryann.

[Shinu]

Hi Ryann,

It's hard to identify the issue,can you try the following code snippet.If this doesn't help,please provide your full code snippet.

ASPX:

<telerik:RadGrid ID="myRadGrid" runat="server" >
  <ClientSettings EnableRowHoverStyle="true">
   <ClientEvents OnRowMouseOver="RowMouseOver" OnRowMouseOut="RowMouseOut" />
  </ClientSettings>
  <MasterTableView>
     <Columns>
      . . . . . .
     </Columns>
  </MasterTableView>
</telerik:RadGrid>

JS:

<script type="text/javascript">
    function RowMouseOver(sender, eventArgs) {
        $get(eventArgs.get_id()).className += " RowMouseOver";
    }
    function RowMouseOut(sender, eventArgs) {
        var row = $get(eventArgs.get_id());
        row.className = row.className.replace("RowMouseOver", "RowMouseOut");
    }
</script>

CSS:

<style type="text/css">
    div.RadGrid .rgHoveredRow
    {
        /* change the background colour for hovered rows */
        background: Red;
    }

    .RowMouseOver td
    {
        background-color: Red !important;
    }
    .RowMouseOut
    {
        background: inherit;
    }
</style>

Thanks,
Shinu