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

[Button] Unable to align Button alignment to the middle and to the right #614

Closed
matchatype opened this issue Oct 19, 2016 · 3 comments
Closed

Comments

@matchatype
Copy link

Docs state that you can vertically align your content within columns by using valign attribute, but it doesn't work with buttons. Additionally, I'm not able to align buttons to the right.

Besides the normal flow, the only option to position a button is by using the center tag.

@cossssmin
Copy link

cossssmin commented Oct 19, 2016

Yeah, the <button> was somehow forgotten. There's already a PR merged into Inky (foundation/inky@11805b4), but the 2.2.2 Foundation for Emails release is pending, so you won't get it through an npm update or install.

Not sure what the plans are for the next release, but I hope it'll be soon, as there were many, very useful PRs merged over the past month or so.

@rafibomb
Copy link
Member

rafibomb commented Nov 1, 2016

The valign attribute goes on the container wrapping the content - like the column. You need 2.1+ to get this.

Working example:

<row>
    <columns small="6" large="3" valign="middle">
      <button href="#" class="align-right">Button</button>
    </columns>

CSS

table.button.align-right {
  display: inline-block;
  float: right;
}

@rafibomb
Copy link
Member

rafibomb commented Nov 1, 2016

2.2 is set to release 11/10. You can follow releases here: https://github.com/zurb/foundation-emails/wiki/Roadmap

Since foundation/inky#61 is in that resolves the 2nd part of your question, we'll close this here.

@rafibomb rafibomb closed this as completed Nov 1, 2016
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

No branches or pull requests

3 participants