Archive for March, 2008

Mar 26

I just updated to the latest version of WordPress… Wahoo. I believe I was previously using 2.2.something. The plugin update notification is very nice. The canonical URL fix is also calming to my inner SEO self.

I have to get around to updating the food blog, although I should focus on posting before upgrading.

Popularity: 7% [?]

Mar 26

The next CSS Off contest is April 5. At one minute past midnight (12:01 am), you will have 24 hours to send your entry in.

The winning entrant not only gets to feel really cool, but either receive a cash reward or a doubled cash donation to a charity.

It’s fun. CSS up.

Popularity: 8% [?]

Mar 06

If a design calls for a graphical horizontal rule, often front end developers will stick in an img tag and call it a day. However, an hr tag would be more semantic - and, most rich text editors for content management systems have a button for the horizontal rule.

These styles allow cross-browser image replacement for horizontal rule. In my implementation, the IE rules needed to be embedded, but it may have simply been a style overriding elsewhere in the stylesheet. Try it in a conditional commented stylesheet first.

The modern method uses background-image to replace the hr, which is defined normally by border. IE works some wonky stuff with list-item and you may have to scoot things around to get it to work just so, but it works!

CSS:
  1. /* ------- EMBEDDED ------- */
  2. <!--[if IE]>
  3. <style type="text/css">
  4. #primary-content  hr {
  5.     display : list-item;
  6.     list-style : url(/assets/images/wide-rule.gif) inside;
  7.     filter : alpha(opacity=0);
  8.     margin-left: -10px;
  9.     width : 0;
  10.   }
  11. #secondary-content hr{
  12.     display : list-item;
  13.     list-style : url(/assets/images/med-rule.gif) inside;
  14.     filter : alpha(opacity=0);
  15.     margin-left: 0px;
  16.     width : 0;
  17. }
  18. </style>
  19. <![endif]-->

CSS:
  1. /* ----- STYLESHEET ----- */
  2.  
  3. hr{
  4.       background:url(short-rule.gif) repeat-x top left;
  5.       border: 0;
  6. }
  7. #secondary-content hr{
  8.       background:url(med-rule.gif) no-repeat top center;
  9.       border: 0;
  10. }

Where can I get HR image assets?

Graphic River: Layered Photoshop, Vector Graphics, Logos and More
Josiah notes in his comment that he has provided some free images at Siah Design. Leave a comment if you would like to be included in this list.

Popularity: 100% [?]

Mar 03

It's such a simple thing but I actually googled this because I couldn't think of it offhand.

CODE:
  1. <cfif len(str)>
  2.      <cfoutput>#str#</cfoutput>
  3. </cfif>

if str has zero characters, len(str) will return 0, mimicking behaviour of false. Cool!

Popularity: 27% [?]




  • Meta