CSS - Css Shorthand Help
Hello,
I'm taking over management and development responsibilities from the developer who rebuilt our site. He did an awesome job and everything is well structured and clearly commented so I've had a pretty easy time getting around his code and making the tweaks I want. I need to make a simple CSS tweak but I'm unfamiliar with shorthand and need some help. The rule sets the style for paragraphs with the class "author_desc", i.e. Code: <p class="author_desc">This is some text</p> This is the CSS rule for the "author_desc" class: Code: #col_02 .feature_body p.author_desc { color: #a7a7a7; font-size: 1.3em; text-indent: 0; font-family: Arial, Verdana, sans-serif; font-style: italic; margin: 20px 0 0 0; padding: 0;} I need to add an additional rule that would render any italicized text in the paragraph as normal, i.e. Code: <p class="author_desc">This is my body text that is italicized, <i>but this is regular text</i>. Now we're back to italicized again.</p> How would I write the needed CSS for this? Thanks for your help! Similar TutorialsHello, My font shorthand have this different outputs on IE and FF Quote: h1 { /*font-size: 16px; font-weight: bold; font-style: normal;*/ font: normal medium bold 16px Verdana, Arial, Helvetica, sans-serif; margin: 0 10px; padding: 15px 0 5px 0; color: #FFF; } If I replace the font-variant at shorthand it works well on IE but still the font size is not rendered Quote: font: normal larger bold 16px Verdana, Arial, Helvetica, sans-serif; the commented long hand is what I'm trying to get Hi. How do I know the shorthand property value format? For example: p { margin: 1em 2em 2em 1em; } How do I know which one is top, bottom, left, right? Can u do this as well? p { margin: 1em 2em; } What about other property do they always follow the same format and order? Any help will be great. Thanks. Here's the code:
Code: <html> <head> <title>Sample Font Shorthand</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> body { margin: 0; behavior: url("../htcmime.php?file=csshover2.htc") } div { } table { width: 100% } .sttable { background-color: #000080 } tr { } td { vertical-align: top } .sttd { font: bold 12px Arial #FFFFFF } </style> </head> <body> <table class="sttable"> <tr> <td class="sttd">Catalog > Categories</td> <td class="sttd">Cart Total: $ 0.00</td> <td class="sttd">Date</td> </tr> </table> </body> </html> Would someone please tell me why the color of the text isn't rendering white? |