$node = stdClass Object (
[nid] => [122]
[type] => [blog]
[language] => [en]
[uid] => [5]
[status] => [1]
[created] => [1273590958]
[changed] => [1273591406]
[comment] => [0]
[promote] => [0]
[moderate] => [0]
[sticky] => [0]
[tnid] => [0]
[translate] => [0]
[vid] => [125]
[revision_uid] => [5]
[title] => [CSS Shorthand]
[body] => [<p>When creating style sheets, it is easy for the code in the style sheets to get out of hand. One way to increase load times is to shorten the number of lines in your CSS. Some do it simply in the format of their CSS, by conforming the layout of the brackets and limiting CSS comments. In addition to some format changes, I also like to implement CSS Shorthand.<br><br>Certain CSS properties are what they call "shorthand properties." This means that they allow authors to specify the values of several properties with a single property. The best example of CSS shorthand is the font style. The majority of 'stylers' use a number of lines in their CSS to control the display of a font. Here is an example of what you often see:<br><br><code><font face="Courier New"> h1 { <br> font-weight: bold; <br> font-size: 12pt;<br> line-height: 14pt; <br> font-family: Helvetica; <br> font-variant: normal;<br> font-style: normal;<br> }</font></code><font face="Courier New"><br><br></font>As you can see, this single font style requires 6 lines of code. As you have probably guessed, there is a better way.<br><br><code><font face="Courier New">h1 { font: bold 12pt/14pt Helvetica }</font></code><font face="Courier New"><br></font><br>This example shows how the use of CSS shorthand can significantly reduce your lines of code. The key to using shorthand is to be familiar with the format. If you don't make your style declarations in the right order, it won't work.<br><br>The order for <strong>Font Style</strong> shorthand is this:</p><ol><li>font-style (normal, italic, oblique)</li><li>font-variant (normal, small-caps, inherit)</li><li>font-weight (normal, bold, 100-900)</li><li>font-size/line-height (size px or em/height px or em)</li><li>font-family (stack)</li></ol><p>You can remove certain elements and it will still work, but the order must remain the same. Below are some other shorthand elements that you may or may not be familiar with.</p><p><b>Background </b></p><ol><li>background-color</li><li>background-image url(....)</li><li>background-repeat</li><li>background-attachment --- scroll, fixed, inherit</li><li>background-position --- top, bottom, left, right, or pixels.</li></ol><p><b>Border/Outline</b></p><ol><li>width (1px)</li><li>style (solid)</li><li>color (#000 or black)</li></ol><p><b>Margin/Padding (px, %, or em)</b></p><ol><li>top</li><li>right</li><li>bottom</li><li>left</li></ol><p><b>List Style</b></p><ol><li>type (none, disc, circle, square)</li><li>position (inside, outside, inherit)</li><li>image (none or url(image.png) )</li></ol><p>And why not some CSS 3 elements?</p><p><br><b>Text Shadow</b></p><ol><li>position right (px)</li><li>position bottom (px)</li><li>blur width (px)</li><li>color (#000 or black)</li></ol><p><b>Border Radius (px)</b></p><ol><li>top left</li><li>top right</li><li>bottom right</li><li>bottom left</li></ol><p> </p>]
[teaser] => [<p>When creating style sheets, it is easy for the code in the style sheets to get out of hand. One way to increase load times is to shorten the number of lines in your CSS. Some do it simply in the format of their CSS, by conforming the layout of the brackets and limiting CSS comments. In addition to some format changes, I also like to implement CSS Shorthand.<br>]
[log] => []
[revision_timestamp] => [1273591406]
[format] => [1]
[name] => [aaron]
[picture] => [sites/webeasymedia.com/files/pictures/picture-5.jpg]
[data] => [a:8:{s:13:"form_build_id";s:37:"form-5307fb947ecb64bc2d17d6909369a987";s:7:"contact";i:1;s:5:"Title";s:0:"";s:11:"Description";s:0:"";s:6:"format";s:1:"1";s:14:"picture_delete";i:0;s:14:"picture_upload";s:0:"";s:14:"pingfm_app_key";s:43:"9b0e345d886a1ac65d43563ac8658e3a-1247677556";}]
);
