View source for CSS guide

== Project Name ==

CSS Guide 

== Project Description ==

The [http://developer.mozilla.org Mozilla Developer Center] would like to add a CSS guide to its set of major documents, covering at least the top 100 CSS properties in use on the web today.  This data can be obtained through tools .  It should include numerous examples, and a fair number of small tutorial/how-to sections for different common tasks or requests from web authors.  

References: 

* [http://developer.mozilla.org/en/docs/CSS_Reference CSS Reference]
* [http://www.blooberry.com/indexdot/css/propindex/all.htm ALL CSS Properties listed Alphabetically]

== Project Leader(s) ==

;[[User:Sherman|Sherman Fernandes]] (sherman)

;[[User:Mdsouza|Mark D'Souza]] (mdsouza)

;[[User:dmmanley|Dave Manley]] (seneManley)

== Project Contributor(s) ==

[[User:Andrew| Andrew Smith]] (andrew) - setup SVN accounts for all project members.<br />
[[User:David.humphrey| Dave Humphrey]] (dave) - Course Professor, providing valuable insight and direction. <br />
Ian Hickson (hixie)<br />
Mike Shaver (shaver) - Obtained CSS property usage data.<br />

<span style="margin:0;background:#ff0000;font-size:120%;font-weight:normal;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">For a complete list of contributors please see the [[#CSS Properties| property list]].</span>

NOTE: only Project Leader(s) should add names here.  You '''can’t''' add your own name to the Contributor list.

== New Recruits ==

If you like to help in this CSS Guide, add your name and link it to your profile page in this section. We'll contact you!

== Project Details ==
* Get connected to #devmo on IRC and specifically to '''dria''' (she owns MDC) and '''sheppy''' (technical writer/dev with Mozilla).

* <span style="margin:0;background:#fff380;font-size:120%;font-weight:normal;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Begin by creating a '''[[CSS Template | single page template]]''' that you can use for all of your work later on.</span>

* <span style="margin:0;background:#ccffcc;font-size:120%;font-weight:normal;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">Shaver to get data on top CSS properties: see http://triin.net/2006/06/12/CSS</span>

* Research where in the Mozilla code base the CSS properties live, since you'll want to be able to consult that code as you research info about the properties and their use in Firefox.  For this you can use http://lxr.mozilla.org

* Once the list is known, divide it and work in parallel.

* Research Mozilla proprietary tags and their usability in browsers.

== Project News ==
*Nov 22, 2006 - We welcome and thank all the new contributors to their project for all their efforts.  Contributing to the project is easy.  To get started simply pick an unassigned property from the [[#CSS Properties |task list]] below and follow the [[CSS Template| template]].  Feel free to contact the any project leader should you have any questions.  
*Nov 15, 2006 - Assigned initial 30 CSS properties among project leaders.
*Nov 15, 2006 - Added 19 Mozilla-specific proprietary CSS properties to CSS table.
*Nov 15, 2006 - Gave project update to colleagues in DPS909 and recruited documentors for the project.
*Nov 10, 2006 - Added table of top 50 CSS properties for completion (Additional 50 to follow).
*Nov 10, 2006 - CSS Property "Color" page outline completed.
*Oct 29, 2006 - Working to complete documentation for a few tags prior to submitting it for review. 
*Oct 22, 2006 - Currently working to document a few CSS properties (minimum of 3) using the [[CSS Template | initial template draft]] as a guide.  The next step would be to share experiences / feedback etc. regarding the template so that suggested revisions / corrections can be made moving forward.  This will allow us to improve the quality of the template right from the start and prevent painful re-working later on.  Some of the most used CSS properties can be found [http://triin.net/archive/kool/webstat/figure-21.png here.]  Thanks to Mike Shaver for providing us with this info !
*Oct 17, 2006 - Spoke to Shaver and got a list of CSS properties and their usage.  See above.

*Oct 07,2006 - Created [[CSS Template | initial template draft]] for initial review. This is a work in progress and is subject to change.  The template currently only contains heading titles but will be updated to reflect sample content.  

*Oct 06, 2006 - Prof. Humphrey ([[User:David.humphrey |dave]]) stated that Mike Shaver is working with Ian Hickson (hixie) at [http://www.google.com Google] regarding getting access to their CSS related data. 

*Sept 30,2006 - Currently trying to determine which headings i.e CSS property details etc. are the most important and thus should be included in the design of the  single page template.

* Sept 26, 2006 (dave) - I spoke to shaver on the phone today about this project, and he had some suggestions.  First, he is going to see if hixie (Ian Hickson) at Google can help us get access to the top 100 CSS properties/etc (see http://code.google.com/webstats/ for another similar project he's done).  Shaver also suggested that the best starting point is for you to create a '''Single Page Template''' that you'll use to work on all these.  This page should include things like: links to W3C standards, example uses, description, data (e.g., legal values, edge cases, etc.) from the Mozilla code, etc.  You might want to consult the existing [http://developer.mozilla.org/en/docs/CSS_Reference CSS Reference] (e.g., the [http://developer.mozilla.org/en/docs/CSS:background background property]), but don't use that as the basis for your template--it is not complete.  Once you have the top 100 properties/etc you can divide them up between you and tackle this in parallel.

== CSS Properties ==
<table border = "1" width="350">
<tr>
<th>#</th>
<th>CSS Property</th>
<th>Assignee</th>
</tr>

<tr>
<td>1</td>
<td>[[CSS_GUIDE_COLOR | color]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>2</td>
<td>[[CSS_GUIDE_FONT_SIZE | font-size]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>3</td>
<td>[[CSS_GUIDE_FONT_FAMILY | font-family]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>4</td>
<td>[[CSS_GUIDE_TEXT_DECORATION | text-decoration]]</td>
<td>[[user: Sherman | Sherman]]</td>
</tr>

<tr>
<td>5</td>
<td>[[CSS_GUIDE_FONT_WEIGHT | font-weight]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>6</td>
<td>[[CSS_GUIDE_BACKGROUND_COLOR | background-color]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>7</td>
<td>[[CSS_GUIDE_WIDTH | width]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>8</td>
<td>[[CSS_GUIDE_TEXT_ALIGN | text-align]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>9</td>
<td>[[CSS_GUIDE_MARGIN_TOP | margin-top ]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>10</td>
<td>[[CSS_GUIDE_MARGIN | margin]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>11</td>
<td>[[CSS_GUIDE_MARGIN_BOTTOM | margin-bottom]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>12</td>
<td>[[CSS_GUIDE_BORDER | border]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>13</td>
<td>[[CSS_GUIDE_PADDING | padding]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>14</td>
<td>[[CSS_GUIDE_LINE_HEIGHT | line-height]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>15</td>
<td>[[CSS_GUIDE_HEIGHT | height]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>16</td>
<td>[[CSS_GUIDE_MARGIN_LEFT | margin-left]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>17</td>
<td>[[CSS_GUIDE_FONT-STYLE | font-style]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>18</td>
<td>[[CSS_GUIDE_PADDING_LEFT | padding-left]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>19</td>
<td>[[CSS_GUIDE_PADDING_TOP | padding-top]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>20</td>
<td>[[CSS_GUIDE_POSITION | position]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>21</td>
<td>[[CSS_GUIDE_BORDER_BOTTOM | border-bottom]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>22</td>
<td>[[CSS_GUIDE_BACKGROUND_IMAGE | background-image]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>23</td>
<td>[[CSS_GUIDE_BACKGROUND | background]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>24</td>
<td>[[CSS_GUIDE_MARGIN_RIGHT | margin-right]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>25</td>
<td>[[CSS_GUIDE_BORDER_RIGHT | border-right]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>26</td>
<td>[[CSS_GUIDE_PADDING_BOTTOM | padding-bottom]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>27</td>
<td>[[CSS_BORDER_TOP | border-top]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>28</td>
<td>[[CSS_GUIDE_BORDER_LEFT | border-left]]</td>
<td>[[user:Sherman | Sherman]]</td>
</tr>

<tr>
<td>29</td>
<td>[[CSS_GUIDE_TOP | top]]</td>
<td>[[user:dmmanley| Dave]]</td>
</tr>

<tr>
<td>30</td>
<td>[[CSS_GUIDE_DISPLAY | display]]</td>
<td>[[user:mdsouza | Mark ]]</td>
</tr>

<tr>
<td>31</td>
<td>[[CSS_GUIDE_LEFT | left]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>32</td>
<td>[[CSS_GUIDE_PADDING_RIGHT | padding-right]]</td>
<td>[[user:bhearsum|bhearsum]]</td>
</tr>

<tr>
<td>33</td>
<td>[[CSS_GUIDE_VERTICAL_ALIGN | vertical-align]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>34</td>
<td>[[CSS_GUIDE_BACKGROUND_REPEAT | background-repeat]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>35</td>
<td>[[CSS_GUIDE_Z_INDEX | z-index]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>36</td>
<td>[[CSS_GUIDE_FLOAT | float]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>37</td>
<td>[[CSS_GUIDE_CURSOR | cursor]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>38</td>
<td>[[CSS_GUIDE_BORDER_STYLE | border-style]]</td>
<td>[[user:cbguy1 | Colin Guy ]]</td>
</tr>

<tr>
<td>39</td>
<td>[[CSS_GUIDE_FONT | font]]</td>
<td>[[user:RichardChu | Richard Chu]]</td>
</tr>

<tr>
<td>40</td>
<td>[[CSS_GUIDE_BORDER_WIDTH | border-width]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>41</td>
<td>[[CSS_GUIDE_BACKGROUND_POSITION | background-position]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>42</td>
<td>[[CSS_GUIDE_LETTER_SPACING | letter-spacing]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>43</td>
<td>[[CSS_GUIDE_VISIBILITY | visibility]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>44</td>
<td>[[CSS_GUIDE_BORDER_COLOR | border-color]]</td>
<td>[[user: dwwoodsi| Dean Woodside ]]</td>
</tr>

<tr>
<td>45</td>
<td>[[CSS_GUIDE_BORDER_COLLAPSE | border-collapse]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>46</td>
<td>[[CSS_GUIDE_LIST_STYLE_TYPE | list-style-type]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>47</td>
<td>[[CSS_GUIDE_TEXT_TRANSFORM | text-transform]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>48</td>
<td>[[CSS_GUIDE_CLEAR | clear]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>49</td>
<td>[[CSS_GUIDE_OVERFLOW | overflow]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>50</td>
<td>[[CSS_GUIDE_TEXT_INDENT | text-indent]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>51</td>
<td>[[CSS_GUIDE_-MOZ-BINDING | -moz-binding]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>52</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RADIUS | -moz-border-radius]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>53</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RADIUS-TOPLEFT | -moz-border-radius-topleft]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>54</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RADIUS-TOPRIGHT | -moz-border-radius-topright]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>55</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RADIUS-BOTTOMRIGHT | -moz-border-radius-bottomright]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>56</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RADIUS-BOTTOMLEFT | -moz-border-radius-bottomleft]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>57</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-TOP-COLORS | -moz-border-top-colors]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>58</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-RIGHT-COLORS | -moz-border-right-colors]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>59</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-BOTTOM-COLORS | -moz-border-BOTTOM-colors]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>60</td>
<td>[[CSS_GUIDE_-MOZ-BORDER-LEFT-COLORS | -moz-border-left-colors]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>61</td>
<td>[[CSS_GUIDE_-MOZ-OPACITY | -moz-opacity]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>62</td>
<td>[[CSS_GUIDE_-MOZ-OUTLINE | -moz-outline]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>63</td>
<td>[[CSS_GUIDE_-MOZ-OUTLINE-COLOR | -moz-outline-color]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>64</td>
<td>[[CSS_GUIDE_-MOZ-OUTLINE-STYLE | -moz-outline-style]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>65</td>
<td>[[CSS_GUIDE_-MOZ-OUTLINE-WIDTH | -moz-outline-width]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>66</td>
<td>[[CSS_GUIDE_-MOZ-OUTLINE-FOCUS | -moz-outline-focus]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>67</td>
<td>[[CSS_GUIDE_-MOZ-USER-INPUT | -moz-user-input]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>68</td>
<td>[[CSS_GUIDE_-MOZ-USER-MODIFY | -moz-user-modify]]</td>
<td>[[user:| ]]</td>
</tr>

<tr>
<td>69</td>
<td>[[CSS_GUIDE_-MOZ-USER-SELECT | -moz-user-select]]</td>
<td>[[user:| ]]</td>
</tr>

</table>