Я работаю над созданием системы обмена сообщениями в моем приложении rails.Сейчас я делаю рендеринг всех разговоров и сообщений current_user в одном представлении, скрывая их при загрузке страницы и отображая сообщения, связанные с пользователем, которого выбирает current_user (из списка пользователей, с которыми current_user уже начал диалоги).).Проблема, с которой я столкнулся, заключается в том, что с увеличением количества сообщений увеличивается и длина страницы.Чтобы помочь этому, я обернул все сообщения, которые будут отображаться в div, и дал указанному div свойство переполнения hidden (изначально я установил его на auto, но переключился на hidden, чтобы посмотреть, будет ли prop работать вообще).К сожалению, это не сработало.
Представление (список, из которого пользователь будет выбирать, кому отправлять сообщения, находится в макете)
<div id="message-view" class="">
<% @conversations.each do |convo| %>
<div id="<%= convo.id %>" class="tabcontent conversations-message">
<% convo.messages.each do |message| %>
<% if message.user != current_user %>
<div class="float-left small">
<%= message.body %>
</div><br>
<% else %>
<div class="float-right small">
<%= message.body %>
</div><br>
<% end %>
<% end %>
</div>
<% end %>
<div class="message-bar">
message bar
</div>
</div>
Css
#message-view{
position: relative;
}
#message-view .message-bar{
position: fixed;
bottom: 0;
height: 150px;
border: 2px solid;
border-color: rgb(232,233,232);
width: 73%;
}
.search-conversations{
height: 30px; width: 210px;
}
.grey{
background-color: rgb(236,236,236);
}
.conversations-message{
display: block;
height: 200px;
overflow: hidden;
position: fixed;
top: 0;
}
Задача
