pwired Posted August 6, 2014 Share Posted August 6, 2014 Hi, I am setting up a blog with Ryan's blog profile and am digging the skeleton framework. Some confusion here. On the skeleton grid example it shows 12 columns, http://www.getskeleton.com/#grid but if you click underneath on the code example link it shows 16 columns <!-- Give column value in word form (one, two..., twelve) --> <div class="sixteen columns"> <h1>Full Width Column</h1> </div> Looks like skeleton is a 16 columns grid and not 12 as shown in the example. Also can someone tell me in easy words what they mean with alpha and omega in skeleton ? Link to comment Share on other sites More sharing options...
Raymond Geerts Posted August 6, 2014 Share Posted August 6, 2014 I dont know skeleton, but taking a quick glimpse at the HTML of the site it looks like its a 16 column grid. But instead of using percentual measurements for the grid width it uses a fixed pixel width. The media queries set a different width for the grid elements (one, two, etc.) So since, on a wide screen looking at the site its a left sidebar of 3 columns width and a content part of 12 columns with an offset of 1 column makes it a total of 16. Thats why the example in the content column has a width of 12 columns. | 3 columns | 1 column offset | -------- 12 columns -------- | Link to comment Share on other sites More sharing options...
pwired Posted August 7, 2014 Author Share Posted August 7, 2014 Hi Raymond, what you write makes a lot of sense, thanks. I have to play around more with skeleton to work it out. Link to comment Share on other sites More sharing options...
NooseLadder Posted August 7, 2014 Share Posted August 7, 2014 I use skeleton all the time. The std package is definitely 16 cols. I think Ryan added extra @media screen for a minimum width of 1200px for larger screens to the files supplied with the blog profile? Once you get the hang of columns, offsets, one-third columns etc, it's a breeze. Link to comment Share on other sites More sharing options...
kongondo Posted August 7, 2014 Share Posted August 7, 2014 Or you can just use PocketGrid CSS (grid system only) and have any number of columns you want... 2 Link to comment Share on other sites More sharing options...
pwired Posted August 7, 2014 Author Share Posted August 7, 2014 Does anyone know why the skeleton grid was chosen for the processwire blog profile ? Link to comment Share on other sites More sharing options...
kongondo Posted August 7, 2014 Share Posted August 7, 2014 (edited) Does anyone know why the skeleton grid was chosen for the processwire blog profile ? Yes...read Ryan's reasons from here downwards...especially post #27 Edited August 7, 2014 by kongondo 1 Link to comment Share on other sites More sharing options...
pwired Posted August 7, 2014 Author Share Posted August 7, 2014 I've also added a 1200px view (something that Skeleton doesn't come with) so that this profile has a nice "wide" view, in addition to a normal desktop, tablet and mobile view. Thanks kongondo. I guess this also answers my question about "alpha" and "omega" in skeleton. Link to comment Share on other sites More sharing options...
Recommended Posts