Skip to content

Using css={twitems-stretch} translates to "align-items:flex-stretch" (which is wrong) #48

Description

@adrianjacob

Hi,

Hope I am submitting this in the right repo (assume it wasnt a tailwind default thing as havent seen this issue outside of css-in-js).

When I use the class 'items-stretch' it translates in css-in-js as

    -webkit-align-items: flex-stretch;
    -webkit-box-align: flex-stretch;
    -ms-flex-align: flex-stretch;
    align-items: flex-stretch;

The 'flex-' should not be there. It should just be align-items:stretch

This issue seemingly only affects this class. Using the other align items classes on tailwind work fine. Very odd.

Any thoughts?

My setup

"dependencies": {
    "@contentful/rich-text-plain-text-renderer": "^13.4.0",
    "@contentful/rich-text-react-renderer": "^13.4.0",
    "@contentful/rich-text-types": "^13.4.0",
    "babel-plugin-styled-components": "^1.10.6",
    "gatsby": "^2.13.73",
    "gatsby-cli": "^2.7.56",
    "gatsby-image": "^2.2.16",
    "gatsby-plugin-manifest": "^2.2.11",
    "gatsby-plugin-react-helmet": "^3.1.5",
    "gatsby-plugin-sharp": "^2.2.19",
    "gatsby-plugin-styled-components": "^3.1.11",
    "gatsby-source-contentful": "^2.1.32",
    "gatsby-source-filesystem": "^2.1.19",
    "gatsby-transformer-sharp": "^2.2.13",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-helmet": "^5.2.1",
    "reading-time": "^1.2.0",
    "styled-components": "^4.4.1",
    "styled-normalize": "^8.0.6",
    "tailwindcss-transforms": "^2.2.0",
    "tailwindcss-transitions": "^2.1.0"
  },
  "devDependencies": {
    "prettier": "^1.18.2",
    "tailwind.macro": "^1.0.0-alpha.10"
  },

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions