Почему child не занимает ширину 100%, flexbox?

Question

[beefront17]

Добрый день! Подскажите пожалуйста у кого была подобная ситуация
Есть приблизительно такой блок

<div class="parent">
       <div class="child">{...}</div>
</div>

Верстка на flexbox.
Проблема - child никак не может занять ширину 100%, занимает приблизительно 100% -10px.
как только я меняю любое css свойство у parent или в child или просто делаю hover ширина становится 100%. такое впечатление, что css не полностью загружается.
Такое поведение только в хроме

Есть идеи в чем может быть проблема?
На codepen-е не могу привести пример.
Сам проект на react

Comments

[Сослан Хлоев]

div.parent {
  padding: 0;
}

Не?

[beefront17]

Сослан Хлоев, c padding, margin, right, left все ок.
Вопрос почему после любой активности(например хавер) все становиться как должно?

[shmatuan]

https://codepen.io/bradleyboy/pen/OPBpGw для реакта)

[Сослан Хлоев]

beefront17, без демо все будут тыкать пальцем в небо

[beefront17]

shmatuan, проблема специфична и она не связана с реактором, а целый проект я не могу закинуть

[beefront17]

только что заметил что такое поведение только в хроме

[sergski]

beefront17, f а какие сейчас для .child стили?

[Ankhena]

beefront17, И что, что на реакте, вы не в состоянии воспроизвести в песочнице получающийся html со стилями?
Как гадать-то о содержимом дочернего элемента?

Выложите на jsfiddle или codepen, причем вместе с hover.

Answer 1

[Gleb Zubov]

Потому что хром добавляет отступы (если не ошибаюсь 4 или 8 пикселей)
Попробуй написать просто

.otstupy{
margin : 0;
}

и добавить в родителя!