Baseline alignment with ems and an adaptive layout...

Baseline

14 Responses

  1. Elliot Jay Stocks Elliot Jay Stocks

    ... *is* possible!

    over 2 years ago

  2. Ethan Marcotte Ethan Marcotte

    Hell yes it is.

    (Also, can’t wait to see this!)

    likes

    over 2 years ago

  3. Jared Fager Jared Fager

    @Ethan Ditto!

    over 2 years ago

  4. Mark Boulton Mark Boulton

    Ooh, spot the incremental rhythm! Nice.

    likes

    over 2 years ago

  5. Rory McCawl Rory McCawl

    Looks awesome. Also looking forward to seeing this.

    over 2 years ago

  6. Elliot Jay Stocks Elliot Jay Stocks

    Thanks mate. Sadly, this is the one that I didn't quite manage to get working with a fluid grid in the end, so it's adaptive rather than fully responsive. Maybe when it's finished you can take a look and let me know if I'm being stupid about not fluid-i-fying it! :)

    over 2 years ago

  7. Matthew Sanders Matthew Sanders

    Of course it is.

    over 2 years ago

  8. Scott Boms Scott Boms

    Was there doubt that this was possible? Not suggesting it would be easy, but...

    over 2 years ago

  9. Trent Walton Trent Walton

    Awesome & totally possible! I'm not sure if it was smart or not, but I rolled one based on 18px and some sensible line-height for full width, and then one for 16px at narrower widths for ye olde blog.

    likes

    over 2 years ago

  10. Vaughan Moffitt Vaughan Moffitt

    This is the one thing that web typography desperately needs and can’t wait to see you working solution. I’ve been working on something similar myself. Because I design in multiples of 5, I design everything to a 5px baseline grid. My font line heights are also multiples of 5.

    I’d love to hear your thoughts on this process Elliot and dribbblers?

    http://vaughanmoffitt.com/the-quick-and-easy-guide-to-achieving-absolute-pixel-perfection-using-baseline-grids/

    over 2 years ago

  11. Chris Armstrong Chris Armstrong

    Nice, are you using pixels or ems?

    over 2 years ago

  12. Bjarni Wark Bjarni Wark

    Almost there, it looks like every second line on the left does not share the baseline?

    over 2 years ago

  13. Alexis Fellenius Alexis Fellenius

    @Bjarni Wark It's incremental leading. Read Mark Boulton's terrific post on the subject: http://www.markboulton.co.uk/journal/comments/incremental-leading

    over 2 years ago

  14. Bjarni Wark Bjarni Wark

    @Alexis, thanks but whats the main benefit of it?

    over 2 years ago

keyboard shortcuts: previous shot next shot L or F like