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

Horizontal grid lines

2 Answers 3361 Views
Grid
This is a migrated thread and some comments may be shown as answers.
alon
Top achievements
Rank 1
alon asked on 27 Jan 2014, 05:30 PM
How to display horizontal grid lines in Kendo UI grid?

The following works...any  elegant way to do it?

                        var kendoGrid = $(grid).data("kendoGrid");
                        var dataSource = kendoGrid.dataSource.data();

                        $(grid).find('table[role="grid"]').each(function() {
                            $(this).css("border-collapse", "collapse");
                        });

                        $.each(dataSource, function(i, row) {
                            $('tr[data-uid="' + row.uid + '"]').css("border-bottom", "1pt solid black");
                        });

Thanks, Alon

2 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 28 Jan 2014, 09:21 AM
Hi Alon,

In order to achieve the expected result you could use custom CSS rule and set border-bottom to the Grid cells. As an example: 
<style>
.k-grid tr td {
    border-bottom: 1px solid black;
}
</style>

Regards,
Iliana Nikolova
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Roby
Top achievements
Rank 1
answered on 09 Feb 2018, 09:24 PM

This is a little dated. 

<style>

.k-grid table tbody tr td{

border-bottom: 1px solid black;

}

</style>

Works with the latest version as of this posting date.

Tags
Grid
Asked by
alon
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Roby
Top achievements
Rank 1
Share this question
or