![]() ![]() But as our layout tools have improved, and mainly as approaches to responsive have changed (intrinsic behaviors are preferred over breakpoint editing), that rigidity turned into an obstacle moreso than a benefit. ![]() That rigid layout we saw as a benefit at the time.Layout grid does this, but on the downside is locked to the pretty rigid standard 12 column layout. For complete 100% flexibility, we would likely need resize handles on each block for positioning, and we’d need to visually surface a grid so you could see what you would snap to.Then there's the Layout Grid plugin, which uses a responsive 12 column grid system.Ĭommon across them all are a few UI challenges: The latter was slightly encumbered by the weight of features to support, making the block hard to use unless you also knew the behavior of the grid spec. Both of which today would probably be acceptable for post content as we have an alternate means of spacing out blocks. In the former, it broke floats as well as collapsing margins. ![]() Then also #20000, which added a bespoke grid block implementing almost the full range of grid properties. There's definitely a lot of past explorations in this, including #4314 which sought to use grid to absorb wide and fullwide alignments, while also providing some exciting new ones like "pull left" and others. We could also repurpose the flex justification and alignment controls to some extent. In addition to these options, we should allow gap to be set (using the existing block spacing controls) and perhaps optionally row height (although that could be left out of a V1). Perhaps we could make both options available, defaulting to 2 as the easiest to get started with? What might a UI for these options look like? This is an easier option to set up as it only requires specifying a minimum column width. Option 2 will adjust the number of columns according to the size of the viewport, but the columns will all have the same width. ![]() This requires, at a minimum, setting a number of columns and their respective widths. Otherwise horizontal scroll will happen once the grid is wider than the viewport. Option 1 will always display the same number of columns, although if their width is a percentage or fraction of the whole, it will behave responsively.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |