The Standard GetSimple Page Layout
Creating a standard page layout of Header, Content, Sidebar and Footer was remarkably easy. All the html needs to be included in a div of
class="container" which at full width is 960 pixels wide. Each area of the page inside the 'container' is then given a div and the div is given a class from the skeleton.css according to how wide it should be.
Skeleton uses a 16 Column grid so the full width nav menu div is given
class="sixteen columns". Same for the site title and tagline area. The main page area div is given
class="two-thirds column" and the sidebar
class="one-third column". The footer is then full width again.
Inside the footer I wanted the text blocks to have spaces either side of them so the first div, for the copyright statement is written
<div class ="four columns offset-by-two" so that the first two sixteenths of the page width will be left blank.
There is no need to worry about whitespace and margins - the default Skeleton css will take care of that.
Getting Started with Skeleton
Skeleton is a small collection of well-organized CSS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone. It's based on a responsive grid, but also provides very basic CSS for typography, buttons, forms and media queries.
Return to Main Site
This is the standard Skeleton Button. Just add
class="button" to an