Создание навигационной панели даже в CSS/HTML

Question

, поэтому я пытаюсь получить мой навигационный бар в принципе, выгляжу лучше, я разработал его в основном, как я хочу его в CSS, но каждая ссылка имеет размер в соответствии с его размер каждого слова, поэтому каждый блок/ссылка имеет разные размеры (надеюсь, что это имеет смысл), поэтому я хочу сделать их одинаковыми по размеру, не зависящими от длины слова. Я также хочу изменить цвет за ссылками (в основном сделать так, чтобы цвет простирался в стороны). Я включил ссылку на картинку, объясняющую, о чем я говорю: http://postimg.org/image/mdoq7vwy7/. Заранее спасибо!

Answer 1

Чтобы сделать каждую ссылку в навигационной панели той же ширины, дать им все тот же класс и сделать этот CSS:

.list-class { width: 100px; }

И сделать цвет растянуть мимо краев, я хотел бы попробовать это:

li { padding-left: 5px; padding-right: 5px }

Предполагая, что вы используете списки для навигационной панели. Немного сложно помочь без кода, но, надеюсь, это помогло

Answer 2

Вы хотите использовать flexbox. Flexbox может сделать все элементы одинакового размера независимо от содержимого.

JSFiddle

ul{ 
    display:-webkit-box; 
    display:-webkit-flex; 
    display:-ms-flexbox; 
    display:flex; 
    list-style-type:none; 
} 
ul li{ 
    -webkit-box-flex:1; 
    -webkit-flex:1; 
    -ms-flex:1; 
    flex:1; 
    text-align:center; 
} 

PS. Трудно дать вам помощь, если вы не указали какой-либо код.