I wasn't sure how to best title this, but you're reading this now and hopefully I can better explain!
I have a button group with three buttons as such:
<div class="row"> <div class="small-12 column"> <div class="button-group"> <a class="button">Home</a> <a class="button">Previous</a> <a class="button">Next</a> </div> </div> </div>
On mobile/tablet, I'd like to have these buttons expanded, which is easy enough with the .expanded class and a media query.
My issue comes to the desktop view, where I'd like to have the Home button left-aligned and the Previous/Next buttons right-aligned. Here's an example:
I can achieve this very easily with the .float-right and .float-left classes, but it breaks the .expanded view on mobile/tablet.
Any ideas? Let me know if I can clarify. Thanks.