Tarjetas Responsive BS4

_show_tarjeta.html.rb

    <style>
        card {
    box-shadow: 10px 10px 5px grey;
    font-family: 'Roboto', sans-serif;
    width: auto;
        }
    </style>

     <div class="card">

      <img class="img-fluid" src="<%= item.imagen %>" alt="No se subio imagen">
      <div class="card-body">
        <h4 class="card-title"><%= item.nombre %></h4>
        <p class="card-text "><%= item.descripcion %></p>
        <ul class="list-group list-group-flush">
                <li class="list-group-item"><%= item.itemstate %></li>
                <li class="list-group-item"><b>L. <%= item.price %></b></li>
                <li class="list-group-item"><a href="/garaje/<%=User.find_by_email(item.usuario_actual).id_and_name%>"> Vendedor: <i class="material-icons">person</i>&nbsp;<b><%= User.find_by_email(item.usuario_actual).nombre %> <%= User.find_by_email(item.usuario_actual).apellido %></b></a></li>
        </ul>

        <a href="/garaje/items/<%=item.id.to_s%>" class="btn btn-outline-primary btn-block">Ver</a>
      </div>
    </div>

mostrar_todo.html.rb

<div class="row">
<div class="col-sm-1 col-1"></div>
	<div class="col-md-3 d-none d-lg-block" >
		<div class="card-header primary-color lighten-1 white-text">
				Categorías
		</div>
		<%= render '/walls/categories_list' %>
	</div>
	<div class="col-md-8 col-sm-4 col-12" >
				<br>
				<div class="row card-columns mx-auto" align="center">
				
						<div class="col-md-4 col-5">

							<% @showall.each do |item|%>
								<% if current_user.present?%>
									<%if item.usuario_actual != current_user.email%>

											<%= render '/walls/show_tarjeta', item: item%>


									<%end%>
								<%else%>

										<%= render '/walls/show_tarjeta', item: item%>

								<%end%>
							<%end%>
						</div>
				
				</div>

	</div>
	<div class="col-lg-2 col-md-1 col-1" >&nbsp;</div>




</div>