CODEWITHSUNDEEP
cssruby-on-rails
steven_noble
steven_noble

Reputation: 4203

How do you add more than one css class to an <img> using image_tag?

How do you add more than one css class to an <img> using image_tag?

Using image_tag("image.png", :class => "class1, class2") seems not to work

Upvotes: 2

Views: 2263

Answers (5)

jfrazx
jfrazx

Reputation: 31

Old question, but I thought it might be useful to point out that, at least in Rails >= 4.2, you may pass an array of values.

image_tag("avatar", class: [:class1, :class_2, "img-responsive", 'img-circle'])

Which will produce something similar to the following: 

<img class="class1 class_2 img-responsive img-circle" src="/assets/avatar.png" alt="Avatar" />

Take note if your class contains a hyphen it will need to be enclosed in quotes, else Ruby will treat anything after as a method/variable.

:img-responsive

undefined local variable or method `responsive' for #<#<Class:0x007fb6baa52198>:0x007fb6b982e2f0>

Upvotes: 0

AMAN
AMAN

Reputation: 1

I think that's not the correct way, because that doesn't worked for me.

Instead, I tried 

<%= image_tag("image.png"), :class => "media-object img-circle" %>

And this worked perfectly.

Upvotes: 0

Waqas Ali
Waqas Ali

Reputation: 1529

To apply more then one class to any control or html element, you need to separate classes name with space instead comma.

for example

<div class="class1 class2">
// Content here.
</div>

Upvotes: -1

VenkatK
VenkatK

Reputation: 1305

The following will work:
<%= image_tag("/image.png", :class => "class1 class2")%>

Upvotes: 0

Mr. Alien
Mr. Alien

Reputation: 157334

Don't separate the classes using a comma, separate them using a space...

image_tag("image.png", :class => "class1 class2")

Note: You cannot use a space inside a class name...separate them using _ or -, if you use space than class 1 class 2 will be like 4 classes in which all are invalid.

Upvotes: 6

Related Questions