0
ページの下部にナビゲーションがあります。すべてがうまく動作し、1つの小さなバグを除いてどのようにしたいのですか？解決策を見つけることができません...浮動リンク要素を親divの100％の高さにするには
ページの名前が長くてiPadサイズの画面で見ると、私は隣接ボタンが高さに一致するように（どれも同じ高さにとどまるように）、どのようにして水平に整列したままにしたいのかを、2行に分けています。
Iveはディスプレイテーブルやテーブルセル、フレックスなどのいくつかの異なるものを試しましたが、正しく動作する解決策を見つけられないようです。
私はこれをどのようにすることができますか？
.footerNav-wrapper {
\t width: 100%;
\t background-color: #000;
\t padding: 35px 0;
\t z-index: 9000;
\t position: relative;
}
.footerNav {
\t width: 90%;
\t max-width: 1000px;
\t margin: 0 auto;
}
.navArrow-left {
\t float: left;
\t margin: 0;
\t position: absolute;
\t top: 30%;
\t left: 10px
}
.navArrow-right {
\t float: right;
\t margin: 0;
\t position: absolute;
\t top: 30%;
\t right: 10px;
}
.footerNav a {
\t width: 49%;
\t font-family: 'ABCSans-Regular', Arial, sans-serif;
\t border: 1px solid #fff;
\t background-color: #000;
\t color:#ffc600;
\t margin: 0;
\t text-align: center;
\t font-size: 14px;
\t line-height: 18px;
\t letter-spacing: 0px;
\t cursor: pointer;
\t -webkit-transition: all .5s;
transition: all .5s;
\t text-decoration: none;
\t box-sizing: border-box;
\t position: relative;
}
.footerNav a:hover {
\t border: 1px solid #ffc600;
\t background-color: #ffc600;
\t color: #000;
\t text-decoration: none;
}
.left {
\t float: left;
\t text-align: left !important;
\t padding: 15px 15px 12px 45px;
}
.right {
\t float: right;
\t text-align: right !important;
\t padding: 15px 45px 12px 15px;
}<div class="footerNav-wrapper">
\t <nav class="footerNav">
\t <a href="#" class="left">
\t <img src="images/arrow-left-white.png" class="navArrow-left" alt="Previous page">
\t PREVIOUS PAGE NAME
</a>
<a href="c#" class="right">
NEXT PAGE NAME - THIS IS AN EXTRA LONG NAME
<img src="images/arrow-right-white.png" class="navArrow-right" alt="Next page">
</a>
<div style="clear:both;"></div>
</nav>
</div>