add this to your table in css:

#yourTable{
  border-collapse: collapse;
}

Looks like it’s a border-spacing CSS property set to 1 or so pixels on your table element.

You need to inspect the table and child td and th elements in Chrome or whichever browser’s developer tools, and see what CSS styles are attached to those elements.

Specifically, you’re checking the table element for border-spacing (as Pete mentions above) with border-collapse set to ‘collapse‘, and then also double-check padding on the td/th elements, because it seems like you’ve some padding on those cells as well, from the screenshot.

table { 
   border-collapse: separate; /* for border-spacing to work */
   border-spacing: 0px; /* or however much space you want */
}

td, th { 
   /* or however much padding you want */
   padding-left: 0; 
   padding-right: 0;
}

If there’s already styles attached to these elements, you’ll need to find where they’re defined in the CRUD application framework you’re developing in to change them…or alternatively, create more specific CSS rules to target this table in your application, so the default values aren’t affected for other parts of your application, if that’s desired.

I am creating CRUD application and don’t know how to remove this left and right spaces coming in th and td

thanx in advance 🙂