I hope there is a solution to this or that I am missing somthing.
I wanted to change my H1 as I did not like how it was being displayed — too much space above and below. It had 15 pixels and I wanted 5 or less. Looking through Firebug it reported that, at least for the Maelstrom template, that I need to change H1 on line 52 of the gantry.css file.
Opening my template thru the back end I see that gantry.css does not appear in the list. I thought the workflow with CSS, Gantry and Joomla was that you would have fairly easy access to the various CSS files? Presently I would be required to download the file from my site, make the changes and then upload it back to the site.
To further confound the issue I noticed the line .rt-joomla H1 that was supposed to be on line 9 of joomla.css. I wanted to change it from -2px to -1px. Editing my Maelstrom template and opening the joomla.css file I could not find the line. I found out via Firebug that Gantry has superceded the joomla.css file and instead utilizes a different file hidden in the <site>/components/com_gantry/... directory.
What gives and is there a way to do it without having to download the Gantry CSS files, make the changes and then uploading them back to the site? If the Gantry CSS files were available through the template Edit CSS button that would resolve the issue.
I can understand the reasoning behind this. If I copy the applicable lines from the gantry.css file (presently hidden from editing) and paste the line into my standard joomla.css (or some other file) and make the changes then they rule out any lines in gantry.css. However! If I then use something other than Gantry it will likely blow the site away.
An interesting conundrum that could be solved by allowing us to edit the various Gantry CSS files.
the css-files in the com_gantry will most likely be overwritten with each gantry update.
So don't change somthing in those files.
To chnage (or better override) those rules use css-specificity.
for example a rule for
.rt-joomla h1 { ... some stuff ... }
in the gantry.css can be easliy overridden by adding
div.rt-joomla h1 { ... some stuff ...}
to the template.css
I suspected as much and there is no happy medium. If I put it in template css and then in the future go with a different template, I will wonder why everything is messed up with the new template. So many of these CSS commands are specific to a particular template to be mind boggling.
But I think I just caught on. Each new template will have its own template.css in its own directory structure. So anything I do to the template.css of Maelstrom will not be reflected in my new Something template.
Thanks for setting me straight guys and I will mark it as solved.