diff --git a/examples/sites/demos/apis/dropdown.js b/examples/sites/demos/apis/dropdown.js
index 7bd22cd915..618fc7b248 100644
--- a/examples/sites/demos/apis/dropdown.js
+++ b/examples/sites/demos/apis/dropdown.js
@@ -218,6 +218,20 @@ export default {
           pcDemo: 'split-button',
           mfDemo: ''
         },
+        {
+          name: 'v-model:visible',
+          type: 'boolean',
+          defaultValue: 'false',
+          meta: {
+            stable: '3.21.1'
+          },
+          desc: {
+            'zh-CN': '手动控制下拉弹框显隐，优先级高于trigger',
+            'en-US': 'Manually control the display and hide of the dropdown menu, with priority higher than the trigger'
+          },
+          mode: ['pc'],
+          pcDemo: 'visible'
+        },
         {
           name: 'visible-arrow',
           type: 'boolean',
diff --git a/examples/sites/demos/pc/app/dropdown/visible-composition-api.vue b/examples/sites/demos/pc/app/dropdown/visible-composition-api.vue
new file mode 100644
index 0000000000..408d9b52bb
--- /dev/null
+++ b/examples/sites/demos/pc/app/dropdown/visible-composition-api.vue
@@ -0,0 +1,48 @@
+<template>
+  <tiny-dropdown v-model:visible="visible" :show-icon="false" @item-click="itemClick" :hideOnClick="false">
+    <tiny-button @click="handleClick">点击{{ visible ? '隐藏' : '显示' }}</tiny-button>
+    <template #dropdown>
+      <tiny-dropdown-menu>
+        <tiny-dropdown-item
+          v-for="(item, index) in options"
+          :key="index"
+          :label="item.label"
+          :disabled="item.disabled"
+          :item-data="item"
+        ></tiny-dropdown-item>
+      </tiny-dropdown-menu>
+    </template>
+  </tiny-dropdown>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { TinyDropdown, TinyDropdownMenu, TinyDropdownItem, TinyButton } from '@opentiny/vue'
+
+const visible = ref(false)
+const options = [
+  {
+    label: '黄金糕'
+  },
+  {
+    label: '点击我隐藏'
+  },
+  {
+    label: '螺蛳粉'
+  },
+  {
+    label: '双皮奶'
+  },
+  {
+    label: '蚵仔煎'
+  }
+]
+const itemClick = (e) => {
+  if (e.itemData.label === '点击我隐藏') {
+    visible.value = false
+  }
+}
+const handleClick = () => {
+  visible.value = !visible.value
+}
+</script>
diff --git a/examples/sites/demos/pc/app/dropdown/visible.spec.ts b/examples/sites/demos/pc/app/dropdown/visible.spec.ts
new file mode 100644
index 0000000000..49843c032c
--- /dev/null
+++ b/examples/sites/demos/pc/app/dropdown/visible.spec.ts
@@ -0,0 +1,27 @@
+import { test, expect } from '@playwright/test'
+
+test('手动控制显隐', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('dropdown#visible')
+
+  const wrap = page.locator('#visible')
+  const dropDownMenu = page.locator('body > .tiny-dropdown-menu').locator('visible=true')
+
+  await wrap.getByText('点击显示').click()
+  await expect(dropDownMenu).toHaveCount(1)
+
+  await page.locator('#all-demos-container').click()
+  await expect(dropDownMenu).toHaveCount(1)
+
+  await dropDownMenu.locator('div').filter({ hasText: '黄金糕' }).nth(1).click()
+  await expect(dropDownMenu).toHaveCount(1)
+
+  await wrap.getByText('点击隐藏').click()
+  await expect(dropDownMenu).toHaveCount(0)
+
+  await wrap.getByText('点击显示').click()
+  await expect(dropDownMenu).toHaveCount(1)
+
+  await dropDownMenu.locator('div').filter({ hasText: '点击我隐藏' }).nth(1).click()
+  await expect(dropDownMenu).toHaveCount(0)
+})
diff --git a/examples/sites/demos/pc/app/dropdown/visible.vue b/examples/sites/demos/pc/app/dropdown/visible.vue
new file mode 100644
index 0000000000..51ef2f9efe
--- /dev/null
+++ b/examples/sites/demos/pc/app/dropdown/visible.vue
@@ -0,0 +1,61 @@
+<template>
+  <tiny-dropdown v-model:visible="visible" :show-icon="false" @item-click="itemClick" :hideOnClick="false">
+    <tiny-button @click="handleClick">点击{{ visible ? '隐藏' : '显示' }}</tiny-button>
+    <template #dropdown>
+      <tiny-dropdown-menu>
+        <tiny-dropdown-item
+          v-for="(item, index) in options"
+          :key="index"
+          :label="item.label"
+          :disabled="item.disabled"
+          :item-data="item"
+        ></tiny-dropdown-item>
+      </tiny-dropdown-menu>
+    </template>
+  </tiny-dropdown>
+</template>
+
+<script>
+import { TinyDropdown, TinyDropdownMenu, TinyDropdownItem, TinyButton } from '@opentiny/vue'
+
+export default {
+  components: {
+    TinyDropdown,
+    TinyDropdownMenu,
+    TinyDropdownItem,
+    TinyButton
+  },
+  data() {
+    return {
+      visible: false,
+      options: [
+        {
+          label: '黄金糕'
+        },
+        {
+          label: '点击我隐藏'
+        },
+        {
+          label: '螺蛳粉'
+        },
+        {
+          label: '双皮奶'
+        },
+        {
+          label: '蚵仔煎'
+        }
+      ]
+    }
+  },
+  methods: {
+    itemClick(e) {
+      if (e.itemData.label === '点击我隐藏') {
+        this.visible = false
+      }
+    },
+    handleClick() {
+      this.visible = !this.visible
+    }
+  }
+}
+</script>
diff --git a/examples/sites/demos/pc/app/dropdown/webdoc/dropdown.js b/examples/sites/demos/pc/app/dropdown/webdoc/dropdown.js
index 38ef6286ce..071b03632d 100644
--- a/examples/sites/demos/pc/app/dropdown/webdoc/dropdown.js
+++ b/examples/sites/demos/pc/app/dropdown/webdoc/dropdown.js
@@ -111,6 +111,19 @@ export default {
       },
       codeFiles: ['trigger.vue']
     },
