How do you change the default image parameters is Joomla?

[cmendla]

Hello

I am trying to find out how to change the default image parameters in Joomla.

IOW, when I add an article, I usually add a pic with it. So, I go to the article manager, create an article, Add my text.

THen I hit the image button at the bottom of the text area and upload the pic I just edited.

So far so good, But I want to have a little more space between the pic and the text. So, I click on the pic, and hit the edit image icon in the text editor par and then tell it to give me 12 and 12 for vertical and horizontal spacing. That is doable, but I would like to set the 12px spacing as a default.

I'm assuming it is somewhere in the CSS in the template. So far, I haven't found exactly what to change

I'd appreciate any thoughts.

chris

[T_Miller]

Every template is different, especially in the CSS.
Most likely you'll just have to *add* some CSS code to the stylesheet to achieve what you want.

[ergophobe]

If you're using Firefox, install the Aardvark extension. Using that you can easily see which styles govern a given element.

Then you can search through your CSS files and find the relevant class selector and add your margins and padding there.

[cmendla]

ergophone - Thanks ... Aardvark seems like it will help me find the right place to tweak...

cg

[spadilla]

Firebug for Firefox is also very helpful (but may do the same as Aardvark, as I am not familiar with that extension). It's been a huge time saver for us!

[ergophobe]

Firebug is waaay more powerful than Aardvark, but Aardvark is waaay more convenient.

With Aardvark, you just hover over an element and it puts a red border around it and tells you what the element is and what classes and ids are defined for it. Hit the W key and it moves to the containing element all the way on out to the body element.

So it's incredibly useful for understanding the cascade and how things are put together and because it's totally visual, it really helps sort thing out.

An in-between solution is the "inspect element" feature in Chrome.

[cmendla]

Thanks.. The Aardvark worked great... I found that the tag was simply IMG and changed the CSS to

img { margin: 16px; align: left; }

That gave me pretty much exactly what I wanted.

Again, thanks for the tips...