New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Treat columns property as a unitless number #10115

Merged
merged 1 commit into from Jul 11, 2017

Conversation

Projects
None yet
4 participants
@aweary
Member

aweary commented Jul 6, 2017

Resolves #10043

@aweary aweary referenced this pull request Jul 6, 2017

Closed

React 15.6.2 Umbrella #10040

6 of 12 tasks complete
@gaearon

This comment has been minimized.

Show comment
Hide comment
@gaearon

gaearon Jul 6, 2017

Member

Can't it also specify width? https://css-tricks.com/almanac/properties/c/columns/
Have you verified this is the right fix?

Member

gaearon commented Jul 6, 2017

Can't it also specify width? https://css-tricks.com/almanac/properties/c/columns/
Have you verified this is the right fix?

@aweary

This comment has been minimized.

Show comment
Hide comment
@aweary

aweary Jul 6, 2017

Member

@gaearon yes, it's a shorthand property like flex. If you provide only a number it's assumed you are setting column-count and column-width is defaulted to auto

<div style={{ columns: 2 }} />
// Renders `columns: auto 2`

If you provide an explicit pixel value it assumes you're setting the column-width and column-count defaults to auto.

<div style={{ columns: "320px" }} />
// Renders `columns: 320px auto`

Since it's already assumed that a single numerical value represents column-count we should be consistent with that by treating it as a unitless number.

Member

aweary commented Jul 6, 2017

@gaearon yes, it's a shorthand property like flex. If you provide only a number it's assumed you are setting column-count and column-width is defaulted to auto

<div style={{ columns: 2 }} />
// Renders `columns: auto 2`

If you provide an explicit pixel value it assumes you're setting the column-width and column-count defaults to auto.

<div style={{ columns: "320px" }} />
// Renders `columns: 320px auto`

Since it's already assumed that a single numerical value represents column-count we should be consistent with that by treating it as a unitless number.

@nhunzaker

This comment has been minimized.

Show comment
Hide comment
@nhunzaker

nhunzaker Jul 6, 2017

Collaborator

Flex box is a good reference point. I'd be in favor of matching it.

Collaborator

nhunzaker commented Jul 6, 2017

Flex box is a good reference point. I'd be in favor of matching it.

@gaearon

This comment has been minimized.

Show comment
Hide comment
@gaearon

gaearon Jul 6, 2017

Member

👍 Leaving this up to you folks

Member

gaearon commented Jul 6, 2017

👍 Leaving this up to you folks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment