[vox-tech] CSS question: hover above an <A> tag

[Mark K. Kim]

   a {
      font-weight: bold;
      color: rgb(62, 62, 183);
      background-color: transparent;
      text-decoration: none;
      padding: 2px;

      /* added: */
      border-width: 2px;
      border-style: clear;
   }

It works under Mozilla, anyway.  For a funky effect, try putting a
background image into a:hover section of the CSS.  You can even animate it
with a GIF.

-Mark


On Sat, 13 Dec 2003, Peter Jay Salzman wrote:

> hi all,
>
> i have this in my style file to put a colored background and border
> around <A> links when the mouse hovers above the link:
>
>    a {
>       font-weight: bold;
>       color: rgb(62, 62, 183);
>       background-color: transparent;
>       text-decoration: none;
>       padding: 2px;
>    }
>
>    a:hover {
>       color: rgb(0, 0, 0);
>       background-color: rgb(153, 153, 204);
>       text-decoration: none;
>       border-width: 2px;
>       border-style: solid;
>       border-color: #000000;
>    }
>
>
> and i like the effect a lot.  the problem is that when the mouse hovers
> above the link, a little extra space is added around the link, and it
> reformats the paragraph slightly.
>
> here's an example:
>
>    http://www.dirac.org/p/test.html
>
> how do i avoid the extra space from reformatting the paragraph?
>
> thanks!
> pete
>
>
> --
> Make everything as simple as possible, but no simpler.  -- Albert Einstein
> GPG Instructions: http://www.dirac.org/linux/gpg
> GPG Fingerprint: B9F1 6CF3 47C4 7CD8 D33E 70A9 A3B9 1945 67EA 951D
> _______________________________________________
> vox-tech mailing list
> vox-tech@lists.lugod.org
> http://lists.lugod.org/mailman/listinfo/vox-tech
>

-- 
Mark K. Kim
AIM: markus kimius
Homepage: http://www.cbreak.org/
Xanga: http://www.xanga.com/vindaci
Friendster: http://www.friendster.com/user.jsp?id=13046
PGP key fingerprint: 7324 BACA 53AD E504 A76E  5167 6822 94F0 F298 5DCE
PGP key available on the homepage