Tip 6: CSS Box Model Hack alternativeĪlternative to the Box Model Hack, which is commonly used to fix an IE Techniques is beyond the scope of a quick tip however, I plan to write aĬolumn on this topic in the future. A proper explanation and evaluation of the various image replacement (extremely brief) example comments on the article and Celik’s blog mention Several variations on the basic technique of hiding a text element (usually a The benefit of search engines) and replace that text with an image in the Replacement technique enables you to keep the HTML text in your document (for Set in another font that produces the visual effect you desire. Selection available on most visitors’ computers, or use an image of the text Whether to use regular HTML markup for text and live with the limited font Of a given property within the same style. However, the example code succeeds in setting a different margin in IE/Windowsīecause of a problem that IE/Windows has with processing multiple declarations The tip states that IEīuilders can use that fact to set different style attributes for IE and otherīrowsers by using code such as the following: margin-top: 3.5em !important margin-top: 2em Tip 4: !important (not really) ignored by IEĭeclaration to allow that rule to take precedence-even if a subsequent ruleĭeclaration would normally override the earlier rule. Any unspecified attributes revert to theirĭefault values. The default width is medium, and the default color is the same as the text Omit the color and width attributes if you want to use their default values. The style attribute is required, but you can The border shorthand property enables you to specify a border’s style,Ĭolor, and width (in any order). Although IE does have issues with multiclass selectors in theĬSS code, it has no problem with multiple class attributes applied to a markup Is that Internet Explorer doesn’t support multiple classes, which is notĮntirely true. Styling from both the content and product style classes. Here’s a list of the shorthand properties:Īttribute to a given markup element. Property, and all of them have the potential to condense your CSS code in a That unspecified values revert to their default settings, which may not be the Other font attributes are optional, but remember You must specify both the font-family and font-size attributes in the font Into a single line, like so: font: 10px/15px bold italic small-caps arial,sans-serif Shorthand can transform the following CSS code: font-size: 10px Use CSS shorthand to condense the font-related properties into a single line. Individual statements for font-size, font-family, font-weight, etc., you can I compiled a quick reference list of the article’s tips, complete with theĬorrections and qualifications that have appeared elsewhere. (look for “Ten CSS tricks-corrected and improved”), point out variousĬorrections and clarifications to the original tips.Īs a service to TechRepublic and readers, Some of those comments, including a long post on Tantek Celik’s log May not know.” It’s a great collection of tips, which is why theĪrticle is receiving its share of comments and links on several other blogs and Site recently, I read an article by Trenton Moss entitled “Ten CSS tricks you Here's a quick reference list of the article's tips, complete with the corrections and qualifications that have appeared elsewhere. Global symbols are never minimized.Michael Meadhra read an article by Trenton Moss detailing ten clever CSS tricks you may not know. Only the following tags are considered valid open and close tags: greet("Mike") By default YUI Compressor minimizes local symbols (renames them to the shortest possible names), such as local variables and local function names as long as eval() and with() statements are not present in that scope to ensure that your code won't break. Select x/html + Smarty if you want to compress Smarty templates code, or any other template system with similar syntax to smarty. Note that ASP code support is simply limited to preserving anything between tags. Select x/html + ASP if you want to compress x/html containing ASP code. Only the following tags are considered valid open and close tags. With this option you can safely minimize the x/html code of a Wordpress theme, a Joomla template, a Drupal template or any other PHP based template. This will ensure that your PHP code remains intact while your x/html code gets minimized. Select x/html + PHP if you want to compress x/html containing PHP code. Select x/html for web documents that do not contain server side code, such as static web pages. CSS code contained between and tags is considered x/html with embedded CSS code.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |