Задать вопрос
MasterGerold
@MasterGerold

Как прижать flex-контейнер к правой стороне?

Доброго времени суток! Вот есть такое меню:
ee5a00e9ff1b4f399616525bbfede7bb.png
Все пункты меню это li в ul, то есть списком. Вот CSS:
.header-menu
  width: 100%
  display: flex
  margin: 0
  & > li
    display: flex
    justify-content: center
    flex-direction: column
    margin-right: 15px
    margin-left: 15px
    position: relative

Каждый li тоже flex-контейнер получается (если я правильно понимаю). Мне нужно сделать для двух последних так сказать float: right. Но я что то не могу понять как это сделать. ul у меня на всю ширину растянут, то есть куда их двигать места хватает. Пробовал разные justify и align но чего то не получается :(
Подскажите как правильно это реализовать. Заранее спасибо!
  • Вопрос задан
  • 6734 просмотра
Подписаться 2 Оценить Комментировать
Решения вопроса 3
Xserber
@Xserber
Full-stack developer. React.js, AngularJS + NodeJS
Банальный margin-left: auto творит чудеса. Привет хитрые моменты из спецификации :)
Вот ваше решение:
https://jsfiddle.net/a0hz7hp1/3/
Ответ написан
А может сделать так
https://jsfiddle.net/a0hz7hp1/1/
Ответ написан
Комментировать
MasterGerold
@MasterGerold Автор вопроса
Так как у меня нету рамок вокруг элементов я сделал так https://jsfiddle.net/8dutoskn/
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
bubandos
@bubandos
bash'у, javascript'ую, php'лю, css'аю, html'каю
Во-первых, это не css, а scss.
Во-вторых, возьмите уже скомпилированный css и посмотрите, что у вас за стили к чему применяются.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы