As long as bars are still permanently visible (this will change with Magnolia 5), they are allowed to take up space and possibly disturb the rendering. They are rendered before the element they represent and push the latter down.

The reason why all edit bars render in-line and are not transparent in Magnolia 4.5 is that a transparent bar may cover possible clickable content and thus there must be a way to click them away or hide them (switching to Preview mode it too heavy). In addition, having many transparent bars on a page requires a strategy for handling overlapping bars (happens quickly with area bars and their first containing component), which again asks for bars to be selectable or there to be a way to hide them.

Compared to 4.5 Sprint III, the following changes are applied.

Page edit bar not transparent

The page edit bar shall be rendered opaque as well and be allowed to shift down the entire page. This is to prevent it from covering any (possible clickable) content below and to remain consistent with all other main bars.

Edit bars are always rendered in-line and before their content

Some early STK 2.0 migration work renders the edit bars of no component area bars atop or underneath the content. This leads to all sorts of problems with hidden area labels and buttons.

All main edit bars shall therefore be rendered before the element they represent and be rendered in-line.

A bar has a minimum width

There shall be a minimum width of a bar. It accommodates all buttons safely and leaves a white space between the "Delete" button and the non-destructive actions on the buttons on the right.