It takes as much energy to wish as it does to plan. — Eleanor Roosevelt
The Media Object pattern is: image thingy on the left, heading and text on the right.
That's what Nicole Sullivan called it and the name stuck. It's a pretty simple pattern, but like all things web design, it can be done many ways.… Read article
The table-layout property defines what algorithm the browser should use to lay out table rows, cells, and columns. … Read article
Samantha Zhang:
When web components are modular like Lego bricks down to the elements level, they become more versatile and easier to maintain. We believe it’s the next step to take in modular web design.
It's a clever system: put a half-gutter around all elements and a half-gutter around the containers. That way no matter what touches what, full gutters are naturally there.… Read article
The following is a guest post by Oliver Williams. Oliver has been working with CSS grid layout and has learned quite a bit along the way. In this article he's going to hop around to different concepts that he's learned on that journey. I like this idea of learning little bite-sized chunks about grid layout, through isolated examples where possible. That makes learning the whole thing a bit less intimidating.… Read article
I was watching Rachel Andrew talk about CSS Grid Layout yesterday at An Event Apart. Grid is amazing and the day will soon come where it's a dominant web layout tool of choice. That day isn't here yet though, as no stable browser is shipping the latest version of the spec (it's behind a flag at best).
The good news is that, as of just a few days ago, the spec is really stable and has entered "Candidate Recommendation" … Read article
object-fit and object-position are my two favourite CSS properties lately. They give developers control over the content inside an img or a video similar to the way that we can manipulate the content of a background with background-position and background-size.… Read article
Centering things in CSS is the poster child of CSS complaining. Why does it have to be so hard? They jeer. I think the issue isn't that it's difficult to do, but in that there so many different ways of doing it, depending on the situation, it's hard to know which to reach for.
So let's make it a decision tree and hopefully make it easier.… Read article
Let's say you have a bunch of images you want to display, and the goal is to get them edge-to-edge on the browser window with no gaps. Just because you think that would be cool. They are of all different sizes. You don't care if they are resized, but they should maintain their aspect ratio. … Read article