Tuesday 07th of February 2012 05:26:34 AM

CSS Style Guide

XHTML: Benefits

Converting from HTML to XHTML is easy, and provides the library with several immediate and long–term benefits:

evaluate to 150px , as shown in Figure 8-26: 

IMG {display: block; width: auto;}
Figure 8-26

Figure 8-26. Replaced elements with auto width are rendered using their intrinsic size

Replaced elements can have their height and width set to a value other than auto or their intrinsic dimensions. This is most commonly used to "scale" images, either up or down. Thus, if an image is 150 pixels wide and its width is set to 75px , then the image will be displayed

A painless transition to more advanced technology
The web is moving to XML, a powerfully enabling technology. Writing well–formed, valid XHTML pages is the easiest way to begin this transition. All it takes is learning a few simple rules of XHTML markup.
Cleaner, more logical markup
XHTML brings uniformity to document structure. The rules of XHTML help restore the structural integrity of documents that was lost during the web’s rapid commercial expansion between 1994 and 2001. This is critical for large organizations such as ours, whose web pages must interface with logically–marked–up documents in legacy systems and databases.
Increased interoperability
Unlike old–style HTML pages, valid, well–formed XHTML documents can easily be “transported” to wireless devices, Braille readers and other specialized web environments. Moreover, XHTML’s insistence on clean, rule–based markup helps us avoid the kind of errors that can make web pages fail even in traditional browsers like Microsoft Internet Explorer, Netscape Navigator, and Opera Software’s Opera browser.
Greater accessibility
Because they follow strict rules and avoid non–standard markup, well–authored XHTML pages are more accessible than old–school HTML pages, helping the library comply with U.S. laws and accessibility guidelines.
« XHTML Section Index | XHTML Authoring Tips 'n Tools »

floated element. However, each paragraph's element width isstill as wide as its parent element. Therefore, its content areaspans the width of the parent, and so does the background. The actualcontent doesn't flow all the way across its own content area inorder to avoid being obscured behind the floating element.

8.3.2.1. Negative margins

As was discussed in the previous chapter,negative margins can cause floated elements to move outside of their

H3 {border: thin thick solid purple;}  /* two width values--WRONG */

In such a case, the entire statement will be invalid and should be ignored altogether.

Finally, you need to take the usual precautions with shorthand properties: if you omit a value, the default will be filled in automatically. This can have unintended effects. Consider the following:

replaced element, plus any box properties. Inother words, the entirety of the replaced element -- content,margins, borders, and padding -- is used to define theelement's inline box. The following markup gives one suchexample, (shown in Figure 8-65):

P {font-size: 12px; line-height: 18px;}IMG {height: 30px; margin: 0; padding: 0;}
Figure 8-65

Figure 8-65. Replaced elements don't actually increase the line height

Despite all the blank space, the effective value of