Bootstrap的下拉菜单float问题_html/css_WEB-ITnose
程序员文章站
2022-04-11 17:35:54
...
在学习bootstrap中的下拉菜单时,遇到下面情况:
添加ul的类名为pull-right或dropdown-menu-right,可以改变下拉菜单的对其方向,效果图为:
默认样式为:
下面贴上:.pull-right的css代码
.dropdown-menu.pull-right { right: 0; left: auto;}.dropdown-menu-right { right: 0; left: auto;}
但还需要设置父元素div的样式为float:left!!!
原因:
div是块级元素,会自动填满父元素的宽度,效果图:
当设置了div的float为left之后,div会脱离文档流,从而包裹button元素,是菜单向button右边对齐
假如你有补充,请评论下。么么哒~~~
推荐阅读
-
快速解决bootstrap下拉菜单无法隐藏的问题
-
TextView采用setText赋值之后不能立即显示在页面上的问题解决_html/css_WEB-ITnose
-
终于成为博客员的一员了,这是我的第一篇博文,写一个关于ul li内容宽度的问题和解决方案_html/css_WEB-ITnose
-
菜鸟:关于24小时循环倒计时的问题_html/css_WEB-ITnose
-
菜鸟关于网页设计的一个小问题,在线等答案~_html/css_WEB-ITnose
-
css平铺的问题_html/css_WEB-ITnose
-
请问一个简单的问题_html/css_WEB-ITnose
-
简单的单级下拉菜单实现_html/css_WEB-ITnose
-
关于浏览器默认CSS的问题_html/css_WEB-ITnose
-
ul li的兼容性问题_html/css_WEB-ITnose