On Thu, 17 Feb 2005 11:35:15 +0100, Tristan Miller
<ps********@nothingisreal.com> wrote:
Is there any way of using CSS alone to make an object centered and with a
dotted or dashed line extending on either side to the borders of the
enclosing object? For example, I have the HTML heading
<h1 class="centerline">Foo</h1>
and I would like it to display as follows:
------------------------------- Foo --------------------------------
I would create a small image, like dots.png, and use it as a background:
..centerline
/*btw it is wise to use something that represents the semantic meaning of
the class, the reason for creating the class, something like
'important-header'; otherwise if anywhere in the future you change your
mind on visual effects for this header 'Foo', like you want it to be a use
red font, right aligned, you're stuck with this 'centerline' thing which
really doesn't mean a thing then anymore; a semanticly meaningful class
name lets you recycle your markup code easily*/
{
text-align: center;
background-image: url(dots.png);
background-position: center;
background-repeat: repeat-x;
}
--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog |
http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp |
http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen |
http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'