Scripsit Sjef:
I thought it would be a nice idea if I could set an icon in front of
a h1 level title.
There are (at least) two ways of achieving that. You can set display:
list-item for the h1 element and then set a suitable marker image. This may
look odd, since it's not really a list item and it's not even syntactically
part of any list, but CSS implementations don't know that. Another approach
is to set a non-repeating background image. This might be a better approach,
since it lets you tune the vertical position of the image with respect to
the heading.
In the first approach, make sure you set a sufficiently large left margin so
that there is room for the image. This is one of the few cases where px unit
makes sense, since the image itself has fixed dimensions in pixels. Example:
h1 { display: list-item;
margin-left: 30px;
list-style-image: url(article.gif); }
In the second approach, you need some suitable left padding. It must be
padding, not margin, since the background image is used for the padding but
not for the margin.
h1 { background-image: white url(article.gif) left center no-repeat;
padding-left: 30px; }
I saw in the css2 specs the option
of markers. but I cann't get it to work.
Such features have almost entirely been left unimplemented, and they have
been removed from the CSS 2.1 drafts.
--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/ 
