Tags: float

6

sparkline

Tuesday, November 13th, 2018

[css-exclusions] Status of the exclusions spec #3308

Remember when I said that if we want to see CSS exclusions implemented in browsers, we need to make some noise?

Well, Rachel is taking names, so if you’ve got a use-case, let her know.

Saturday, November 10th, 2018

Editorial Layouts, Floats, and CSS Grid | Rob Weychert

I remember a couple of years back when Jen came to visit Clearleft to chat to us about CSS grid, this use-case that Rob describes here came up almost immediately.

But despair not—Rachel points to a potential solution. I saw potential solution, because if we want to see this implemented in browsers, we need to make some noise.

Tuesday, May 29th, 2018

Getting Started With CSS Layout — Smashing Magazine

Rachel gives a terrific explanation of CSS layout from first principles, starting with the default normal flow within writing systems, moving on to floats, then positioning—relative, absolute, fixed, and sticky—then flexbox, and finally grid (with a coda on alignment). This is a great primer to keep bookmarked; I think I’ll find myself returning to this more than once.

Sunday, January 22nd, 2017

CSS Grid. One layout method not the only layout method

Grid is only a replacement for float-based layout, where float-based layout it being used to try and create a two-dimensional grid. If you want to wrap text around an image, I’d suggest floating it.

Grid is only a replacement for flexbox if you have been trying to make flexbox into a two-dimensional grid. If you want to take a bunch of items and space them out evenly in a single row, use flexbox.

Sunday, January 24th, 2016

Revisiting the Float Label pattern with CSS — That Emil is Emil Björklund

A clever technique by Emil to implement the “float label” pattern using CSS. It all hinges on browsers supporting the :placeholder-shown pseudo-class which, alas, is not universal.

I was hoping that maybe @supports could come to the rescue (so that a better fallback could be crafted), but that tests for properties and values, not selectors. Damn!

Monday, March 24th, 2008

Edge to edge alignment with CSS | Matt Wilcox .net

Here's a very handy CSS technique for floating a group of objects edge to edge. I've been in this situation quite a few times in the past.