+    {
+      demoId: 'visible',
+      name: {
+        'zh-CN': '手动控制显隐',
+        'en-US': 'Manual control of display and concealment'
+      },
+      desc: {
+        'zh-CN': '<p>通过 <code>visible</code> 属性手动控制下拉菜单显隐，优先级高于trigger。</p>\n',
+        'en-US':
+          '<p>Manually control the visibility of the dropdown menu through the<code>visible</code>attribute, with priority over trigger.</p>\n'
+      },
+      codeFiles: ['visible.vue']
+    },
     {
       demoId: 'tip',
       name: {
diff --git a/examples/sites/demos/pc/app/grid/editor/custom-edit.spec.js b/examples/sites/demos/pc/app/grid/editor/custom-edit.spec.js
index 8e740e46b6..59a7a634aa 100644
--- a/examples/sites/demos/pc/app/grid/editor/custom-edit.spec.js
+++ b/examples/sites/demos/pc/app/grid/editor/custom-edit.spec.js
@@ -3,6 +3,6 @@ import { test, expect } from '@playwright/test'
 test('多行编辑', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-editor#editor-custom-edit')
-  await expect(page.getByRole('row', { name: '1 请选择 保存 取消' }).getByRole('textbox').first()).toBeVisible()
-  await expect(page.getByRole('row', { name: '2 请选择 保存 取消' }).getByRole('textbox').first()).toBeVisible()
+  await expect(page.getByRole('cell', { name: 'GFD 科技有限公司' }).getByRole('textbox')).toBeVisible()
+  await expect(page.getByRole('cell', { name: 'WWWW 科技有限公司' }).getByRole('textbox')).toBeVisible()
 })
diff --git a/packages/renderless/package.json b/packages/renderless/package.json
index 419ada67a0..095593d64a 100644
--- a/packages/renderless/package.json
+++ b/packages/renderless/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/vue-renderless",
-  "version": "3.21.0",
+  "version": "3.21.1",
   "private": true,
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
   "author": "OpenTiny Team",
@@ -43,4 +43,4 @@
     "esno": "^4.7.0",
     "tsup": "7.2.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/renderless/src/dropdown/index.ts b/packages/renderless/src/dropdown/index.ts
index 3dfa5aa354..4b7940e0e4 100644
--- a/packages/renderless/src/dropdown/index.ts
+++ b/packages/renderless/src/dropdown/index.ts
@@ -39,24 +39,28 @@ export const watchFocusing = (parent: IDropdownRenderlessParams['parent']) => (v
 }
 
 export const show =
-  ({ props, state }: Pick<IDropdownRenderlessParams, 'props' | 'state'>) =>
+  ({ props, state, emit }: Pick<IDropdownRenderlessParams, 'props' | 'state' | 'emit'>) =>
   () => {
     if (props.disabled) {
       return
     }
 
-    clearTimeout(Number(state.timeout))
-
-    state.timeout = setTimeout(
-      () => {
-        state.visible = true
-      },
-      state.trigger === 'click' ? 0 : props.showTimeout
-    )
+    if (state.visibleIsBoolean) {
+      emit('update:visible', true)
+    } else {
+      clearTimeout(Number(state.timeout))
+
+      state.timeout = setTimeout(
+        () => {
+          state.visible = true
+        },
+        state.trigger === 'click' ? 0 : props.showTimeout
+      )
+    }
   }
 
 export const hide =
-  ({ api, props, state }: Pick<IDropdownRenderlessParams, 'api' | 'props' | 'state'>) =>
+  ({ api, props, state, emit }: Pick<IDropdownRenderlessParams, 'api' | 'props' | 'state' | 'emit'>) =>
   () => {
     if (props.disabled) {
       return
@@ -68,14 +72,18 @@ export const hide =
       api.resetTabindex(state.triggerElm)
     }
 
-    clearTimeout(Number(state.timeout))
-
-    state.timeout = setTimeout(
-      () => {
-        state.visible = false
-      },
-      state.trigger === 'click' ? 0 : props.hideTimeout
-    )
+    if (state.visibleIsBoolean) {
+      emit('update:visible', false)
+    } else {
+      clearTimeout(Number(state.timeout))
+
+      state.timeout = setTimeout(
+        () => {
+          state.visible = false
+        },
+        state.trigger === 'click' ? 0 : props.hideTimeout
+      )
+    }
   }
 
 export const handleClick =
@@ -85,9 +93,12 @@ export const handleClick =
       return
     }
 
