This is a migrated thread and some comments may be shown as answers.

Misalignment of rows

1 Answer 10 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Ryann
Top achievements
Rank 1
Ryann asked on 09 Oct 2013, 01:39 PM

Hi,

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

Thanks,
Ryann.

1 Answer, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 1
answered on 09 Oct 2013, 01:45 PM
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
Tags
General Discussions
Asked by
Ryann
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 1
Share this question
or