score:3

Accepted answer

the tablecontainer is using paper ( with default elevation ) as its background, which is why it is displaying like a card. removing the component={paper} part will remove those classes.

use it like this

<tablecontainer >

score:3

add classname to tablecontainer component

 <tablecontainer classname={classes.tablecontainer} component={paper}>

add custom style to usestyle hook

const usestyles = makestyles({
  table: {
    minwidth: 650
  },
  tablecontainer: {
    boxshadow: "none"
  }
});

my method: in codesandbox, i opened devtools and inspected the component until i found the tag. because it was outermost layer, it seemed likely to be the tablecontainer component.

thus if you were to want to eliminate the bottom border, find which tag it's set and overwrite those components in the usestyle hook.


Related Query

More Query from same tag