すべてリストの項目ですが、複数の画像を連続して表示しようとしています。現時点
では、車が隣り合っているのではなく、UI が次のようになっています。
私のCSSは
li{
width: 19em;
}
#tripList ul,li {
list-style: none;
}
#tripList ul {
overflow: hidden;
padding: 3em;
}
#tripList ul li span {
display: inline-block;
height: 15em;
width: 19em;
padding: 1em;
}
私のhtmlコードは次のとおりです。
<div id="tripList">
<ul>
<% @trips.each do |trip| %>
<li >
<span>
<p class="remove-icon">
<%= link_to '×'.html_safe, trip, method: :delete, data: { confirm: 'Are you sure you want to delete ' + trip.trip_name + '?' } %>
</p>
<div class="carImg">
<p class ="carText"><strong><%= link_to trip.trip_name, trip %></strong></p>
</div>
<p>
<strong>Trippers:</strong> <%= trip.users.collect {|user| user.name }.to_sentence %>
</p>
</span>
</li>
<% end %>
</ul>
</div>
ご協力ありがとうございました