Почему содержимое в div не центрируется?

Question

[reinmaker90]

Comments

[fsociety_one]

Лучше бы залили на JSFiddle, было бы удобнее

[reinmaker90]

fsociety_one, https://jsfiddle.net/em5apd7w/ это то что в редакторе, я все крутил в инспекторе , я очень сильно туплю по этому возникают такие вопросы...

Answer 1

[Арсений Матыцин]

При flex ориентации по горизонтали align-items это выравнивание по горизонтали. Чтобы центрировать, как text-align в данном случае нужно использовать justify-content. Ну или text-align, почему нет.

Comments

[reinmaker90]

в центре контейнера отцентровал, спасибо, но при уменьшении экрана, все едет
https://jsfiddle.net/fs5mbyq1/ , или тут уже нужны медиа и задавать flex-start и margin выравнивать родителя?

[Арсений Матыцин]

reinmaker90, space-between на обертке не лучший метод в данном кейсе. Если уж на то пошло, то лучше так: https://jsfiddle.net/1g02vacu/

А вообще им [иконкам] стоит задавать размеры на медиазапросах, скажем по умолчанию 100%, а в разрешении, когда надо показывать уже по 2 в ряд 50%.

Без медиазапросов можно сделать на гридах с min-max значениями.

[reinmaker90]

Арсений Матыцин, благодарю!

Answer 2

[Артём]

Попробуй поставить display: flex выше align-items. По идее должно заработать. Ты просто задаёшь выравнивание по flex-свойству до того, как объявляешь контейнеру display: flex.

Comments

[reinmaker90]

у родителя этих элементов так же flex,я скорее всего где то начудил, но не пойму...Там все просто, родитель с flex,wrap,элементы с шириной % , но все это почему то жмется в левый край и не встает по центру допустимой ширины

[Артём]

reinmaker90, код в студию

[reinmaker90]

Артём Тюрин, в центре контейнера отцентровал, но при уменьшении экрана, все едет
https://jsfiddle.net/fs5mbyq1/ , или тут уже нужны медиа и задавать flex-start и margin выравнивать родителя?

[Артём]

reinmaker90, кто вас научил вкладывать одно свойство css в параметры для другого? Это неверный синтаксис. А для выравнивания просто допиши к своему justify-content еще align-items: center. Помле этого у меня все прекрасно отображается даже при уменьшении экрана.

[reinmaker90]

Артём Тюрин, никто, обучение мое это отрывки статей... подскажи где я вкладываю неверные параметры? что бы в дальнейшем избегать этого,пож-та