底部固定div被android键盘推高

Question

我在底部有一个固定的div，但是在响应视图中，在android中，它会随着键盘向上推。

const ContactBackgroundImage = styled.div`
  color: white
  padding: 50px
  height: 118px
  position: fixed
  bottom: 0
  left: 0
  right: 2px
  text-align: left
  background-position: top
  background-repeat: no-repeat
  background-image: url('/Images/background.png');
  @media (max-width: 480px) {
    background-position: left top
  }
`;

然后我的div正在渲染它。

<ContactBackgroundImage/>

当应用程序在Android手机中处于响应模式时，键盘会将div向上推。我希望div留在滑水板的底部

Answer 1

//希望添加评论，但信誉不高，因此我将其发布为答案，并在错误的情况下将其删除。

您是否尝试过为div设置z-index？也许它与android键盘位于同一层，因此被推入。

Answer 2

我前段时间遇到了同样的问题，而不是使用position:fixed或position:absolute来使用position:relative并尝试使用top:100%来定位。

const ContactBackgroundImage = styled.div'
  color: white
  padding: 50px
  height: 118px
  position: absolute
  bottom:0
  left: 0
  right: 2px
  text-align: left
  background-position: top
  background-repeat: no-repeat
  background-image: url('/Images/background.png');
  @media (max-width: 480px) {
    background-position: left top
  }
`;