What is the best way to center a button group?
Friday, December 27, 2013 at 8:23 PM EST
This post has been closed. No new replies can be added.
The method below is fairly straightforward:
<div class="large-6 large-centered columns">
<ul class="button-group even-3">
<li><a href="#" class="button">Button 1</a></li>
<li><a href="#" class="button">Button 2</a></li>
<li><a href="#" class="button">Button 3</a></li>
How did you even know about the even classes? I searched through the docs to see where I missed then but they are no where to be found!
It's in the Grid section: http://foundation.zurb.com/docs/components/grid.html
You say that the "even" class is mentioned in the Grid section? But when I surf to the link you've posed in your comment, I don't see anything mentioned about the "even" classes.
It is mentioned on the "Button Groups" page, under the section "Advanced".
Adding an even class with the specified number of buttons in that group allows the button group to evenly expand to the edges of its container. With Foundation classes you can use the even class up to even-8.
Ya you are right. A lot has changed since this post was created :)
Create an Account
Get up to speed FAST, learn straight from the experts who built Foundation.
Learn Foundation from the creators in our interactive online webinars which will keep you up to date with the latest trends and skills needed to win your projects.
Or if you prefer, contact the Foundation Team at [email protected] or (408) 341-0600 x635