Menu icon Foundation
Foundation .push and .pull class in grid

Hi what is .pull and .push class in foundation grid am not clear with the documentation provide for it.

http://foundation.zurb.com/docs/v/4.3.2/components/grid.html

Hi what is .pull and .push class in foundation grid am not clear with the documentation provide for it.

http://foundation.zurb.com/docs/v/4.3.2/components/grid.html

grid

Hi what is .pull and .push class in foundation grid am not clear with the documentation provide for it.

http://foundation.zurb.com/docs/v/4.3.2/components/grid.html

Hi what is .pull and .push class in foundation grid am not clear with the documentation provide for it.

http://foundation.zurb.com/docs/v/4.3.2/components/grid.html

Steve Adams about 6 years ago

.push and .pull shift the column left or right in the grid. Say you had a left sidebar on the desktop screen size, on the mobile size you would not want it to appear above the main content. You could use push on the sidebar and pull on the main content to effectively make the sidebar occur below the content on the mobile size.

Another common use for this is to include the primary content higher in the html for seo, and then to use .push and .pull to alter how the content displays. This way you can have a sidebar on the left that is actually below the primary content in the markup.

Bjarni Wark about 4 years ago

Is there a way to remove all .pull and .push classes from getting output in the final CSS file?