Inline styles on buttons are lost

react-bootstrap / react-router-bootstrap

Integration between React Router and React-Bootstrap

Apache License 2.0

1.69k stars 158 forks source link

Inline styles on buttons are lost #238

Open davidworkman9 opened 6 years ago

davidworkman9 commented 6 years ago

Style attributes attached to buttons are lost when inside a LinkContainer

<LinkContainer to="/place">
    <Button
        className="btn btn-success"
        style={{ position: 'absolute', top: 0 }}
    >
        Go To Place
    </Button>
</LinkContainer>

Results in:

<h3 class="text-center">Projects</h3>
<a href="/place" class="btn btn-success btn btn-default">Go To Place</a>

varrtto commented 5 years ago

I have the same issue, but with Cards. The problem is inline style is necessary for Cards, since the width is set with: style={{width: '16rem}} After nesting the Card in a LinkContainer the inline style is lost.

v12 commented 5 years ago

It does look like a bug but as a workaround you can specify the style that needs to be applied to your child element in LinkContainer - it's populated down to your component that's being wrapped. Thanks for the report.