By mailme.eva on

HELP
i am trying to positon elements in a rather simple layout, using zen. when i open the html code of the page and apply styles in mytheme.css according to the ids and classes i see, it doesnt work. i did see that there are some layout classes applied to the body and there are some defintions for them and ids of the document in layout.css, but: in layout.css are NOT THE ONES that are in the body class tag.
is there somwhere a sheet where i can get oriented on what classes/ids apply or are available??????

i am really going insane with this...

thanks for any hint where to find information
e.

⋅ Categories: Drupal 6.x

Comments

vm’s picture

vm commented

firefox browser with the firebug addon

jarek foksa’s picture

jarek foksa commented

In a nutshell: learn how specificity and cascade work. Use Firebug or some other debugging tool.

Similar issue: http://drupal.org/node/624306

mailme.eva’s picture

mailme.eva commented

hi guys!
thanks for bothering, although you are not quite answering my question. i still think it would be cool to have some sort of cheatsheet, where one could look up what css-file affect which situation and what are the possible ids and classes written out from the template-files...
thanks anyway

vm’s picture

vm commented

except that every theme is different

mndonx’s picture

mndonx commented

Hi mailme.eva - as people say above, it is true that there really aren't cheat-sheets available because ids and classes can be anything, and change from theme to theme. A good place to start is to look in your page.tpl.php file. The classes and ids in there identify the major chunks of your page. Then you can check out your node.tpl.php file -- that will have more ids and classes specifically inside a node. Then, check out the comment.tpl.php, block.tpl.php, box.tpl.php, etc.

Many ids and classes are generated from modules -- but at that point, you should just view your source code or, as suggested above, get to know Firebug -- it's a life-saver for looking at you DOM structure and seeing what is available. There is also the Web Developer Toolbar, which you can use to outline all your HTML elements and reveal their classes and ids.

https://addons.mozilla.org/en-US/firefox/addon/60

mndonx’s picture

mndonx commented

PS - Palantir has a free downloadable cheatsheet for Zen that does in fact include the major classes and IDs:

http://www.palantir.net/blog/free-scratch-n-sniff-stickers-zen-plus-prin...

mailme.eva’s picture

mailme.eva commented

thats pretty much what i was looking for! :-)