-    emit('handle-click', state.visible)
-
-    state.visible ? api.hide() : api.show()
+    if (state.visibleIsBoolean) {
+      emit('handle-click', props.visible)
+    } else {
+      emit('handle-click', state.visible)
+      state.visible ? api.hide() : api.show()
+    }
   }
 
 export const handleTriggerKeyDown =
@@ -112,7 +123,7 @@ export const handleTriggerKeyDown =
   }
 
 export const handleItemKeyDown =
-  ({ api, props, state }: Pick<IDropdownRenderlessParams, 'api' | 'props' | 'state'>) =>
+  ({ api, props, state, emit }: Pick<IDropdownRenderlessParams, 'api' | 'props' | 'state' | 'emit'>) =>
   (event: KeyboardEvent) => {
     const keyCode = event.keyCode
     const target = event.target
@@ -199,6 +210,10 @@ export const initEvent =
       on(state.triggerElm, 'click', api.toggleFocusOnFalse)
     }
 
+    if (state.visibleIsBoolean) {
+      return
+    }
+
     if (state.trigger === 'hover') {
       on(state.triggerElm, 'mouseenter', api.show)
       on(state.triggerElm, 'mouseleave', api.hide)
@@ -262,7 +277,9 @@ export const mounted =
     vm.$on('selected-index', (selectedIndex) => {
       broadcast('TinyDropdownMenu', 'menu-selected-index', selectedIndex)
     })
-    vm.$on('is-disabled', api.clickOutside)
+    if (!state.visibleIsBoolean) {
+      vm.$on('is-disabled', api.clickOutside)
+    }
   }
 
 export const beforeDistory =
