Talk:Web Frameworks - Workbook
Main Page >> Web Frameworks >> Web Frameworks - Workbook >> Working with Zend and CSS
This article assumes you have a basic to intermediate understanding of CSS.
The way that Zend works is by automatically generating a lot of HTML for us. This means ID and Class tags too. So to successfully work with Zend and CSS, we need to know what these tags are being called in order to be able to assign CSS to them.
It has been noticed, that generally, Zend generates classes/ID's relative to the instance of which it is being used. For example, let's say you add a new text field to your form called 'Name' - Zend, will automatically give it an ID of 'name' (automatically lowercased). However, to be double sure before implementing any CSS just view your source code and check.
So now we know what this text field is called, you can go away to your global.css file (located in public/css) and begin to asign style to it. Below is a quick example of some valid CSS to assign to your textarea.
<source lang="css"> /* Form Name Textarea ID */
- name{
border: 1px solid #000; width: 200px; margin-bottom: 10px; padding: 3px; } </source>
REMEMBER: In the CSS files you always refer to the IDs with a '#' and the classes with a '.', here is another example.
See what you can do and don't forget that these aren't the only fields you can add style to; Buttons, DD's, DT's, UL's, LI's are all styleable too and it's just as easy.
Again, if you're unsure what the class or ID is, just view your source.
To see a working example of a completely styled page, you're welcome to view my own at 06020341/QuickStart/Public. I have formatted everything down to the error messages and it took the best part of five minutes. For my CSS code for INSPRIRATION (not copying, please) you can alternativly go to 06020341/QuickStart/public/css/global.css.
Thanks for reading!
