Hi,
what is the task with which I could not cope?
There is a link with an inline-element (strong e.g.) inside. It has a
higher font-size than the content of its parent.
For the hover effect I prefer an inverse styling.
Hovering should just cover the link and not his parent (li e.g.).
My question:
How could one realize a hovering about the full height of the
inline-element with a higher font-size than it's parent?
I search for a solution which works well on actual(tm) browsers.
In the following you find a screenshot, the code and a testcase with
the code.
Thank you.
Screenshot:
http://borumat.de/bilder/misc/temp/hc-083.png
Code:
| strong{
| font-size: 2em;
| }
| a{
| text-decoration: none;
| }
| a:link{
| color: blue;
| background: white;
| }
| a:link:hover{
| background: blue;
| color: white;
| }
| a:visited{
| color: red;
| background: white;
| }
| a:visited:hover{
| background: red;
| color: white;
| }
| <ul>
| <li><a href="#a">Lorem <strong>ipsum</strongdolor<br />
| sit amet</a></li>
| <li><a href="#b">Consectetur adipisicing elit<br />
| sed <strong>do</strongeiusmod
| tempor</a></li>
| <li><a href="#c">Incididunt ut <strong>labore</strong><br />
| et dolore magna aliqua</a></li>
| </ul>
Testcase:
http://borumat.de/html/temp/hover-ni...olle-hoehe.php
Andreas
--
http://borumat.de/firefox-browser-tipps
http://borumat.de/thunderbird-email-tipps
http://borumat.de/openoffice-writer-tipps
http://borumat.de/40tude-dialog-newsreader-tipps
