react-tooltip
react-tooltip copied to clipboard
Component has a built-in margin-top: -10px effecting page styling
I'm putting the <ReactTooltip/>
component in my root layout for a Gatsby site, so I can use tooltips on any page of my site using that layout (hopefully irrelevant to this problem). The problem is, I notice that this component seemingly has a built-in margin-top: -10px
CSS rule when it is rendered to the page?!
Obviously, this will cause style issues on any page it is included in. How can I get rid of this pesky -10px margin-top
rule?
happening to me as well, the result is the bottom of the tooltip is pointing 10px lower...
https://github.com/wwayne/react-tooltip/blob/f08e999e814dc76ceb645bc11b0fc782800e38a9/src/decorators/styler.js#L38
you can use something like
&.place-top {
margin-top: -6px !important;
}
to patch it it