diff --git a/packages/renderless/src/dropdown/vue.ts b/packages/renderless/src/dropdown/vue.ts
index 009819d742..75a17ed12c 100644
--- a/packages/renderless/src/dropdown/vue.ts
+++ b/packages/renderless/src/dropdown/vue.ts
@@ -62,7 +62,8 @@ export const renderless = (
     designConfig,
     trigger: computed(() => {
       return props.trigger || designConfig?.props?.trigger || 'hover'
-    })
+    }),
+    visibleIsBoolean: computed(() => typeof props.visible === 'boolean')
   })
 
   provide('dropdownVm', vm)
@@ -71,12 +72,12 @@ export const renderless = (
     state,
     watchVisible: watchVisible({ broadcast, emit, nextTick }),
     watchFocusing: watchFocusing(parent),
-    show: show({ props, state }),
-    hide: hide({ api, props, state }),
+    show: show({ props, state, emit }),
+    hide: hide({ api, props, state, emit }),
     mounted: mounted({ api, vm, state, broadcast }),
     handleClick: handleClick({ api, props, state, emit }),
     handleTriggerKeyDown: handleTriggerKeyDown({ api, state }),
-    handleItemKeyDown: handleItemKeyDown({ api, props, state }),
+    handleItemKeyDown: handleItemKeyDown({ api, props, state, emit }),
     resetTabindex: resetTabindex(api),
     removeTabindex: removeTabindex(state),
     initAria: initAria({ state, props }),
@@ -91,7 +92,11 @@ export const renderless = (
     toggleFocusOnFalse: toggleFocus({ state, value: false })
   })
 
-  watch(() => state.visible, api.watchVisible)
+  if (typeof props.visible === 'boolean') {
+    watch(() => props.visible, api.watchVisible)
+  } else {
+    watch(() => state.visible, api.watchVisible)
+  }
   watch(() => state.focusing, api.watchFocusing)
 
   onMounted(api.mounted)
diff --git a/packages/renderless/types/dropdown.type.ts b/packages/renderless/types/dropdown.type.ts
index 2397fc0eef..bf407cc79e 100644
--- a/packages/renderless/types/dropdown.type.ts
+++ b/packages/renderless/types/dropdown.type.ts
@@ -20,7 +20,7 @@ export interface IDropdownState {
   visible: boolean
   timeout: null | NodeJS.Timeout
   focusing: false
-  menuItems: NodeListOf<HTMLElement> | undefined | null
+  menuItems: NodeListOf<HTMLElement> | undefined | null | []
   menuItemsArray: HTMLElement[] | null
   triggerElm: HTMLElement | null
   dropdownElm: HTMLElement | null
@@ -28,6 +28,8 @@ export interface IDropdownState {
   showIcon: boolean
   showSelfIcon: boolean
   designConfig: IDropdownRenderlessParamUtils['designConfig']
+  trigger: 'click' | 'hover'
+  visibleIsBoolean: boolean
 }
 
 export interface IDropdownApi {
diff --git a/packages/theme/package.json b/packages/theme/package.json
index 0204756a49..657cb46645 100644
--- a/packages/theme/package.json
+++ b/packages/theme/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@opentiny/vue-theme",
   "type": "module",
-  "version": "3.21.1",
+  "version": "3.21.2",
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
   "author": "OpenTiny Team",
   "license": "MIT",
@@ -93,4 +93,4 @@
       ]
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/theme/src/base/reset.less b/packages/theme/src/base/reset.less
index eb237cdff0..feb297ea19 100644
--- a/packages/theme/src/base/reset.less
+++ b/packages/theme/src/base/reset.less
@@ -197,9 +197,9 @@
 }
 
 // 有箭头的场景，统一规范所有样式
