Отображать участников Inline

Question

Я пытаюсь отобразить мои события / индекс по горизонтали, но я не могу заставить его работать.Index.html.erb

<ul>
  <% @events.each do |event| %>
      <li>


        <h3>
          <%= link_to event.name, event.flyer.url %>
          <%= event.event_date %> <br/>
          <% if event.preview.exists? then %>
              </h3>
              <%= image_tag event.preview.url(:small) %>
          <% end %>   <br/>
          <%= event.description %>  <br/>

          <%= link_to 'Show', event %>
          <%= link_to 'Edit', edit_event_path(event) %>
          <%= link_to 'Destroy', event, :confirm => 'Are you sure?', :method => 'delete' %>
          </li>
  <% end %>

</ul>

<%= link_to 'New Event', new_event_path %>

style

<style type="text/css">
    ul
    {
        margin: 0 auto;
        padding: 0;
        list-style-type: none;
        text-align: center;
    }
  ul li { display: inline; }
</style>

Answer 1

Проблема здесь в том, что display:inline настраивает его ширину и высоту для элементов внутри него.

Для горизонтального отображения элементов необходимо зафиксировать высоту и ширину элемента.Попробуйте это

ul li {
display: block;
float:left;
width:100px; /* specicy width here */
height:100px; /* specicy height here */
margin-right:10px; /* breathing space */
}