Why isn't this anchor tag taking up 100% of the available space of its parent div?

Question

My understanding leads me to believe that putting a `` with the `display:block;` CSS property inside of a `

` is supposed to cause that entire div to "become" the link (IE anywhere I hover in the div, it is considered the link, because the link takes up 100% height and width). That behavior doesn't seem to be working in the example below. If you'd rather `inspect element` and poke around yourself with the live code, you can view the site @: http://shayla.phasesolutions.ca/. See the nav at the top of the page for the issue I'm describing. HTML: ```

``` CSS: ``` header { .site-section; height: 125px; div { float: left; posi…

Accepted Answer

I believe its because the block element has no content inside of it. If you add a letter inside the anchor link the anchor link will become 100% of the width of the div.

If you add width:100% and height:100% it will take up the entire div.

Why isn't this anchor tag taking up 100% of the available space of its parent div?

Solution

Problem