javascript
css
preview
This is a template example that uses the Bootstrap framework to create a responsive three-column layout. The left column (narrow) contains a sidebar, the center column (mid) contains features with image/caption, and the right column (widest) contains content.
Details 100This layout utilizes the Bootstrap Affix component using data attributes. You can see
the Affix plugin in action as you scroll down the page. The leftmost side is "pinned" until 140px is reached, and the middle column is un-pinned once 250px is reached.
See the CSS .affix
and .affix-top
classes to see how this works.
This example layout is compliments of Bootply -- the Bootstrap playground. Bootply lets you play with JavaScript, HTML, CSS and Bootstrap in a simple Web-based editor. Bootply enables you to easily include popular libraries, plugins, extensions and frameworks such as jQuery, FontAwesome, AngularJS, FuelUX and Google Maps.
DetailsLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan. Edit this on Bootply.
Bootply is also a collaborative tool that enables sharing of snippets. There is a repository of more than 1000 Bootstrap-ready code snippets. Find code snippets demonstrate common Bootstrap components such as the carousel (sliders), modal, typeahead, navbar, typography, buttons, tabs and icons.
DetailsLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan. Aliquam in felis sit amet augue.
This page must be refreshed to complete your login.
You will lose any unsaved work once the page is refreshed.
Click "No" to cancel the login process.
Click "Yes" to continue...
Unlimited plys. Unlimited downloads. No Ads.