Skip to content
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

Sizing Convenience Methods #62

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Sizing Convenience Methods #62

wants to merge 5 commits into from

Conversation

ianstormtaylor
Copy link
Contributor

Opening this again—sorry for the confusion/emails—because I had requested it from master instead of its feature branch and it was causing me headaches elsewhere.

They let you set vertical and horizontal values for all three in one line instead of always setting "top" and "bottom" or "left" and "right" values.
They let you set vertical and horizontal values for all three in one line instead of always setting "top" and "bottom" or "left" and "right" values.
@notslang
Copy link
Collaborator

very interesting, thanks for making this! the only concerns I have are:

  • "vertical" and "horizontal" are pretty long words, maybe "v" and "h" should be added as aliases?
  • a few of these commits should be squashed together

and, of course:

  • it needs tests!

@tj
Copy link
Collaborator

tj commented Jun 18, 2013

personally I find this one a bit unnecessary, just because everyone is really used to padding: Y X etc. Maybe padding-y: 5px etc if anything? not sure

@notslang
Copy link
Collaborator

I've actually never bothered to memorize the padding shorthands with 3 or 4 args... even the one with 2 args used to trip me up when I first started CSS. So I would make use of this... it's a bit more clear than padding X X X X

@tj
Copy link
Collaborator

tj commented Jun 18, 2013

i find most css stuff a bit counter-intuitive since people usually talk about dimensions x/y width/height, but css stuff is always clockwise from the top padding: top right bottom left, padding: y x, not too bad if you remember that

@vendethiel
Copy link

I think we don't really need it with padding-left etc

@kizu
Copy link
Member

kizu commented Jun 25, 2013

padding-x and padding-y would fit so much better along with already existent things like overflow-x etc.

Why this would be helpful: while you can use a shorthands like padding: 0 X, this would override any vertical paddings that were before.

So,

.foo
  padding-top: 10px;

.bar
  padding-x: 20px;

aplied to <div class="foo bar"></div> would be different from the padding: 0 20px on .bar here.

So, I'm for renaming the props to -x and -y and then merging it: long names are making the shortcuts not that shorts, while I found times when I wanted such thing in my code.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants