ReactJS Griddle override inline style

Question

I am creating an application and I am using the ReactJS Griddle component. I am trying to create a custom row component but it keep applying an inline style like so:

<div class="myCustomRowClass" data-reactid="react_id" style="clear:both;display:table;width:100%">

I would need to override the style so I can set display: grid; . The reason for this is that I am using Semantic-Ui for the user interface, and when I do something like this:

<div class="ui four cards">
   <div class="ui card">
     /* content */
   </div>
   <div class="ui card">
     /* content */
   </div>
   /* etc... */
</div>

instead of display a grid of 4 card per row, it displays one card per row.

Is there a way I can override the style?

Help appreciated.

Answer 1

I have found the answer to this. I should have used customGridComponent instead of customRowComponent and render my data in the CustomGridComponent