WOFF (Web Open Font Format)

Mozilla Firefox® 3.6 is the first browser which supports the new Webfont format WOFF. The FontFont Typeface Library endorses the WOFF specification. We hope that besides Firefox other browsers will join in implementing it. We want you to experience the new webdesign possibilities, so we’re making it easy: Get the first ever available WOFF font FF Nuvo Medium Demo and give it a go for free. (Alternative download link)

Font Info: FF Nuvo is a contemporary type family with vertical contrast.

Perfect Full Page Background Image

We visited this concept of re-sizeable background images before… but reader Doug Shults sent me in a link that uses a really awesome technique that I think is better than any of the previous techniques.

This technique and the above background image is credited to this site. Here is what this technique is going to accomplish:

Fills entire page with image, no white space
Scales image as needed
Retains image proportions
Image is centered on page
Does not cause scrollbars
Cross-browser compatible
Isn’t some fancy shenanigans like Flash

This is a very tall order, and we are going to be pulling out all kinds of different stuff to make it happen. First of all, because the image needs to scale, a traditional CSS background-image is already disqualified. That leaves us with an inline image.

http://css-tricks.com/perfect-full-page-background-image/

IE6 Double Margin Bug Fix

If you have a floated element such as a div and you place margin-right or margin-left on that element, our most beloved Internet Explorer 6.0 will double that margin value, causing havoc in your html layout. To fix this simply add display:inline; to your floating element.

Example:

.floatbox {
float: left;
width: 150px;
height: 150px;
margin: 5px 0 5px 100px;
/*This last value applies the 100px left margin */
}


Example Fix

.floatbox {
float: left;
width: 150px;
height: 150px;
margin: 5px 0 5px 100px;
display: inline;
}


50 Useful Design Tools For Beautiful Web Typography

Typography is elegant when it is attractive and communicates the designer’s ideas. When chosen wisely and used carefully, it can be very effective in supporting the overall design. Designers are always exploring different techniques with type: some use images or sIFR to produce very beautiful typography, while others prefer CSS alone to get the typography just right.

Read more