philbowell
philbowell

The more I use CSS Grid the more I wish for the ability to set a baseline in my CSS. It seems like a logical addition since the two are so intertwined in the print world.

|
Embed
eli
eli

@philbowell would something like this not work?

css * { font-size:16px; line-height: 18px; } h1 {font-size:48px; line-height: 54px;} h2 {font-size:30px; line-height: 36px; } h3 {font-size:24px; line-height: 36px; } h4 {font-size:21px; line-height: 36px; } h5 {font-size:18px; } h6 {font-size:16px; }

|
Embed
In reply to
eli
eli

@philbowell sorry, that code block got buggered. Here is a screenshot of what I meant.

|
Embed
philbowell
philbowell

@eli no worries, I guess if it was purely text it would work. The issue would be when you start adding visual elements like borders that would break.

The dream would be to set a page baseline, then setting items to align to it and being able to set bottom/top margin or padding as 2 baselines so everything maintains the vertical rhythm and doesn't get pushed out by the width of the border as items descend down the page. If that makes sense.

|
Embed