search

nathansmith / unsemantic

Fluid grid for mobile, tablet, and desktop.
http://unsemantic.com
MIT License
1.38k stars 161 forks source link

Problems with Push and Pull classes #15

Closed bmounteer closed 11 years ago

bmounteer commented 11 years ago

I didn't see a previous ticket regarding this, but I tried following your documentation to re-arrange two columns on the mobile portion of my site, but all the push and pull seems to do is push the columns to the left or to the right. I cant get them to actually switch places. Any tips?

http://h1webdesign.com/cam-center

I am trying to make the center (middle column on mobile) the left (top column on mobile)

nathansmith commented 11 years ago

I'm not sure I follow. I only see one column here…

http://h1webdesign.com/cam-center/

But yeah, push and pull classes push (to the right) or pull (to the left) — Assuming a left-to-right language (like English).

Let's say you want a 25/75 split, you'd do…

<div class="grid-container">
  <div class="grid-75 push-25">
    I am on the right
  </div>
  <div class="grid-25 pull-75">
    I am on the left
  </div>
</div>

Note that you push isn't equal to pull. Push needs to be equal to the width of the element you're swapping places with (25). Pull, would be vice versa (75).