No border showing

[yash1307raj]

Decision Table

• [X] My issue does not look like “The HTML attribute 'xxx' is ignored” (unless we claim support for it)
• [X] My issue does not look like “The HTML element <yyy> is not rendered”

Good Faith Declaration

• [X] I have read the HELP document here: https://git.io/JBi6R
• [X] I have read the CONTRIBUTING document here: https://git.io/JJ0Pg
• [X] I have confirmed that this bug has not been reported yet

Description

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
    <thead>
        <tr>
            <th scope="col">R1C1</th>
            <th scope="col">R1C2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>R2C1</td>
            <td>R2C2</td>
        </tr>
        <tr>
            <td>R3C1</td>
            <td>R3C2</td>
        </tr>
    </tbody>
</table>

React Native Information

all are latest

RNRH Version

"^6.3.3",

Tested Platforms

• [X] Android
• [ ] iOS
• [ ] Web
• [ ] MacOS
• [ ] Windows

Reproduction Platforms

• [X] Android
• [ ] iOS
• [ ] Web
• [ ] MacOS
• [ ] Windows

Minimal, Reproducible Example

Additional Notes

No response

[jsamr]

I think that would be best described as a "support border attribute" feature request! I've added the request here: https://native-html.canny.io/features/p/support-table-border-attribute

[kimho]

I solved the problem using the trick below.

<RenderHtml
   tagsStyles={contentHtmlStyles}
   ...
/>

const contentHtmlStyles = StyleSheet.create({
   table: {
    borderTopWidth:1,
    borderLeftWidth:1,
    borderColor:"#ccc",
    marginBottom: 7
  },
  tr: {
    borderBottomWidth: 1,
    borderColor: "#ccc",
  },
  td: {
    borderRightWidth:1,
    borderColor:"#ccc",
    padding: 5
  },
});