CODEWITHSUNDEEP
cssbootstrap-4kendo-uikendo-grid
Jefferson
Jefferson

Reputation: 21

Kendo Grid Style like HTML table

I have two grids one is as basic html table and the other one is an kendo grid. I am trying to get the kendo grid to look like the html table. Is there a way to bypass the Kendo style and use the table style I have setup?

#resultTable th {
    cursor:pointer;
}

#resultTable .table th, #resultTable .table td {
    font-size: 14px;
    font-family: 'Open Sans';
    color: #484848;
}

#resultTable td > a {
    font-size: 14px;
    font-family: 'Open Sans';
    color: #2D4B69;
}

Demo https://jsfiddle.net/tjmcdevitt/pqda6v1y/13/

Upvotes: 0

Views: 1118

Answers (1)

jpllosa
jpllosa

Reputation: 2202

Yes, you can make both tables look the same but you'll need to make a lot of CSS changes. Add the example CSS below to your code. This should tell you where to start.

.k-grid-content .k-alt {
   background-color: transparent;
}

.k-grid-content .k-alt:hover {
   background-color: transparent;
}

.k-grid td,
.k-grid-header th.k-header,
div.k-grid-header,
.k-grid-header-wrap,
.k-widget {
  border-style: none;
}

With the CSS above, your Kendo grid is on its way to looking like your first table. I hope you get the point that you'll need to make more CSS changes but this should get you started.

Upvotes: 2

Related Questions