<div style="width:80px;height:50px;position:relative;left:50px;">

  <ul style="position:absolute;top:100%;background:#f00;margin:0;padding:0;">

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

  </ul>

</div>

<div style="width:80px;height:50px;position:relative;left:50px;">

  <ul style="position:absolute;top:100%;background:#f00;margin:0;padding:0;">

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

    <li style="float:left;width:33px;padding:0;margin:0;">A</li>

  </ul>

</div>

在pos:a元素不设定宽度的情况下，他的最大宽度是受父元素的宽度所限制的。的更多相关文章

  1. 小程序行内元素且有border的情况下，根据文字宽度自动调节元素宽度

    比如认识成都: <view style="display: flex;align-items: center;"> <text class="cityV ...

  2. 解决flex布局下， elementui table组件不能跟随父组件的宽度而变化的bug

    bug: 我在flex布局的元素中使用了elementui的table组件,饿了么的table上会被加一个动态的宽度, 当第一次改变flex元素宽度的时候.table的动态宽度会变化,第二次和以后就不 ...

  3. [转] 在body中没有元素把高度撑开的情况下，设置全屏

    [From] https://segmentfault.com/q/1010000006182839 html,body { margin:; padding:; min-height: 100vh; ...

  4. 如何让 height:100%; 起作用---父级元素必须设定高度

    参考: http://www.webhek.com/post/css-100-percent-height.html https://www.cnblogs.com/kunmomo/p/1060066 ...

  5. 父元素高度为auto,子元素使用top:-50%没有效果的问题

    无意间在实现元素垂直居中的一种方式测试到,当一个元素高度没有指定的情况下,其 postion:relative;top:-50%;无效 后来查阅w3c看到这样一句话: <percentage&g ...

  6. CSSmargin击穿问题（子元素margin-top会影响父元素）

    最近写一个H5页面的时候发现了这个被忽视的问题,一时没想到什么原因,搜了半天,记录一下,方便他人踩坑.唉,有些东西不用就忘. 一.问题描述 <div class="container& ...

  7. 解决子元素设置margin-top，效果到父元素上的问题

    有时当我们设置子元素的margin-top,但是却发现子元素没有出现上外边距的效果,反而是父元素出现了上外边距的效果. 这种问题的解决方法如下: 1.给父元素加边框. 2.给父元素设置padding- ...

  8. 父元素与子元素之间的margin-top问题

    父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. html代码: <div c ...

  9. HTML 父元素与子元素之间的margin-top问题

    问题: 父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. 代码如下: <div ...

随机推荐

  1. P3531 [POI2012]LIT-Letters

    题目描述 Little Johnny has a very long surname. Yet he is not the only such person in his milieu. As it ...

  2. [TJOI2017][bzoj4889] 不勤劳的图书管理员 [线段树套线段树]

    题面 传送门 思路 考虑两本书的位置交换对答案的贡献: (为了方便描述,用"左边那本"和"右边那本"称呼两本我们要交换的书,"中间那本"是我 ...

  3. flex弹性布局的基本介绍

    最近开始做元素排列比较复杂的项目,同时需要各种型号手机的适配,我发现以前所掌握的盒子模型.display.position.float等已经不能满足我的需求了, 于是开始着重学习flex弹性布局并运用 ...

  4. 纯css美化复选框，单选框，滑动条（range）

    <div class="box"> <!-- 借鉴地址:http://www.cnblogs.com/xiaoxianweb/p/5465607.html --& ...

  5. bzoj 3111 蚂蚁 动态规划

    题目描述 在一个 n*m 的棋盘上,每个格子有一个权值,初始时,在某个格子的顶点处一只面朝北的蚂蚁,我们只知道它的行走路线是如何转弯,却不知道每次转弯前走了多长. 蚂蚁转弯是有一定特点的,即它的转弯序 ...

  6. java 竖线分割字符串的问题

    java 竖线分割字符串的问题 例1: String[] paraStr = "6010;320100;A".split(";"); System.out.pr ...

  7. YYH的王国（NOIP模拟赛Round 6）

    题目描述 YYH拥有一个有n个城市的国家,编号为1~n.其中城市i到城市j的路径长度为i和j的最小公倍数.现在YYH想建一些高速公路,使得任意两座城市都能通过高速公路直接或间接到达.建造一条高速公路的 ...

  8. IOS VLC编译步骤（包含移植和截图功能）

    http://blog.csdn.net/Kan_Crystal/article/details/40424673 一.下载源码 先到VLC官网将源码下载到本机,以下链接为官网编译操作地址:https ...

  9. Linux/Android——input_handler之evdev (四) 【转】

    转自:http://blog.csdn.net/u013491946/article/details/72638919 版权声明:免责声明: 本人在此发文(包括但不限于汉字.拼音.拉丁字母)均为随意敲 ...

  10. Resin4 自定义端口

    1. Resin4配置文件发生了较大变化,分为: app-default.xml  web应用配置 cluster-default.xml  集群配置 health.xml -- 非pro版不支持 r ...