from tiling in any direction.

By default, the background image will start from the top left cornerof an element. (We'll see how to change this later in thechapter.) Therefore, the following rules will have the effect seen inFigure 6-28:

BODY {background-image: url(yinyang.gif);background-repeat: repeat;}
Figure 6-28

Figure 6-28. Tiling the background image in CSS

Book HomeCascading Style Sheets: The Definitive GuideSearch this book Thursday 23rd of March 2017 09:02:52 PM

9.6. Summary

When it comes right down to it, positioning is a very compelling technology. It's also likely to be an exercise in frustration if you're trying to get it to behave consistently in a cross-browser environment. The problem isn't so much that it won't work in some browsers: it's that it will only sort of work in a number of them, such as Navigator 4 and Internet Explorer 4 and 5. It can be great fun to play with positioning, and one day we'll be able to use it in place of tables and frames while dramatically improving accessibility and backward compatibility. As of this writing, though, it remains a great way to create design prototypes, but a tricky thing to use on a public web site.

As it happens, this sentiment may be applied to the majority of CSS2, which is given an overview in the next chapter.

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

It's also possible to setwidths for individual sides. This is donein two familiar ways. The first is to use any of the specificproperties mentioned at the beginning of the section, such asborder-bottom-width. The other way is to use valuereplicationin border-width. These are both illustrated inFigure 7-40.

7.7. Lists

There are a total of three properties that can affect the display of a list item under CSS1 -- CSS2 adds a few more, all of which are mentioned in Chapter 10, "CSS2: A Look Ahead" -- and one shorthand property to tie them all together. These properties are used to affect the type of bullet used in a list, to replace the bullet with an image, and to affect where the bullet or image appears in relation to the text of the list item. background.

Styles such as these comprise the bulk of any embedded stylesheet -- style rules both simple and complex, short and long. Itwill be only rarely that you have a document where theSTYLE element does not contain any rules.

For those of youconcerned about making your documents accessible to older browsers,margin-left, or margin-right isset to a value of auto, while the others are givenspecific values, then the property set to be autowill evaluate to whatever length is required to make the elementbox's width equal the parent element'swidth. Thus, if the sum of the seven propertiesmust equal 400 pixels, and no padding or borders are set, and theright margin and width are set to 100px while theleft margin is set to auto, then the left marginwill be 200 pixels wide: