资讯专栏INFORMATION COLUMN

在手机自带浏览器遇到的一个关于position的坑,absolute设置的位置没出现在预期

guqiu / 2767人阅读

摘要:结构是这样的样式是这样的但是发现在一些浏览器上并没有距离底边而是距离的底部我的解决方法是我觉得肯定还有其他的解决办法,一时没想到,想着向大家学习下,看看其他的解决办法

结构是这样的

something

样式是这样的

.box {
  position: relative;
  width: 160px;
  height: 160px;
  border: 1px solid #f3f5f7;
}
.content {
  width: 100%;
  height: 40px;
  background-color: #ee0000;
}
.inner {
  position: absolute;
  left: 0;
  bottom: 15px;
  width: 100%;
  height: 40px;
  background-color: #f3f5f7;
}

但是发现在一些浏览器上并没有距离底边15px,而是距离.content的底部15px;

我的解决方法是:

something

我觉得肯定还有其他的解决办法,一时没想到,想着向大家学习下,看看其他的解决办法

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/50673.html

相关文章

  • 手机自带览器遇到一个关于position坑,absolute设置位置出现预期

    摘要:结构是这样的样式是这样的但是发现在一些浏览器上并没有距离底边而是距离的底部我的解决方法是我觉得肯定还有其他的解决办法,一时没想到,想着向大家学习下,看看其他的解决办法 结构是这样的 something 样式是这样的 .box { position: relative; width: 160px; height: 160px; border: 1px sol...

    233jl 评论0 收藏0
  • 关于移动端基础布局概念方式和常见问题总结 (不定时更新)

    摘要:前言本来是打算写写怎么使用进行移动端的布局的然后前面还加些像素基本知识铺垫后面又加了些属性概念最后还来些常见布局问题和系统样式果然排版也是门高深学问这里有些自己写的有些看完之后总结出来的还有些别人那里搬来的顺带会送上飞机票告诉你们来源在哪 前言 本来是打算写写怎么使用 lib-flexible 进行移动端的布局的, 然后前面还加些像素基本知识铺垫, 后面又加了些 CSS 属性概念, 最...

    chenjiang3 评论0 收藏0
  • 关于移动端基础布局概念方式和常见问题总结 (不定时更新)

    摘要:前言本来是打算写写怎么使用进行移动端的布局的然后前面还加些像素基本知识铺垫后面又加了些属性概念最后还来些常见布局问题和系统样式果然排版也是门高深学问这里有些自己写的有些看完之后总结出来的还有些别人那里搬来的顺带会送上飞机票告诉你们来源在哪 前言 本来是打算写写怎么使用 lib-flexible 进行移动端的布局的, 然后前面还加些像素基本知识铺垫, 后面又加了些 CSS 属性概念, 最...

    elliott_hu 评论0 收藏0

发表评论

0条评论

guqiu

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<