ViktoryiaYatskova / code-quality-principles

0 stars 5 forks source link

need flex or more width #3

Closed Wolf-Den1994 closed 3 years ago

Wolf-Den1994 commented 3 years ago

если выровнять все блоки в html, то появляются пробелы между блоками input и button. из-за чего плывет приложение. image фиксится одним из двух а можно и сразу двумя вариантами:

  1. увеличением ширины у блока
    установлено width: 400px; можно поднять хотя бы на 15px , а лучше на 25px.
  2. задание все тегам li свойств display: flex; justify-content: space-between; align-items: center;

оба варианта лучше использовать вместе. т.к. если использовать только первый вариант, то элементы расположены немного криво image

ViktoryiaYatskova commented 3 years ago

Что-то пошло не так при выравнивании. Похоже, что лишние пробелы попали ВНУТРЬ тегов, этого быть не должно. Или же есть trailing spaces. Я бы проверила измения с форматированием

ViktoryiaYatskova commented 3 years ago

@Wolf-Den1994, перепроверь пожалуйста свои изменения. Я не воспроизвела у себя проблемы

Wolf-Den1994 commented 3 years ago

Вернул исходную ширину 400px и убрал флексы. Проблема снова появилась image Лишних пробелов не вижу, только перед тегами. После тегов и внутри лишних пробелов нет. image Если в html склеить всё вместе, то проблема исчезает. image Я конечно, когда то читал про экранирование пробелов за тегом, потому что они могут показаться в браузере, но я думаю, что это уже не будет чистым кодом ) image Возможно тогда сделать пометку в задании в пункте критерии оценки? "Ширина приложения может быть увеличена или уменьшена. Ширину приложения не проверяется и не оценивается." P.S. пока что в чате эта проблема не была обнаружена не у кого.

Wolf-Den1994 commented 3 years ago

Всё дело в блочно-строчных элементах, вот статья https://htmlacademy.ru/blog/boost/frontend/fighting-the-space-between-inline-block-elements

Wolf-Den1994 commented 3 years ago

Проблема не только у меня как минимум уже, обнаружил еще одного человека с данной проблемой. image

ViktoryiaYatskova commented 3 years ago

https://github.com/ViktoryiaYatskova/clean-code-s1e1/commit/a38cd58a90e13a16d65c035d098b68cea2baa772

ViktoryiaYatskova commented 3 years ago

Спасибо!