Forums

  • # November 10, 2012 at 8:58 am

    Hope you’re having a great day!

    I’m getting back into the CSS game and was perplexed by CSS grids. When I learned web design we were taught to always make our own grids, avoid loads of divs etc.

    Let’s say I use CSS generator that gives me a 16 column layout with all the divs and good stuff.

    How in the world do I position, say, a header or content that spans two columns??

    # November 10, 2012 at 1:13 pm

    Grid systems…whether pre-set or self-rolled are pretty easy once you understand them.

    There are no set columns that restrict you just that each class sets a specific width. They all float (usually) so if you need an element that’s 1/4 the width of the space you would usually give it a class of .col4 (where 4 = 4/16).

    This means that you can have a div next to it that is no more than 12/16 wide. (.col12?)

    This works with either set pixel widths for the base ‘column’ widths or %.

    This might help: http://css-tricks.com/dont-overthink-it-grids/

    # November 10, 2012 at 6:04 pm

    You might want to look at this: http://css-tricks.com/examples/ResponsiveTables/responsive.php

    # November 12, 2012 at 7:55 am

    Once you know the basics of how grid systems work I have found that rolling your own like Chris does is the way to go.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag