-
Posts
-
Hi.
I guess it’s not complicated but .. How can I put an image as buttons background ?
thx for your help:)
Hey there,
Please add the code below in your button’s style attribute.
background-image: url(http://placehold.it/350x150);Hope that helps. 🙂
Hi
Yes, but I have a question.
I tried many way,. put the image in the button background, or in the raw (Actually it works better) like that.
The problem I noticed is that in button, text and image are not responsive.
`[button type=”transparent” size=”jumbo” block=”true” href=”/emotiva/?p=148″ float=”none” info=”none” info_place=”top” info_trigger=”hover” shape=”square”][custom_headline class=”responsive-bouton nomarge Whitetitle” style=”margin: 0px”; type=”center” level=”h6″] Text Button [/custom_headline][/button]
In this code, I’ve putted the code for responsive text inside the button. The problem here is double. First the text is not centered verticaly. The second problem is that I have to set the color with a classname here because the default button format doesn’t work if the content is a code.
For image. I’ve created an image to fit the button in desktop but in mobile, it doesn’t fit so the part of the image I want to see is outside the button.
Is it possible to make the background more responsive ?
Another solution was to put an icon in the button to be placed with the button text. But I doN,t know if it’s possible.
If you can help me with that, it will be great.
thx a lot
Hi There,
The text inside the button is responsive in nature. Try to setup the background image same way below
[button shape="square" size="jumbo" float="none" icon_only="true" info="none" info_place="top" info_trigger="hover" style="background: url('path/to/image/file.jpg') no-repeat center; background-size: cover;"]Text Button[/button]Hope it helps, Cheers!
Yep, it’s working now thx 🙂
You’re welcome, glad we could help, Cheers!
