Images as Horizontal Rules

Some sites also use a custom graphic in place of a horizontal rule. This is a nice way to subtly reinforce a site's theme (see Figure 5.22).

Figure 5.22. Custom rule graphics are strong design elements if implemented carefully.

Alignment problems are less of an issue with a custom rule, but you should keep a couple of rules in mind:

  • Assume a screen width of 800 pixels, and keep your rule sized accordingly. Don't let the rule's width exceed 800 pixels.

  • The default alignment for a rule placed with the <hr /> element is centered. You can replicate this effect for your custom rule by placing the <img /> element for the rule ...

Get Platinum Edition Using XHTML™, XML, and Java™ 2 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.