Re: Background to hyperlinks?

Hi Hilma,

> 1/ why i should not be doing this, or

I see no reason not to do this... it's a good reuse of one image to reduce
the page's weight. That's to be commended.

> 3/ Whether it *can* work successfully and to persevere - and if so, what
> technique i should use to
> 2/ get it working?  :-)

Hmm, you seem to have 2 & 3 mixed up, but that's okay... Here's my
suggestion:

<.div style="background: url('button.gif'); width: 150px; height: 50px;">
    <.a href="link.html">Linking Text</a>
</div>

Now, that's VERY basic and will require additional tweaking to your
satisfaction, but it should produce what you're looking for: a background
image with text placed on top of it that is linkable. I use a variation of
this technique (customized as needed for my sites) and it works very well in
MSIE 6, NS 6, and OP 6.

I suggest you try variations on the above until you get it to work for you,
as it CAN work.

For additional CSS help, I would recommend you subscribe to the STYLES list,
as there's a lot of good information passed in there, too.

Good luck!
Kehvan

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
:: NORTON ANTI-VIRUS 2002 scanned this email prior to sending. It is free
:: of any known embedded or attached viruses, trojans, or internet worms.
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::


----- Original Message -----
From: "Hilma" <Hilma(at)hilma.freeserve.co.uk>
To: <hwg-techniques(at)hwg.org>
Sent: Saturday, March 30, 2002 23:38
Subject: Background to hyperlinks?


> Hi all-
> I'm not sure I'm allowed here (being a beginner) - but i've read loads of
> books and got no help on one problem, so i'm hoping someone here can
answer
> it.
> I suspect the answer will be "don't do it" - as no-one else seems to so
it,
> there must *be* a problem with my aim; but i can;t see it; unless it is
> simply impossible :-(
>
> What i want to do is -
> Define, via a css, a background image to a hyperlink;
> i.e. I want to have a single (blank) button image for my site, and overlay
> hyperlinks on it as the text.
> So it looked and acted exactly as a navigation button, but the image was a
> background to a text-link :-)
>
> I got it working in IE6; no problem, it did exactly what i wanted;
> Then i branched out into the exciting world of "browser compatibility" (
> only NS6 and Opera )- and things went pear-shaped;
> the NS background button-image was only the height of the text on it,
rather
> that the defined size, and Opera doesn;t show background images - at
least,
> not to links it doesn't (at least - i cannot persuade it to do so!).
>
> I struggled on, used a "sizing text" to force the NS image to be big
enough
> (with plans to make it the same colour as the button, or possibly
invisible
> as i've since discovered the invisibility attribute);
> and i declared a background colour for Opera in the same place.
> So (using the z-index and also the sequence of declarations) I ended up
> with:
> a background colour the size of a button, overlaid by
> a background image of a button, overlaid by
> some spacer-text with a font to force the background image and colour to
be
> the correct size, overlaid by
> my hyperlink.
>
> Which looked ok (but not perfect) in the 3 browsers; but then Opera's
> hyperlink didn;t work.
> Since then, I've got a hyperlink over a bgColour to work in Opera; but
then
> i can't figure out the code that i'd already written  to get the whole
thing
> going as i wanted it (as i don't have a lot of fluency in HTML yet!)
>
> But also, i cannot see that what i want to do is really so extreme; it
makes
> sense with bandwidth to need only one button, but more, it gives the
> flexibility to add more buttons and change the text within HTML, without
the
> need to go running back to the image-processing package to create new
> buttons, and makes changing button style soooo easy.
>
> Please, can anyone tell me either
> 1/ why i should not be doing this, or
> 3/ Whether it *can* work successfully and to persevere - and if so, what
> technique i should use to
> 2/ get it working?  :-)
>
> many thanks for any ideas and comments -
>
> hilma
> --x----
>
>
>

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA