Unable to close the gap.

[vapid zodiac]

Hello, I am having the following issues with the dashboard layout configuration:
1.: ´When dragging a tile, I cannot automatically or manually scroll the page up to move that tile into another section that is far up the dashboard
2.: I cannot close the gap between sections as seen in screenshot
trying to drag messes up the whole thing and there is no revert button anymore to revert changes.
I had to split up the right hand section into two to get the gap smaller, but never to completely close it.

is it not possible to freely align sections onto a grid, rather than them randomly jumping around when dragging and auto aligning to weird unuseable layouts?

[trail viper]

Sections View uses a Z-Grid layout opposed to a Z-Masonry (which is probably what you're expecting). In your screenshot, the gap is caused by the bottom of Section shown on the right. That's just the way it is. You can read more about why this method was chosen in drag-and-drop rearrangement of cards and sections. (It is better than the original Masonry layout.)

You could try using vertical-stacks to handle the columns and add cards inside them. This will prevent the gaps. But, it may not be as responsive as you'd like across different devices.

If you want complete control over the layout, there's the custom:layout_card. (I'm not sure if it is Sections-friendly, though. I don't use Sections)

[vapid zodiac]

that prolly means I have to redo the entire dashboard,
for now I have set the width to 4 and set earch section to 4 wide,
not what I want but I have to live it with.

[trail viper]

Unfortunately, it seems there is no easy path to migrate from Sections to a different view. I did a relatively simple test where I have a Section view test page with some random stuff. I grabbed the YAML code and tried to drop it into a new custom:layout-card dashboard and it just turned into a mess. With a little bit more patience and working section by section, I could probably make the two dashboards look the same but it doesn't look like it will be a simple task.

[worn lava]

Sections are just like cards in a grid.
You can copy the yaml from a section, then go to a masonry panel, create any card and paste that yaml over the top.

You lose all the sections' alignment but it allows you to get the config from one panel to another.
You then have to remove all the grid_options stuff that masonry doesn't like.

Purple is a section (colour from the section background)
Grey is a grid on the masonry card.

[trail viper]

It depends on the complexity of the layout. For example, your Security Door and Front Door cards would need to be in a grid card or horizontal-stack. To do this for a single section isn't a big deal. An entire dashboard is a bit more work.

[worn lava]

agreed

just throwing it out as an option to go from sections to masonry in short time

[trail viper]

Trying to replicate something like this (shown in the screenshot) was a PITA. It was easy to make as a Section. ```yaml

• type: custom:layout-card
  layout_type: custom:grid-layout
  layout:
  grid-template-columns: 25% 25% 25% 25%
  grid-template-rows: auto
  grid-template-areas: |
  "a a b b"
  "a a c c"
  "d e c c"
  "d e x x"
  "g g h h"

[worn lava]

Yuck. Yeah, I can visualise the grids within stacks nightmare.

[trail viper]

Here's another example. This one wasn't as difficult but it uses a two-column grid card with two vertical-stacks.

[worn lava]

I found a decent (not perfect) solution for some examples of this problem

The camera picture entity cards are constrained to 5 rows and the light switch underneath is 1
I put the lights and climate controls tile cards in a grid and constrained the grid to 6 rows.

As a bonus, I didn't have to create the light switches again. Since a section is actually a grid, I copied the yaml from the section editor and pasted it back in as a card. Then you just need to remove the background and column span lines and you're done.

It won't fix the more complex layouts, but is an option that might help here and there.

[vapid zodiac]

oh boy I havent checked back here, thanks for the tips folks!