Изменить поплавок для последнего элемента ul

Question

Изменить поплавок для последнего элемента ul

0

У меня проблема с плавающей. Я делаю навигационную панель. Он должен быть встроен с левым плавающим, а последний элемент должен быть на конце строки (правый поплавок).

Я попробовал маржу слева, но это не хорошо...

ul {
 position: static;
 list-style-type:none;
 margin-left:150px;
 margin-top: 11px;
 padding:0;
 overflow:hidden;
}

ul  li{
 float: left;
 margin-left: 30px;
}

ul li a{
 color: inherit;
 text-decoration: none;
 height: 72px;
 font-weight: bold;
 font-size: 19px;
 }

 ul li:last-child a{
  position: relative;
  margin-right: 0%;
 }

mia654321 17 дек. 2013, в 10:31

Источник

3

Сделайте образец на jsfiddle.net
Niels Keurentjes 17 дек. 2013, в 09:28
0

Вам не нужно position: static;
Mr. Alien 17 дек. 2013, в 09:31
0

используйте float: правильно для li: last-child
radha 17 дек. 2013, в 09:32
0

Лично я нахожу плавающим последний элемент справа справа, почему бы не сместить их все влево с помощью margin-right и просто удалить margin-right на последнем дочернем элементе?
Doidgey 17 дек. 2013, в 09:39

Показать ещё 2 комментария

Теги:

html

css

4 ответа

0

Сделайте последний <li> float: right:

http://jsfiddle.net/YDAkV/

ul li:last-child {
    float: right;
}

Banana-In-Black 17 дек. 2013, в 08:13

0

Пытаться:

ul li:last-child{
    position: relative;
    margin-left: 0%;
}

ДЕМО здесь.

Hiral 17 дек. 2013, в 07:37

0

Спасибо. Я вижу, что моя проблема: ul li: last-child a {}

хорошего дня ;)

mia654321 17 дек. 2013, в 07:32

0

Возможно, вы захотите принять ответ ниже, поскольку кто-то указал на это и привел вас к этому открытию
Doidgey 17 дек. 2013, в 09:40

Ещё вопросы

используйте float: правильно для li: last-child
Лично я нахожу плавающим последний элемент справа справа, почему бы не сместить их все влево с помощью margin-right и просто удалить margin-right на последнем дочернем элементе?
Возможно, вы захотите принять ответ ниже, поскольку кто-то указал на это и привел вас к этому открытию

FelipeAls · Accepted Answer · 2013-12-17T06-54-00.000Z

Вы должны поплавать этим последним, так же просто, как:

ul li:last-child {
    float: right;
}

JSfiddle: http://jsfiddle.net/PhilippeVay/eLLa4/ (с удалением всех дополнительных объявлений, когда я не видел, как они будут полезны в этой скрипке, например, относительное позиционирование детей, не перемещающихся сверху, справа, внизу или оставить...)

Полный CSS:

ul {
 list-style-type: none;
 margin-left: 150px;
 margin-top: 11px;
 padding: 0;
 overflow: hidden;
}

ul li {
 float: left;
 margin-left: 30px;
}
 ul li:last-child {
  float: right;
}

ul li a {
 color: inherit;
 text-decoration: none;
 height: 72px;
 font-weight: bold;
 font-size: 19px;
}

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