search

rebassjs / grid

This package has moved and renamed
https://rebassjs.org/reflexbox
MIT License
2.04k stars 96 forks source link

Using 'is' on <Box> component doesn't render expected HTML #150

Closed coreybruyere closed 5 years ago

coreybruyere commented 6 years ago

Using <Box> component like so:

const FeatureGridListItem = styled(Box)`
  text-align: left;
`;

<FeatureGridListItem
   width={[1, 1, 1 / 2]}
   is="li"
 >
  ...
</FeatureGridListItem>

And I'm not receiving any of the expected CSS that I should be receiving from the <Box> component

jxnblk commented 6 years ago

Thanks, can you list the versions of @rebass/grid and styled-components that you're using?

daveyheuser commented 6 years ago

I'm experiencing the same (the is not being passed on). The version displayed in my package.json is "@rebass/grid": "^6.0.0-0",. The component renders just fine when I don't use is, and FWIW I'm using this with Gatsbyjs.

jxnblk commented 6 years ago

This is a change with v6, I've updated the readme to reflect that change here: https://github.com/rebassjs/grid#changing-the-html-element

daveyheuser commented 6 years ago

Thanks for the prompt reply, upgrading to styled components v4 fixed it for me!