Div Region Acting Like Unordered List Item Link From A Different Region on Hover!

[hyliandanny]

I'm confused by a behavior I'm seeing when I create a list of links in the navigation section, though. I hope this post isn't governed by HTML...

 

 

------- HTML code follows -------

 

<div id="centerDoc">

 

<h1>The Main Heading</h1>

 

 

Go to the Web Designers Killer Handbook home page and grab the

practice HTML page that we will used as the starting template for this

tutorial. You can find it under the heading: 'To create the practice HTML

page do the following:'.

 

Follow the instructions there and create your basic HTML page

... and do it now!

 

</div>

 

 

<div id="navigation">

 

<h2>The Main navigation</h2>

 

<ul>

<li><a href="http://www.dannyfavela.com">My site!</li>

<li><a href="http://www.homestarrunner.com/">I need to catch up with this...</li>

<li><a href="http://maddox.xmission.com/">Logic is manly!</li>

</ul>

 

</div>

 

------- HTML code has ended -------

 

Now, that works fine. You'll notice that my "navigation" section follows after my "centerDoc" section. This is because if I have the navigation section outlined first, then the entire "centerDoc" div becomes a hyperlink! Text or not, it will link to the last item in the unordered list and will have the CSS activate for the last li when I hover over the centerDoc area. It's as if I were hovering over the li itself!

 

I'd love any insight you might have as to why this is -- even if it's just "You did something wrong, Danny".

[falkencreative]

It seems like you are missing closing </a> tags that indicate the end of the link.

 

For example: <li><a href="http://www.dannyfavela.com">My site!</a></li>

 

I'm not sure I'm completely understanding your issue, but put those closing </a>s in place and let me know if your issue goes away.

[hyliandanny]

Nope, you're completely right! How stupid of me!

 

Thanks! That explains why, when the second div was above the first, the following entire div would behave like the last link in the list!