我的导航栏不会从左到右完全伸展（我解释） [英] My navigation bar will not stretch from left to right fully (I explain)

问题描述

您好。到目前为止，导航栏的设计是正确的。然而，我现在拥有的一个问题是，按钮不会拉伸/定位在整个导航栏上，它们之间的空间相等。附件是当前导航栏和Facebook的导航栏。我还创建了一个小提琴，供您查看我当前的代码// https://jsfiddle.net/6avtbqzh/





导航栏目前// [IMG] http://oi58.tinypic.com/2z3wfuu.jpg [/ IMG]

我想要它的一点点// [IMG] http： //oi60.tinypic.com/w2ee0y.jpg [/ IMG]



请解决此问题，或告诉我如何操作。

谢谢，Reece。



注意：我今年15岁，是新手。这是假期，我通过亲自动手学习最好。所以在这里，我试图建立一个主要用于自我教育的网站。

Hello. The design of the navigational bar so far is correct. However, the one issue which I now have, Is that the buttons will not stretch/be positioned across the entire nav-bar, with equal space between them. Attached is the current navigation bar, and Facebook's navigational bar. I also created a 'Fiddle' for you to see my current code // https://jsfiddle.net/6avtbqzh/


Navigation Bar at the moment // [IMG]http://oi58.tinypic.com/2z3wfuu.jpg [/IMG]
A little how I want it to be // [IMG]http://oi60.tinypic.com/w2ee0y.jpg [/IMG]

Please fix this, or inform me of how to.
Thanks, Reece.

Note: I am 15, and new to this. It's the holiday and I learn best by making things hand-on. So here I am, attempting to make a website for the primary use of self-education.

推荐答案

li {
    float: left;
    width: 20%; /* 5(li) x 20(each) - [ left & right borders, padding, margin ] = 100% */
...
}

a:link, a:visited {
    display: block;
    width: 100%;
...

这篇关于我的导航栏不会从左到右完全伸展（我解释）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！