Skip to main content
CSS is fun and cool and I like it.

Articles Tagged grid-template-columns

It takes as much energy to wish as it does to plan. — Eleanor Roosevelt
2 Articles
{
,

}
Article

Responsive Grid Magazine Layout in Just 20 Lines of CSS

Avatar of Keir Watson
Author
Keir Watson
13 Comments
Join Conversation

I was recently working on a modern take of the blogroll. The idea was to offer readers a selection of latest posts from those blogs in a magazine-style layout, instead of just popping a list of our favorite blogs in the sidebar.

The easy part was grabbing a list of posts with excerpts from our favorite RSS feeds. For that, we used a WordPress plugin, Feedzy lite, which can aggregate multiple feeds into a single time-ordered list — perfect … Read article “Responsive Grid Magazine Layout in Just 20 Lines of CSS”

Almanac

grid-template-columns / grid-template-rows

Avatar of Dennis Gaebel
Author
Dennis Gaebel
1 Comment
Join Conversation

The grid-template-rows and grid-template-columns properties are the primary CSS properties for establishing a grid layout, once the element is a grid context (display: grid;).

There are also -ms-grid-columns and -ms-grid-rows, which are the old IE version of this. You may want to consider Autoprefixing to get them, or not, your call. There was also a weird period where they were grid-definition-columns and grid-definition-rows, but that's not a thing anymore.

Here's an example derived from Microsoft's … Read article “grid-template-columns / grid-template-rows”