CODEWITHSUNDEEP
htmlruby-on-rails
forschool
forschool

Reputation: 65

Bad placement on the page

My file: /app/views/pins/index.html.erb

<% @pins.each do |pin| %>
<%= image_tag pin.image.url(:medium) %><br/>
<%= pin.description %><br/>
<%= link_to 'show', pin %><br/>
<% if pin.user == current_user %>
<%= link_to 'Edit', edit_pin_path(pin) %><br/>
<%= link_to 'delete', pin, method: :delete, data: { confirm: 'are you sure?' }%><br/>
<% end %>
<% end %>
<br>
<%= link_to 'New pin', new_pin_path %>

I don't know why my page look good only with 1 pin , when i add 2nd pin on the website, all of image look bad - like on this screen:

screen

right click

Upvotes: 0

Views: 50

Answers (2)

Majid Parvin
Majid Parvin

Reputation: 5002

Just Put a br tag after first <% end %>.

Upvotes: 1

gwcodes
gwcodes

Reputation: 5690

Anchor elements (i.e. the <a href="..."> tags) are not block elements by default, so what you're seeing is the "delete" anchor tag and the second anchor tag (containing the image) rendering on the same line.

Move the <br> tag from the bottom of your code to inside your each loop (under the "delete" link), and it should look right.

Sidenote: it might not be a bad idea to get rid of those <br> elements, and wrap things up inside <div> elements instead, which are block elements. It gives your code a nicer structure, and makes it easier to style the spacing with CSS.

Upvotes: 1

Related Questions