Page 1 of 1

An image as background in an article (Joomla 2.5)

Posted: Sat Apr 28, 2012 7:25 am
by martino954
I need to use an image as background in an article; I use at the beginning of the code html of my article the following code
<div style="background-image: url('images/stories/key.jpg')">
But if the image is smaller than the page,I see the image repeated many times and it fills the page; I need to see the image only once, also if it is smaller than the page.
Is it possible?
Thank
Martino

Re: An image as background in an article (Joomla 2.5)

Posted: Sat Apr 28, 2012 9:49 am
by designerweb
Yeah! it is absolutely possible. Add another style background-repeat: no-repeat;. The edited div will be <div style="background-image: url('images/stories/key.jpg');background-repeat: no-repeat;">. I think your issue will be solved.

Thank you and take care. :)

Re: An image as background in an article (Joomla 2.5)

Posted: Sat Apr 28, 2012 3:01 pm
by martino954
OK. it runs correctly. A ultimate question. In the article with the image as background, I would write using not the black caracter but an other colour. I use the basic editor: is it possible?
Thanks. Martino

Re: An image as background in an article (Joomla 2.5)

Posted: Sat Apr 28, 2012 4:37 pm
by humvee
Go to Plugin Manager
Select TinyMCE by clicking the name
Top right of the new page display find the drop down next Functionality - set to Advanced by default and select Extended. Click Save and Close.
You now have a far more detailed interface for the Editor including Font Colour selection

Re: An image as background in an article (Joomla 2.5)

Posted: Sun Apr 29, 2012 5:16 am
by designerweb
You can do it using TinyMCE as said by humvee you can also use JCE (http://extensions.joomla.org/extensions ... editors/88) a popular editor. You can also use CSS technique to make that happen, add another style color:#FFFFFF; the FFFFFF is the hexadecimal value for while change it to whatever color you want but it have to be in hex value. The edited div will be <div style="background-image: url('images/stories/key.jpg');background-repeat: no-repeat;color:#FFFFFF;">.

All the best and take care. :)