How to remove the mantine default table line

Question

I want to remove the default line in mantine table, i try to change it using css but it is not a border nor outline. please help me :((( enter image description here

Answer 1

 <tr key={element.name + element.price}>
  <td style={{ border: 0 }}>
    <Flex direction="column">
      <Text fw={600}>{element.name}</Text>
      <Text>{element.address}</Text>
    </Flex>
  </td>
  <td style={{ border: 0 }}>
    <Text fw={600}>₹{element.price}</Text>
  </td>
  <td style={{ border: 0 }}>
    <Badge>{element.status}</Badge>
  </td>
</tr>

you can apply border 0 on the td or you can select the every td element that is inside the tr and give border 0 do the td with css child selector.

mantine table without border bottom