absolute的left和right的妙用

之前做了一个自定义鼠标右键的布局，做的过程中遇到了一个很有趣的问题，之前一直没有注意到。

目标样式如下：

期初并不知道文字内容需要随机，所以写的时候写“死”了。

所有的内容都是按照设计的四个文字走的，给了，二级菜单“rightMouse_1”使用的是“position: absolute;left: 150px;”；一切都很完美，直到... ...发现突然有一个非“四字”的冒出来，文字折行显示了...怎么办？快给一个最小宽度，让它自适应吧~

哦，不起作用，绝对定位以后，脱离了文档流，那怎么办？改。改。改。

咦，可以了，我用了什么？

只是把left换成了right就可以了。。。文字宽度就可以自适应了！

就是这么神奇！

 1 <div class="rightMouse">

 2     <ul class="rightMouseLevel_1">

 3         <li>

 4             <a>一级菜单</a>

 5             <div class="rightMouse_1">

 6                 <ul class="rightMouseLevel_2">

 7                     <li><a>二级菜单</a></li>

 8                     <li><a>二级菜单</a></li>

 9                     <li><a>我是二级菜单例子</a></li>

10                 </ul>

11             </div>

12         </li>

13         <li><a>一级菜单</a></li>

14         <li><a>一级菜单</a></li>

15         <li><a>一级菜单</a></li>

16         <li><a>一级菜单</a></li>

17         <li><a>一级菜单</a></li>

18     </ul>

19 </div>

巴特西

absolute的left和right的妙用

最新文章

热门文章