#reactjs #react-native #flexbox #jsx
Вопрос:
мне нужно реорганизовать чат GetStream в react. Моя проблема в том, что в нем достаточно места, но сообщения занимают только половину всего доступного пространства. Когда я начал просматривать макет в браузере, я заметил, что контейнер div разделен на стороны, я подозреваю, что это причина моей проблемы.
Мне нужно иметь только один большой столбец вместо двух или даже если второй столбец сможет занимать столько места, сколько ему нужно, но я понятия не имею, как это сделать в Flex.
Извините, если вопрос очень глупый, я все еще новичок в flex
Комментарии:
1. когда я попытался использовать центр, пробел-вокруг него колонка держится справа. Но это не сработало
Ответ №1:
Вы выбрали (?):
width: 100%; display: flex; flex-direction: column; align-content: flex-start; justify-content не будет работать в направлении «влево» или «вправо» в столбце, это просто изменит «верх» и «низ» (или центр). Вам нужно align-content , например.
Комментарии:
1. я попробовал, это немного увеличило размер второй колонки, но все равно не сработало
2. @Vlad Нам нужно немного больше вашей структуры html / css, чтобы понять, что не так. Например, возможно, проблема в некоторых родителях-дивах. Без дополнительной информации мы не сможем помочь.
Ответ №2:
Вы должны попробовать сделать это.
width: (your own value) display: flex flex-direction: column justify-content: flex-start or center ( Depending on your preference ) Убедитесь, что вы не настраиваете разные стили для одного и того же div несколько раз