Twitter bootstrap 将li链接与引导4 Alpha 6(flexbox)导航栏中的底部对齐
所以我一直在尝试在导航栏中设置一个菜单,使其与li的底部对齐,而不是中间对齐 因为我有两个菜单,最上面的一个是呼叫我们和登录,最下面的一个是网页的各个部分 现在我的问题是,如何将顶部菜单与LI的底部对齐,而不是居中对齐。已尝试将文本底部对齐和底部对齐:Twitter bootstrap 将li链接与引导4 Alpha 6(flexbox)导航栏中的底部对齐,twitter-bootstrap,Twitter Bootstrap,所以我一直在尝试在导航栏中设置一个菜单,使其与li的底部对齐,而不是中间对齐 因为我有两个菜单,最上面的一个是呼叫我们和登录,最下面的一个是网页的各个部分 现在我的问题是,如何将顶部菜单与LI的底部对齐,而不是居中对齐。已尝试将文本底部对齐和底部对齐: <nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse"> <div class="container"> <but
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
<div class="container">
<button class="navbar-toggler navbar-toggler-right align-self-center mt-3" type="button" data-toggle="collapse" data-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="#"><object class="svgLogoBig" data="assets/svg/Logo.svg"></object></a>
<div class="collapse navbar navbar-collapse flex-column ml-lg-0 ml-3" id="navbarCollapse">
<div class="navbar-collapse collapse" id="collapsingNavbar3">
<H1 class="firstMenuLine navbar-nav ml-auto w-100">DBFS</H1>
<ul class="firstMenuLine navbar-nav ml-auto w-100 justify-content-end align-baseline">
<li class="nav-item align-text-bottom">
<a class="nav-link" href="tel:555-555-555">Call Us Now: <span class="phoneNumber">555-555-555<span></span></a>
</li>
<li class="nav-item align-bottom">
<a class="nav-link" href="open_login">Login</a>
</li>
</ul>
</div>
<div class="navbar-collapse collapse" id="collapsingNavbar3">
<H2 class="secondMenuLine navbar-nav ml-auto w-100">Delivering Change </H2>
<H2>
<ul class="secondMenuLine navbar-nav ml-auto w-100 justify-content-end">
<li class="nav-item">
<a class="nav-link py-1 pr-3" href="/news">Big1</a>
</li>
<li class="nav-item">
<a class="nav-link py-1 pr-3" href="/advice">Big2</a>
</li>
<li class="nav-item active">
<a class="nav-link py-1 pr-3" href="#">Big3</a>
</li>
<li class="nav-item">
<a class="nav-link py-1 pr-3" href="/deliver">Big4</a>
</li>
<li class="nav-item">
<a class="nav-link py-1 pr-3" href="/career">Big5</a>
</li>
</ul>
</H2>
</div>
</div>
</div>
</nav>
你能发布所有的导航条形码吗。这只是折叠部分。很抱歉,上面的代码已更新
<div class="navbar-collapse collapse" id="collapsingNavbar3">
<H1 class="firstMenuLine navbar-nav ml-auto w-100">DBFS</H1>
<ul class="firstMenuLine navbar-nav ml-auto w-100 justify-content-end align-baseline">
<li class="nav-item align-text-bottom">
<a class="nav-link" href="tel:555-555-555">Call Us Now: <span class="phoneNumber">555-555-555<span></span></a>
</li>
<li class="nav-item align-bottom">
<a class="nav-link" href="open_login">Login</a>
</li>
</ul>
</div>
.align-text-bottom {
vertical-align: text-bottom!important;
}