I saw an interesting take on off-canvas navigation the other day over on The New Tropic. It wasn’t the off-canvas part so much. It was how the elements within the nav took up space. They stretched out to take …
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 …
The purpose of a sticky footer is that it “sticks” to the bottom of the browser window. But not always, if there is enough content on the page to push the footer lower, it still does that. But if the …
Two sentences from Rachel Andrew that explain when to reach for which layout choice:
…Flexbox is essentially for laying out items in a single dimension – in a row OR a column. Grid is for layout of items in two
The following is a guest post by Manuel Matuzovic. It illustrates how flex-grow works, weird quirks and all. Then he goes into several examples on how common layout patterns may be implemented using flex-grow and flex-basis.
When I …
The flex-grow property is a sub-property of the Flexible Box Layout module.
It defines the ability for a flex item to grow if necessary. It accepts a unitless value that serves as a proportion. It dictates what amount of …
The align-content property is a sub-property of the Flexible Box Layout module.
It helps to align a flex container’s lines within it when there is extra space in the cross-axis, similar to how justify-content aligns individual items within the …
