adding ids, and classes to an image tag in rails

Question

I have a rails image tag"

<%= image_tag 'how-it-works.png', {id: 'how-it-works'} %>

I would also like to add the bootstrap class img-responsive so the image stays within its container.

How would one do it?

I see a few option on the rails docs but none of them seem to be working:

image_tag("icon")
# => <img alt="Icon" src="/assets/icon" />
image_tag("icon.png")
# => <img alt="Icon" src="/assets/icon.png" />
image_tag("icon.png", size: "16x10", alt: "Edit Entry")
# => <img src="/assets/icon.png" width="16" height="10" alt="Edit Entry" />
image_tag("/icons/icon.gif", size: "16")
# => <img src="/icons/icon.gif" width="16" height="16" alt="Icon" />
image_tag("/icons/icon.gif", height: '32', width: '32')
# => <img alt="Icon" height="32" src="/icons/icon.gif" width="32" />
image_tag("/icons/icon.gif", class: "menu_icon")
# => <img alt="Icon" class="menu_icon" src="/icons/icon.gif" />
image_tag("/icons/icon.gif", data: { title: 'Rails Application' })
# => <img data-title="Rails Application" src="/icons/icon.gif" />

Sebastián Palma · Accepted Answer · 2017-10-12 07:02:49Z

6

image_tag(source, options = {})

The source is the name of your image file in the assets/images directory, so, you can pass the id and class as options. No need to use brackets (6th example):

<%= image_tag 'how-it-works.png', id: 'how-it-works', class: 'img-responsive' %>

Which renders:

<img id="how-it-works" class="img-responsive" src="/assets/how-it-works-....png" alt="How it works">

answered Oct 12, 2017 at 7:02

Sebastián Palma

33.6k6 gold badges45 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

adding ids, and classes to an image tag in rails

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related