H1, FIR, display:inline?

Hello,

The way of swapping standard mark-up tags (h[1-6]) with images is a
common knowledge and as such does not need any recommendation. No
mess, no fuss, a image with fancy font is displayed instead of
"arialy" heading. Nice.

Now, methods I know uses "display:none" rule. It prevents the content
of being displayed. Now, what if I want to make something like

My heading goes here (it's, hence two lines)
My heading goes here menu tabs by Dan
--------------------------- a bottom border, hugged to the heading -----

The effect I am talking about can can be seen on
http://www.dwarfscorner.com/ but I achieved it in a "hackish" way. The
Dwarf's Corner logo is not displayed as a h1 but rather a
background-image rule is used whilst h1 is hid from the eyes of user.
Not very nice since I can't make any roll-over effect at all (or I am
not aware of the way this can be achieved). Can h1 be displayed in
inline way and still be not visible? Is there a way to attach a link
to a logo on my site? Any help will be appreciated, thanks in advance.

--
Lukasz Grabun
(reply-to field is fake, use grabek (at) acn dot waw dot pl to reply)

Lukasz Grabun <grabek (AT) purgatory (DOT) abyss> wrote:

The way of swapping standard mark-up tags (h[1-6]) with images is a
common knowledge and as such does not need any recommendation. No
mess, no fuss, a image with fancy font is displayed instead of
"arialy" heading. Nice.

Now, methods I know uses "display:none" rule. It prevents the content
of being displayed.

Dumb method, it's simple:

<h1><img src="headertextgraphic.png" alt="headertext"></h1>

--
Spartanicus

On Tue, 13 Apr 2004 21:47:54 +0100, Spartanicus wrote:

Dumb method, it's simple:

h1><img src="headertextgraphic.png" alt="headertext"></h1

Hm, this way I am including visual tags into structural code.

Currently, I am biased towards float:right for the menu section
(included on the right of h1). I hope it'll work...

--
Lukasz Grabun
(reply-to field is fake, use grabek (at) acn dot waw dot pl to reply)

*Lukasz Grabun* <grabek (AT) purgatory (DOT) abyss>:

On Tue, 13 Apr 2004 21:47:54 +0100, Spartanicus wrote:

h1><img src="headertextgraphic.png" alt="headertext"></h1

Hm, this way I am including visual tags into structural code.

I've not yet seen a working and accessible CSS image replacement technique
that wouldn't require additional nonsense mark-up. Can't think of one
either. 'img' with 'alt' is surely the best solution, if you don't count no
image at all.

--
"The scientific name for an animal that doesn't
either run from or fight its enemies is lunch."
Michael Friedman

Lukasz Grabun <grabek (AT) purgatory (DOT) abyss> wrote:

On Tue, 13 Apr 2004 21:47:54 +0100, Spartanicus wrote:

Dumb method, it's simple:

h1><img src="headertextgraphic.png" alt="headertext"></h1

Hm, this way I am including visual tags into structural code.

If the heading is part of the content then it 100% belongs in the
HTML.

Have you looked at a FIR page with CSS on but image loading off? No
headings at all. :-(

Currently, I am biased towards float:right for the menu section
(included on the right of h1). I hope it'll work...

That would involve placing the menu before the heading in the HTML,
not ideal.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve (AT) pugh (DOT) net> <http://steve.pugh.net/>

*Steve Pugh* <steve (AT) pugh (DOT) net>:

Have you looked at a FIR page with CSS on but image loading off?

JFTR: I usually do surf that way, despite the multiple Mbit/s connection.

--
"I have opinions of my own -- strong opinions --
but I don't always agree with them." - George Bush