html – 未能在下拉bootstrap3导航栏中将徽章对齐到右侧
发布时间:2020-12-14 18:38:51 所属栏目:资源 来源:网络整理
导读:尝试将徽章对齐到每个下拉菜单的右侧.目前,徽章看起来像这样: 使用相关代码: div class="collapse navbar-collapse" ul class="nav navbar-nav" li class="dropdown " a data-target="/business" href="/business" class="dropdown-toggle" data-toggle="d
尝试将徽章对齐到每个下拉菜单的右侧.目前,徽章看起来像这样:
使用相关代码: <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="dropdown "> <a data-target="/business" href="/business" class="dropdown-toggle" data-toggle="dropdown">Business<b class="caret"></b></a> <ul class="dropdown-menu"> <li > <a href="/economy">Economy <span class='badge' today: 2</span></a> </li> <li > <a href="/financials">Financial Reports <span class='badge' today: 78</span></a> </li> <li > <a href="/interest">Interest Rates </a> </li> </ul> </li> </ul> </div> 将“pull-right”添加到徽章类()会导致徽章崩溃: 另外,使用boostrap3,使用bootswatch cosmo模板(如果相关的话).这里有什么想法? 解决方法
您缺少结算>在SPAN标签上,你的类名使用’not’,你的data-target属性有一个无效的前导斜杠(至少这些是我在测试时发现的).我能让它工作的唯一方法是组合父UL的固定宽度,以及右浮动(“拉 – 右”)徽章跨度.
以下在Twitter-Bootstrap 3下在Firefox和Chrome中成功测试: <li class="dropdown "> <a data-target="business" href="/business" class="dropdown-toggle" data-toggle="dropdown">Business<b class="caret"></b></a> <ul class="dropdown-menu" style="width:250px;"> <li> <a href="/economy"><span class="badge pull-right">today: 2</span>Economy</a> </li> <li> <a href="/financials"><span class="badge pull-right">today: 78</span>Financial Reports</a> </li> <li> <a href="/interest">Interest Rates </a> </li> </ul> </li> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |