The QuickColumns stack was primarily built for ThemeFlood theme users, seeking to get multiple columns setup in the horizontal content containers, in themes like Flood, Ocean and Solstice. However it should work equally as well in many other RapidWeaver themes too.

Example

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus et erat ut lectus fermentum tincidunt. Donec sed leo risus. Sed ut eros mi, a pellentesque purus. Donec leo elit, facilisis euismod accumsan in, mollis vel massa. Donec at turpis massa, nec tincidunt erat. In venenatis dolor sem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam euismod egestas facilisis. Aenean vestibulum sapien nec libero imperdiet semper. In risus nulla, eleifend at pharetra sodales, consectetur non justo. Phasellus faucibus, leo eget blandit semper, augue felis ullamcorper lectus, vel luctus urna quam quis nunc. Nullam vel nibh sit amet felis tincidunt convallis eu nec purus. Sed tempor velit ut nulla pretium sodales. Quisque dapibus massa non velit elementum quis aliquam nibh pharetra. In arcu mauris, bibendum eget laoreet at, congue vitae tortor.

Aenean sed lacus vitae ante sagittis pellentesque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam mattis velit sed odio sollicitudin dapibus. Aenean pellentesque lectus quis quam hendrerit vel rhoncus augue facilisis. Aenean tempus malesuada augue vitae commodo. Etiam sed lorem dolor, et congue mauris. Nullam sit amet erat nisl, ac imperdiet dolor. Donec vel ligula odio. Maecenas pretium leo sit amet libero vulputate molestie in at arcu. Suspendisse potenti. Maecenas pellentesque, dolor id scelerisque vehicula, magna dolor luctus lectus, ut ornare lectus ipsum ut ligula. Aenean ante libero, consectetur vel ultricies quis, feugiat sed lorem. Aenean sollicitudin erat quis massa imperdiet et malesuada dui malesuada. Ut id augue nisi, nec placerat ligula. Sed imperdiet neque eget nibh hendrerit accumsan. In eget dolor sem, quis volutpat urna. Proin tempor nunc vitae felis iaculis bibendum.

Sed lacinia, velit vitae gravida egestas, mauris ipsum varius justo, vitae tincidunt felis erat vitae odio. Aenean lorem orci, rhoncus a tincidunt sed, aliquet vitae odio. Nullam ac quam sit amet lacus posuere molestie in quis sapien. Etiam sed erat massa. Maecenas quis elit a mi pellentesque fringilla. Phasellus id velit arcu. Suspendisse pretium rutrum pulvinar. Donec enim turpis, iaculis nec imperdiet at, suscipit eu mauris. Duis luctus venenatis dolor, sed feugiat eros varius mollis. Nunc tincidunt pharetra lorem non convallis. Nulla consequat luctus enim quis varius.

Aliquam id imperdiet tellus. Nam id turpis mauris. Sed vel odio felis. Quisque blandit, est quis vulputate commodo, dolor dui molestie justo, ac posuere diam sem quis tellus. Suspendisse in luctus nibh. Donec porttitor ante nec nunc volutpat vehicula. Nunc nec malesuada enim. Nunc tristique, massa eget vehicula sodales, magna velit tincidunt tellus, interdum vulputate magna tortor sed leo. Praesent dignissim mi sit amet dolor pulvinar quis pellentesque urna cursus. Nam ultricies felis varius arcu pulvinar quis ultricies erat aliquet. Duis non lectus eu massa pharetra pharetra consectetur vitae massa. Nulla facilisi. Cras sed nunc nunc, ac euismod odio. Integer convallis, nisl id ullamcorper volutpat, ligula risus suscipit orci, non gravida magna urna eu urna.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vehicula nulla id nisi laoreet id mattis ante bibendum. Aliquam eget dui id urna bibendum dapibus. Suspendisse potenti. Pellentesque tempor tristique dui. Maecenas arcu tellus, varius at dictum at, adipiscing sed ante. Donec nec sapien justo, volutpat eleifend purus. Aenean quis leo id erat feugiat lobortis. Fusce sed nisi tellus, laoreet ultricies felis. Nam eget lorem erat. Etiam in sapien leo, et ultricies nibh. Suspendisse potenti. Nulla quam lectus, dignissim nec blandit at, hendrerit euismod dui. Integer tincidunt, purus sit amet dictum ullamcorper, augue massa porttitor lorem, non commodo tortor nunc in massa. Nam sodales, risus in scelerisque lobortis, est leo ultricies lorem, et malesuada mauris orci at quam. Quisque et lacinia libero.
 
You may also want to try resizing your web browser window, to see how the number of columns and the gaps (spacing) between columns changes on different screen sizes. Normal Stacks border, margin, padding, background, layout and rounded corner settings can be applied to this stack if needed. Additional custom CSS code can be applied using the .quickColumns class selector name, to target the QuickColumns stack.

Setup

To use this stack, start by going through the stack settings and adjusting the breakpoints. Breakpoint refers to the size at which particular settings will take effect. So for example, setting a breakpoint of 800px would ensure those particular settings only take effect on screen sizes of 800px or less. It's always best to start with the highest breakpoint and work your way down towards smaller screens. Up to five breakpoints can be set using this stack, although typically you may only need to use two or three (zero-out any you're not using). Column Gap refers to the space between columns under a particular breakpoint. Column Count refers to the number of columns to be displayed under a particular breakpoint. All standard styled text controls are supported, together with basic HTML code.

Browser support

QuickColumns has been tested and confirmed to work in IE10, IE11, Safari, Firefox, Chrome and Opera web browsers. In older web browsers, multiple columns will safely degrade back to single columns. If you search online for 'CSS3 Columns' you can get more information about the official specification and further details relating to browser compatibility.

Theme compatibility

QuickColumns was designed and developed specifically for use in ThemeFlood RapidWeaver themes. It may well work with other themes too, although these won't be officially supported.

Why yet another columns stack?

There are already many column stacks available. However most of these appear to be paid stacks. There did not appear to be any freeware pure HTML / CSS stacks available, like QuickColumns. So although QuickColumns may do the same as other stacks already on the market, the way it works is radically different to others already in existence. Try it, and you might be surprised at how good it is.
 

Contribute

If you find this stack element useful in your personal or commercial web projects; please consider making a small contribution towards ongoing support and updates. There are many different ways you can contribute to the Stacks4Stacks project, and benefits for doing so.
Bookmark or share this page
Baidu 百度
Blogger
Delicious
Digg
Facebook
Google+
LinkedIn
LiveJournal
MySpace
Одноклассники
Reddit
Renren 人人网
StumbleUpon
Tumblr
Twitter
ВКонтакте
Weibo 微博
XING
Contact Us
Email This Page
Print This Page
PS: This bookmarking and sharing popup is powered using our brilliant SocialPopup stack!

Cookies

Like a lot of websites, Stacks4Stacks uses cookies to help enhance your browsing experience and handle things like purchases. We take your privacy seriously, and welcome you to freely opt-out of nonessential cookies at any time by reviewing your preferences on this page.