-.tiny-popconfirm-popover:has(.popper__arrow),
-.tiny-popper:has(.popper__arrow),
-.tiny-tooltip__popper:has(.popper__arrow) {
+.tiny-popconfirm-popover,
+.tiny-popper,
+.tiny-tooltip__popper {
   .popper__arrow {
     position: absolute;
     display: block;
@@ -243,4 +243,4 @@
       right: -3px;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/vue/package.json b/packages/vue/package.json
index dadf75dfea..96b77bfb65 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@opentiny/vue",
   "private": true,
-  "version": "3.21.1",
+  "version": "3.21.2",
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
   "homepage": "https://opentiny.design/tiny-vue",
   "keywords": [
@@ -275,4 +275,4 @@
     "build": "pnpm -w build:ui",
     "postversion": "pnpm build"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/vue/src/dropdown/package.json b/packages/vue/src/dropdown/package.json
index 289567fdce..56f9a64039 100644
--- a/packages/vue/src/dropdown/package.json
+++ b/packages/vue/src/dropdown/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/vue-dropdown",
-  "version": "3.21.0",
+  "version": "3.21.1",
   "description": "",
   "main": "lib/index.js",
   "module": "index.ts",
diff --git a/packages/vue/src/dropdown/src/index.ts b/packages/vue/src/dropdown/src/index.ts
index ea71149d7c..f3e09ee9d9 100644
--- a/packages/vue/src/dropdown/src/index.ts
+++ b/packages/vue/src/dropdown/src/index.ts
@@ -4,6 +4,11 @@ import template from 'virtual-template?pc|mobile-first'
 export const dropdownProps = {
   ...$props,
   modelValue: [String, Number],
+  // tiny新增
+  visible: {
+    type: Boolean || undefined,
+    default: undefined
+  },
   type: String,
   trigger: String, // 默认主题为 'hover'
   size: {
diff --git a/packages/vue/src/dropdown/src/pc.vue b/packages/vue/src/dropdown/src/pc.vue
index cdbd09fa9a..e6f515d02a 100644
--- a/packages/vue/src/dropdown/src/pc.vue
+++ b/packages/vue/src/dropdown/src/pc.vue
@@ -33,6 +33,11 @@ export default defineComponent({
     ...$props,
     type: String,
     trigger: String,
+    // tiny新增
+    visible: {
+      type: Boolean || undefined,
+      default: undefined
+    },
     size: {
       type: String,
       default: ''
@@ -101,7 +106,8 @@ export default defineComponent({
     'menu-item-click',
     'handle-click',
     'is-disabled',
-    'selected-index'
+    'selected-index',
+    'update:visible'
   ],
   setup(props, context) {
     return setup({ props, context, renderless, api, h })
@@ -189,7 +195,9 @@ export default defineComponent({
       ) : (
         <span
           ref="trigger"
-          class={`is-text${state.visible ? ' is-expand' : ' is-hide'}${disabled ? ' is-disabled' : ''} ${triggerClass}`}>
+          class={`is-text${state.visible ? ' is-expand' : ' is-hide'}${
+            disabled ? ' is-disabled' : ''
+          } ${triggerClass}`}>
           {prefixInner}
           {defaultTriggerElm}
           {suffixInner}
@@ -208,7 +216,7 @@ export default defineComponent({
     const menuElm = disabled ? null : (slots.dropdown && slots.dropdown()) || defaulMenuElm
 
     return (
-      <div class="tiny-dropdown" v-clickoutside={clickOutside} aria-disabled={disabled}>
+      <div class="tiny-dropdown" v-clickoutside={!state.visibleIsBoolean && clickOutside} aria-disabled={disabled}>
         {triggerElm}
         {menuElm}
       </div>
diff --git a/packages/vue/src/grid/package.json b/packages/vue/src/grid/package.json
index 3fbabf144d..e2b2a44744 100644
--- a/packages/vue/src/grid/package.json
+++ b/packages/vue/src/grid/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@opentiny/vue-grid",
   "type": "module",
-  "version": "3.21.1",
+  "version": "3.21.2",
   "description": "",
   "license": "MIT",
   "sideEffects": false,
diff --git a/packages/vue/src/grid/src/body/src/body.tsx b/packages/vue/src/grid/src/body/src/body.tsx
index c6b7ec9680..9362579251 100644
--- a/packages/vue/src/grid/src/body/src/body.tsx
+++ b/packages/vue/src/grid/src/body/src/body.tsx
@@ -751,11 +751,12 @@ function renderDefEmpty(h) {
 }
 
 const syncHeaderAndFooterScroll = ({ bodyElem, footerElem, headerElem, isX }) => {
+  const scrollLeft = bodyElem.scrollLeft
   if (isX && headerElem) {
-    headerElem.scrollLeft = bodyElem.scrollLeft
+    headerElem.scrollLeft = scrollLeft
   }
   if (isX && footerElem) {
-    footerElem.scrollLeft = bodyElem.scrollLeft
+    footerElem.scrollLeft = scrollLeft
   }
 }
 
@@ -870,10 +871,6 @@ export default defineComponent({
     // 空数据元素
     elemStore[`${keyPrefix}emptyBlock`] = $refs.emptyBlock
 
-    // 表体第一层div监听滚动事件
-    $el.onscroll = this.scrollEvent
-    $el._onscroll = this.scrollEvent
-
     if (dropConfig) {
       const { plugin, row = true } = dropConfig
       plugin && row && (this.rowSortable = $table.rowDrop(this.$el))
@@ -907,7 +904,10 @@ export default defineComponent({
       'div',
       {
         ref: 'body',
-        class: ['tiny-grid__body-wrapper', 'body__wrapper', { [classMap.isScrollload]: scrollLoad }]
+        class: ['tiny-grid__body-wrapper', 'body__wrapper', { [classMap.isScrollload]: scrollLoad }],
+        on: {
+          scroll: this.scrollEvent
+        }
       },
       [
         // 表格主体内容x轴方向虚拟滚动条占位元素
diff --git a/packages/vue/src/grid/src/table/src/methods.ts b/packages/vue/src/grid/src/table/src/methods.ts
index b97546746d..6f6a16dd78 100644
--- a/packages/vue/src/grid/src/table/src/methods.ts
+++ b/packages/vue/src/grid/src/table/src/methods.ts
@@ -1644,8 +1644,10 @@ const Methods = {
       // 设置新的渲染列触发Vue渲染
       this.tableColumn = ret.tableColumn
       this.visibleColumnChanged = ret.visibleColumnChanged
-
-      this.$nextTick(this.updateStyle)
+      this.$nextTick(() => {
+        this.updateFooter()
+        this.updateStyle()
+      })
     })
   },
   // 更新横向 X 可视渲染上下剩余空间大小
diff --git a/packages/vue/src/grid/src/table/src/utils/updateStyle.ts b/packages/vue/src/grid/src/table/src/utils/updateStyle.ts
index eb2d7af0f1..f9d9e513a0 100644
--- a/packages/vue/src/grid/src/table/src/utils/updateStyle.ts
+++ b/packages/vue/src/grid/src/table/src/utils/updateStyle.ts
@@ -44,6 +44,7 @@ function getTableWidth({ scrollXLoad, tWidth, tableColumn }) {
 }
 
 function layoutFooter({
+  elemStore,
   customHeight,
   footerHeight,
   headerHeight,
@@ -61,6 +62,11 @@ function layoutFooter({
   let tWidth = tableWidth
   // 如果是固定列与设置了超出隐藏
   let ret = getTableWidth({ scrollXLoad, tWidth, tableColumn })
+  // 为表尾设置虚拟滚动占位宽度
+  const spaceElem = elemStore['main-footer-x-space']
+  if (spaceElem) {
+    spaceElem.style.width = `${tableWidth}px`
+  }
 
   tableColumn = ret.tableColumn
   tWidth = ret.tWidth
@@ -242,6 +248,7 @@ export function handleLayout(params) {
     tableColumn = ret.tableColumn
   } else if (layout === 'footer') {
     tableColumn = layoutFooter({
+      elemStore,
       customHeight,
       fixedWrapperElem,
       footerHeight,