diff --git a/src/components/interaction-designer/Block.vue b/src/components/interaction-designer/Block.vue
index 9dae63948..f72cb547f 100644
--- a/src/components/interaction-designer/Block.vue
+++ b/src/components/interaction-designer/Block.vue
@@ -11,6 +11,7 @@
       :start-x="x"
       :start-y="y"
       :is-editable="isEditable"
+      @initialized="handleDraggableInitializedForBlock(block, $event)"
       @dragged="onMoved"
       @dragStarted="selectBlock"
       @dragEnded="handleDraggableEndedForBlock"
@@ -131,11 +132,11 @@
                 'btn-info': exit.destination_block != null,
               }"
               :is-editable="isEditable"
-              @initialized="handleDraggableInitializedFor(exit, $event)"
+              @initialized="handleDraggableInitializedForExit(exit, $event)"
               @dragStarted="onCreateExitDragStarted($event, exit)"
               @dragged="onCreateExitDragged($event)"
               @dragEnded="onCreateExitDragEnded($event, exit)"
-              @destroyed="handleDraggableDestroyedFor(exit)">
+              @destroyed="handleDraggableDestroyedForExit(exit)">
               <i class="glyphicon glyphicon-move" />
             </plain-draggable>
 
@@ -259,11 +260,17 @@ export default {
   computed: {
     ...mapState('flow', [
       'resources',
-      'selectedBlocks',
+      'selectedBlockUuids',
     ]),
     ...mapState(
       'builder',
-      ['activeBlockId', 'operations', 'activeConnectionsContext', 'draggableForExitsByUuid'],
+      [
+      'activeBlockId',
+      'operations',
+      'activeConnectionsContext',
+      'draggableForExitsByUuid',
+      'draggableForBlocksByUuid',
+      ],
     ),
     ...mapState({
       blockClasses: ({trees: {ui}}) => ui.blockClasses,
@@ -285,7 +292,7 @@ export default {
     },
 
     isBlockSelected() {
-      return includes(this.selectedBlocks, this.block.uuid)
+      return includes(this.selectedBlockUuids, this.block.uuid)
     },
 
     // todo: does this component know too much, what out of the above mapped state can be mapped?
@@ -318,6 +325,7 @@ export default {
     }),
 
     ...mapActions('builder', [
+      'changeBlockPositionTo',
       // ConnectionSourceRelocate
       'initializeConnectionSourceRelocateWith',
       'setConnectionSourceRelocateValue',
@@ -455,16 +463,16 @@ export default {
       this.setConnectionCreateTargetBlockToNullFrom({block})
     },
 
-    onMoved({position: {left: x, top: y}}) {
+    onMoved({position}) {
       // todo: try this the vuejs way where we push the change into state, then return false + modify draggable w/in store ?
-
+      const {left: x, top: y} = position
       const {block} = this
       this.$nextTick(() => {
-        this.setBlockPositionTo({position: {x, y}, block})
+        this.changeBlockPositionTo({position: {x, y}, block})
 
-        forEach(this.draggableForExitsByUuid, (draggable, key) => {
+        forEach(this.draggableForExitsByUuid, (exitDraggable, key) => {
           try {
-            draggable.position()
+            exitDraggable.position()
           } catch (e) {
             console.warn('Block', 'onMoved', 'positioning draggable on', key, 'can\'t access property "initElm", props is undefined')
           }
@@ -480,16 +488,24 @@ export default {
       this.labelContainerMaxWidth += 0
     },
 
-    handleDraggableInitializedFor({uuid}, {draggable}) {
+    handleDraggableInitializedForBlock(block, {draggable}) {
+      this.draggableForBlocksByUuid[block.uuid] = draggable
+
+      const {left, top} = draggable
+
+      console.debug('Block', 'handleDraggableInitializedForBlock', {blockId: block.uuid, coords: {left, top}})
+    },
+
+    handleDraggableInitializedForExit({uuid}, {draggable}) {
       this.draggableForExitsByUuid[uuid] = draggable
 
       const {left, top} = draggable
       const {uuid: blockId} = this.block
 
-      console.debug('Block', 'handleDraggableInitializedFor', {blockId, exitId: uuid, coords: {left, top}})
+      console.debug('Block', 'handleDraggableInitializedForExit', {blockId, exitId: uuid, coords: {left, top}})
     },
 
-    handleDraggableDestroyedFor({uuid}) {
+    handleDraggableDestroyedForExit({uuid}) {
       delete this.draggableForExitsByUuid[uuid]
     },
 
diff --git a/src/components/interaction-designer/toolbar/ErrorNotifications.vue b/src/components/interaction-designer/toolbar/ErrorNotifications.vue
index a08667188..66faf1dcc 100644
--- a/src/components/interaction-designer/toolbar/ErrorNotifications.vue
+++ b/src/components/interaction-designer/toolbar/ErrorNotifications.vue
@@ -133,10 +133,6 @@ export default class ErrorNotifications extends mixins(Routes, Lang) {
 </script>
 
 <style scoped lang="scss">
-.error-notifications-wrapper {
-  z-index: 2 * 10;
-}
-
 .notification {
   width: 500px;
   padding: 0;
diff --git a/src/components/interaction-designer/toolbar/SelectionBanner.vue b/src/components/interaction-designer/toolbar/SelectionBanner.vue
index 95b38080d..e45da20ef 100644
--- a/src/components/interaction-designer/toolbar/SelectionBanner.vue
+++ b/src/components/interaction-designer/toolbar/SelectionBanner.vue
@@ -70,7 +70,7 @@ export default class SelectionBanner extends mixins(Lang) {
   }
 
   get countSelectedBlocks(): number {
-    return size(this.selectedBlocks)
+    return size(this.selectedBlockUuids)
   }
 
   async confirmMultipleDeletion(): Promise<void> {
@@ -83,7 +83,7 @@ export default class SelectionBanner extends mixins(Lang) {
     await this.flow_clearMultiSelection()
   }
 
-  @flowVuexNamespace.State selectedBlocks!: IBlock['uuid'][]
+  @flowVuexNamespace.State selectedBlockUuids!: IBlock['uuid'][]
   @flowVuexNamespace.Action flow_clearMultiSelection!: () => Promise<void>
   @flowVuexNamespace.Action flow_removeAllSelectedBlocks!: () => Promise<void>
   @flowVuexNamespace.Action flow_duplicateAllSelectedBlocks!: () => Promise<void>
diff --git a/src/components/interaction-designer/toolbar/TreeBuilderToolbar.vue b/src/components/interaction-designer/toolbar/TreeBuilderToolbar.vue
index 2602275e2..0e499b948 100644
--- a/src/components/interaction-designer/toolbar/TreeBuilderToolbar.vue
+++ b/src/components/interaction-designer/toolbar/TreeBuilderToolbar.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     ref="builder-toolbar"
-    class="tree-builder-toolbar">
+    class="tree-builder-toolbar d-flex flex-column">
     <div class="tree-builder-toolbar-main-menu">
       <div
         v-if="isImporterVisible"
@@ -183,7 +183,7 @@
         </div>
       </div>
     </div>
-    <div class="tree-builder-toolbar-alerts w-100">
+    <div class="tree-builder-toolbar-alerts w-100 d-flex flex-column">
       <selection-banner @updated="handleHeightChangeFromDOM" />
       <error-notifications @updated="handleHeightChangeFromDOM" />
     </div>
diff --git a/src/store/builder/index.ts b/src/store/builder/index.ts
index b488e0020..1c20d5bf0 100644
--- a/src/store/builder/index.ts
+++ b/src/store/builder/index.ts
@@ -1,4 +1,6 @@
-import {filter, flatMap, get, isEqual, keyBy, map, mapValues, union} from 'lodash'
+import {
+  flatMap, isEqual, keyBy, map, mapValues, get, filter, union, includes, clone, forEach, minBy,
+} from 'lodash'
 import Vue from 'vue'
 import {ActionTree, GetterTree, Module, MutationTree} from 'vuex'
 import {IRootState} from '@/store'
@@ -55,7 +57,9 @@ export interface IBuilderState {
     [OperationKind.CONNECTION_CREATE]: IConnectionCreateOperation,
     [OperationKind.BLOCK_RELOCATE]: null,
   },
-  draggableForExitsByUuid: object,
+  toolbarHeight: number,
+  draggableForExitsByUuid: {[key: string]: object},
+  draggableForBlocksByUuid: {[key: string]: object},
 }
 
 export const stateFactory = (): IBuilderState => ({
@@ -73,7 +77,9 @@ export const stateFactory = (): IBuilderState => ({
     },
     [OperationKind.BLOCK_RELOCATE]: null,
   },
+  toolbarHeight: 60,
   draggableForExitsByUuid: {},
+  draggableForBlocksByUuid: {},
 })
 
 export const getters: GetterTree<IBuilderState, IRootState> = {
@@ -89,6 +95,26 @@ export const getters: GetterTree<IBuilderState, IRootState> = {
   exitLabelsById: (_state, _getters, {flow: {flows}}) => mapValues(keyBy(flatMap(flows[0].blocks, 'exits'), 'uuid'), 'label'),
 
   isEditable: (state) => state.isEditable,
+
+  selectedBlocks(_state, _getters, _rootState, rootGetters) {
+    return rootGetters['flow/selectedBlocks']
+  },
+
+  selectedBlockAtTheTopPosition(_state, getters) {
+    return minBy(getters.selectedBlocks, 'vendor_metadata.io_viamo.uiData.yPosition')
+  },
+
+  selectedBlockAtTheFurthestLeftPosition(_state, getters) {
+    return minBy(getters.selectedBlocks, 'vendor_metadata.io_viamo.uiData.xPosition')
+  },
+
+  isAnyLeftSpaceAvailable(_state, getters) {
+    return getters.selectedBlockAtTheFurthestLeftPosition.vendor_metadata.io_viamo.uiData.xPosition > 0
+  },
+
+  isAnyTopSpaceAvailable(state, getters) {
+    return getters.selectedBlockAtTheTopPosition.vendor_metadata.io_viamo.uiData.yPosition - state.toolbarHeight > 0
+  },
 }
 
 export const mutations: MutationTree<IBuilderState> = {
@@ -119,8 +145,14 @@ export const mutations: MutationTree<IBuilderState> = {
     //   Vue.observable(block.vendor_metadata.io_viamo.uiData)
     // }
 
-    block.vendor_metadata.io_viamo.uiData.xPosition = x
-    block.vendor_metadata.io_viamo.uiData.yPosition = y
+    if (x !== undefined) {
+      // eslint-disable-next-line no-param-reassign
+      block.vendor_metadata.io_viamo.uiData.xPosition = x
+    }
+    if (y !== undefined) {
+      // eslint-disable-next-line no-param-reassign
+      block.vendor_metadata.io_viamo.uiData.yPosition = y
+    }
   },
 
   setIsEditable(state, value) {
@@ -130,9 +162,96 @@ export const mutations: MutationTree<IBuilderState> = {
   initDraggableForExitsByUuid(state) {
     state.draggableForExitsByUuid = {}
   },
+
+  updateBlockDraggablePosition(state, {uuid, position}: { uuid: IBlock['uuid'], position: IPosition }) {
+    console.debug('Builder', 'updateBlockDraggablePosition for ', state.draggableForBlocksByUuid[uuid], 'to ', position)
+    Object.assign(state.draggableForBlocksByUuid[uuid], {left: position.x, top: position.y})
+  },
+
+  updateToolBarHeight(state, height) {
+    state.toolbarHeight = height
+  },
 }
 
 export const actions: ActionTree<IBuilderState, IRootState> = {
+  changeBlockPositionTo({commit, getters, dispatch, rootState}, {position: {x, y}, block}) {
+    if (!includes(rootState.flow.selectedBlockUuids, block.uuid)) {
+      commit('setBlockPositionTo', {position: {x, y}, block})
+      return
+    }
+
+    // The block is selected
+    // Store UI Position
+    const initialPosition = {
+      x: clone(block.vendor_metadata.io_viamo.uiData.xPosition),
+      y: clone(block.vendor_metadata.io_viamo.uiData.yPosition),
+    } as IPosition
+
+    // Prepare translation
+    const translationDelta: IPosition = {
+      x: x - initialPosition.x,
+      y: y - initialPosition.y,
+    }
+
+    let shouldReversePosition = false
+    const isMovingToTheRight = translationDelta.x > 0
+    if (isMovingToTheRight || getters.isAnyLeftSpaceAvailable) {
+      commit('setBlockPositionTo', {position: {x}, block})
+    } else {
+      translationDelta.x = 0
+      commit('setBlockPositionTo', {position: {x: initialPosition.x}, block})
+      shouldReversePosition = true
+    }
+
+    const isMovingToTheTop = translationDelta.y > 0
+    if (isMovingToTheTop || getters.isAnyTopSpaceAvailable) {
+      commit('setBlockPositionTo', {position: {y}, block})
+    } else {
+      translationDelta.y = 0
+      commit('setBlockPositionTo', {position: {y: initialPosition.y}, block})
+      shouldReversePosition = true
+    }
+
+    // Reverse the draggable position
+    if (shouldReversePosition) {
+      commit('updateBlockDraggablePosition', {
+        uuid: block.uuid,
+        position: {
+          x: block.vendor_metadata.io_viamo.uiData.xPosition,
+          y: block.vendor_metadata.io_viamo.uiData.yPosition,
+        },
+      })
+    }
+
+    // Translate other selected blocks
+    forEach(getters.selectedBlocks, (currentBlock: IBlock) => {
+      if (currentBlock.uuid !== block.uuid) {
+        dispatch('setBlockAndSyncDraggablePositionFromDelta', {delta: translationDelta, block: currentBlock})
+      }
+    })
+  },
+
+  setBlockAndSyncDraggablePositionFromDelta({commit}, {delta: {x, y}, block}) {
+    const {
+      vendor_metadata: {
+        io_viamo: {
+          uiData: {
+            xPosition: initialXPosition,
+            yPosition: initialYPosition,
+          },
+        },
+      },
+    } = block
+
+    const newPosition: IPosition = {
+      x: initialXPosition + x,
+      y: initialYPosition + y,
+    }
+
+    commit('setBlockPositionTo', {position: newPosition, block})
+    commit('updateBlockDraggablePosition', {uuid: block.uuid, position: newPosition})
+  },
+
   removeConnectionFrom({commit}, {block: {uuid: blockId}, exit: {uuid: exitId}}) {
     commit('flow/block_setBlockExitDestinationBlockId', {
       blockId,
diff --git a/src/store/flow/block.ts b/src/store/flow/block.ts
index 18f6b2179..b4be0e3e4 100644
--- a/src/store/flow/block.ts
+++ b/src/store/flow/block.ts
@@ -150,12 +150,12 @@ export const actions: ActionTree<IFlowsState, IRootState> = {
   },
 
   async block_select({state}, {blockId}: { blockId: IBlock['uuid'] }) {
-    state.selectedBlocks.push(blockId)
+    state.selectedBlockUuids.push(blockId)
   },
 
   async block_deselect({state}, {blockId}: { blockId: IBlock['uuid'] }) {
     // remove it
-    state.selectedBlocks = state.selectedBlocks.filter((item) => item !== blockId)
+    state.selectedBlockUuids = state.selectedBlockUuids.filter((item) => item !== blockId)
   },
 }
 
diff --git a/src/store/flow/flow.ts b/src/store/flow/flow.ts
index e98f016a5..3bf3c49f4 100644
--- a/src/store/flow/flow.ts
+++ b/src/store/flow/flow.ts
@@ -16,7 +16,7 @@ import {IdGeneratorUuidV4} from '@floip/flow-runner/dist/domain/IdGeneratorUuidV
 import moment from 'moment'
 import {ActionTree, GetterTree, MutationTree} from 'vuex'
 import {IRootState} from '@/store'
-import {cloneDeep, defaults, every, forEach, get, has, includes, omit} from 'lodash'
+import {cloneDeep, defaults, every, forEach, filter, get, has, includes, minBy, omit} from 'lodash'
 import {discoverContentTypesFor} from '@/store/flow/resource'
 import {computeBlockUiData} from '@/store/builder'
 import {IFlowsState} from '.'
@@ -63,6 +63,7 @@ export const getters: GetterTree<IFlowsState, IRootState> = {
   hasVoiceMode: (state, getters) => includes(getters.activeFlow.supported_modes || [], SupportedMode.IVR),
   hasOfflineMode: (state, getters) => includes(getters.activeFlow.supported_modes || [], SupportedMode.OFFLINE),
   currentFlowsState: (state) => state,
+  selectedBlocks: (state, getters) => filter(getters.activeFlow.blocks, (block) => includes(state.selectedBlockUuids, block.uuid)),
 }
 
 export const mutations: MutationTree<IFlowsState> = {
@@ -363,26 +364,26 @@ export const actions: ActionTree<IFlowsState, IRootState> = {
   },
 
   async flow_clearMultiSelection({state, dispatch}) {
-    forEach(state.selectedBlocks, (blockId: IBlock['uuid']) => {
+    forEach(state.selectedBlockUuids, (blockId: IBlock['uuid']) => {
       dispatch('block_deselect', {blockId})
     })
   },
 
   async flow_removeAllSelectedBlocks({state, dispatch}) {
-    forEach(state.selectedBlocks, (blockId: IBlock['uuid']) => {
+    forEach(state.selectedBlockUuids, (blockId: IBlock['uuid']) => {
       dispatch('flow_removeBlock', {blockId})
     })
 
-    state.selectedBlocks = []
+    state.selectedBlockUuids = []
   },
 
   async flow_duplicateAllSelectedBlocks({state, dispatch}) {
-    const newBlocksUuid: string[] = []
-    forEach(state.selectedBlocks, async (blockId: IBlock['uuid']) => {
+    const newBlocksUuids: string[] = []
+    forEach(state.selectedBlockUuids, async (blockId: IBlock['uuid']) => {
       const duplicatedBlock: IBlock = await dispatch('flow_duplicateBlock', {blockId})
-      newBlocksUuid.push(duplicatedBlock.uuid)
+      newBlocksUuids.push(duplicatedBlock.uuid)
     })
-    state.selectedBlocks = newBlocksUuid
+    state.selectedBlockUuids = newBlocksUuids
   },
 }
 
diff --git a/src/store/flow/index.ts b/src/store/flow/index.ts
index a6ea6c955..2d8a4c8b7 100644
--- a/src/store/flow/index.ts
+++ b/src/store/flow/index.ts
@@ -9,7 +9,9 @@ import {actions as resourceActions, getters as resourceGetters, mutations as res
 // type IFlowsState = Pick<IContext, 'flows' | 'first_flow_id' | 'resources' | 'nested_flow_block_interaction_id_stack'>
 
 export interface IFlowsState {
-  //Created is *not* the same as persisted. It does not guarantee the current state is saved to the server. Only that the currently active flow in the container was persisted - the persistFlow route was called with the container and the active flow uuid and the route response did not have an error status code
+  // Created is *not* the same as persisted. It does not guarantee the current state is saved to the server.
+  // Only that the currently active flow in the container was persisted - the persistFlow route was called with the container and the active
+  // flow uuid and the route response did not have an error status code
   isCreated: boolean,
   specification_version: string,
   container_uuid: string,
@@ -19,7 +21,7 @@ export interface IFlowsState {
   first_flow_id: string | null,
   // @note - for exciting future
   nested_flow_block_interaction_id_stack: string[],
-  selectedBlocks: IBlock['uuid'][],
+  selectedBlockUuids: IBlock['uuid'][],
 }
 
 export const stateFactory = (): IFlowsState => ({
@@ -35,7 +37,7 @@ export const stateFactory = (): IFlowsState => ({
   first_flow_id: null,
   // todo: not quite right -- pulled from IContext
   nested_flow_block_interaction_id_stack: [],
-  selectedBlocks: [],
+  selectedBlockUuids: [],
 })
 
 export const getters: GetterTree<IFlowsState, IRootState> = {
diff --git a/src/views/InteractionDesigner.vue b/src/views/InteractionDesigner.vue
index 662c9743a..5fc6bb457 100644
--- a/src/views/InteractionDesigner.vue
+++ b/src/views/InteractionDesigner.vue
@@ -64,7 +64,7 @@
       class="tree-contents"
       :style="{
         'min-height': `${designerWorkspaceHeight}px`,
-        'padding-top': `${toolbarHeight + 5}px`
+        'padding-top': `${toolbarHeight}px`
       }">
       <builder-canvas @click.native="handleCanvasSelected" />
     </div>
@@ -132,7 +132,6 @@ export default {
 
   data() {
     return {
-      toolbarHeight: 60,
       // todo: move this to BlockClassDetails spec // an inversion can be "legacy types"
       pureVuejsBlocks: [
         'CallBackWithCallCenterBlock',
@@ -183,6 +182,8 @@ export default {
     }),
 
     ...mapGetters('flow', ['activeFlow']),
+
+    ...mapState('builder', ['toolbarHeight']),
     ...mapGetters('builder', ['activeBlock', 'isEditable']),
     ...mapGetters('clipboard', ['isSimulatorActive']),
 
@@ -273,7 +274,7 @@ export default {
   },
   methods: {
     ...mapMutations(['deselectBlocks', 'configure']),
-    ...mapMutations('builder', ['activateBlock']),
+    ...mapMutations('builder', ['activateBlock', 'updateToolBarHeight']),
     ...mapActions('builder', ['setIsEditable']),
     ...mapMutations('flow', ['flow_setActiveFlowId']),
 
@@ -347,7 +348,7 @@ export default {
     },
 
     handleToolBarHeightUpdate(height) {
-      this.toolbarHeight = height
+      this.updateToolBarHeight(height)
     },
 
   },
@@ -407,12 +408,13 @@ export default {
     }
   }
 
-  .tree-builder-toolbar-main-menu {
+  .tree-builder-toolbar {
     position: fixed;
-    z-index: 4*10;
-
+    z-index: 3*10;
     width: 100vw;
+  }
 
+  .tree-builder-toolbar-main-menu {
     border-bottom: 1px solid darkgrey;
     background: #eee;
 
diff --git a/tests/unit/__snapshots__/storybook.spec.ts.snap b/tests/unit/__snapshots__/storybook.spec.ts.snap
index ed8e35cc8..f427f74d2 100644
--- a/tests/unit/__snapshots__/storybook.spec.ts.snap
+++ b/tests/unit/__snapshots__/storybook.spec.ts.snap
@@ -441,7 +441,7 @@ exports[`Storyshots InteractionDesigner/Toolbar Edit Flow 1`] = `
               class="interaction-designer-contents panel panel-default"
             >
               <div
-                class="tree-builder-toolbar"
+                class="tree-builder-toolbar d-flex flex-column"
               >
                 <div
                   class="tree-builder-toolbar-main-menu"
@@ -515,7 +515,7 @@ exports[`Storyshots InteractionDesigner/Toolbar Edit Flow 1`] = `
                 </div>
                  
                 <div
-                  class="tree-builder-toolbar-alerts w-100"
+                  class="tree-builder-toolbar-alerts w-100 d-flex flex-column"
                 >
                   <!---->
                    
@@ -560,7 +560,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Extra Buttons Slot 1`] = `
               class="interaction-designer-contents panel panel-default"
             >
               <div
-                class="tree-builder-toolbar"
+                class="tree-builder-toolbar d-flex flex-column"
               >
                 <div
                   class="tree-builder-toolbar-main-menu"
@@ -869,7 +869,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Extra Buttons Slot 1`] = `
                 </div>
                  
                 <div
-                  class="tree-builder-toolbar-alerts w-100"
+                  class="tree-builder-toolbar-alerts w-100 d-flex flex-column"
                 >
                   <!---->
                    
@@ -914,7 +914,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Grouped Buttons Slot 1`] =
               class="interaction-designer-contents panel panel-default"
             >
               <div
-                class="tree-builder-toolbar"
+                class="tree-builder-toolbar d-flex flex-column"
               >
                 <div
                   class="tree-builder-toolbar-main-menu"
@@ -1222,7 +1222,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Grouped Buttons Slot 1`] =
                 </div>
                  
                 <div
-                  class="tree-builder-toolbar-alerts w-100"
+                  class="tree-builder-toolbar-alerts w-100 d-flex flex-column"
                 >
                   <!---->
                    
@@ -1267,7 +1267,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Save Button 1`] = `
               class="interaction-designer-contents panel panel-default"
             >
               <div
-                class="tree-builder-toolbar"
+                class="tree-builder-toolbar d-flex flex-column"
               >
                 <div
                   class="tree-builder-toolbar-main-menu"
@@ -1547,7 +1547,7 @@ exports[`Storyshots InteractionDesigner/Toolbar With Save Button 1`] = `
                 </div>
                  
                 <div
-                  class="tree-builder-toolbar-alerts w-100"
+                  class="tree-builder-toolbar-alerts w-100 d-flex flex-column"
                 >
                   <!---->
                    
@@ -1592,7 +1592,7 @@ exports[`Storyshots InteractionDesigner/Toolbar Without Resource Editor Toggle 1
               class="interaction-designer-contents panel panel-default"
             >
               <div
-                class="tree-builder-toolbar"
+                class="tree-builder-toolbar d-flex flex-column"
               >
                 <div
                   class="tree-builder-toolbar-main-menu"
@@ -1686,7 +1686,7 @@ exports[`Storyshots InteractionDesigner/Toolbar Without Resource Editor Toggle 1
                 </div>
                  
                 <div
-                  class="tree-builder-toolbar-alerts w-100"
+                  class="tree-builder-toolbar-alerts w-100 d-flex flex-column"
                 >
                   <!---->