I am having trouble with hover and <p>.
I have reduced the problem to this:
Given a HTML-page like this:
<body>
<a>Number1</a>
<div id="content">
<a>Number2</a>
<p class="nav">
<a>Pnav1</a<a>Pnav2</a>
</p>
<div class="nav">
<a>DIVnav1</a<a>DIVnav22</a>
</div>
<br />
</div>
<a>Number3</a>
</body>
And a CSS like this:
a {font-size: 0.9em;}
a:link {color: red ; text-decoration: none;}
a:visited {color: gray; text-decoration: none;}
a:hover {color: red ; background-color: black; text-decoration: underline;}
a:active {color: red; text-transform: uppercase ; text-decoration:
underline;}
..nav a:hover {color: yellow ; background-color: black; text-decoration:
underline;}
..nav a {font-size:2em font: 1.3em "Trebuchet MS", verdana,
sans-serif;text-decoration: none;text-transform: uppercase;padding: 5px;
margin: 0px 10px;border-style:solid;border-width: 1px;border-color:#542F17;}
p {font-family: Verdana, Arial, sans-serif;font-size: 0.9em;}
/*p:hover {}*/
If I run this page and move the mouse over the text no hovering effect
occurs.
If I uncomment the last line in the CSS it works.
Can someone please explain what I dont grasp?
/k
