Ashan Ranasinghe
Ashan Ranasinghe

Reputation: 11

HTML Validation anchor tag

I'm having a simple problem with validating a piece of code. would like some input as to what i'm doing wrong. when i validate it it gives a warning saying i should close the anchor tag. but i need both the header and the paragraph to be highlighted using css. the html code is below

<li>
    <a href="#">Home</a>
    <div class="menu-dropdown">
        <div class="menu-items">
            <a href="#">
            <h4>Why Choose Cyberskills?</h4>
            <p>There are a number of reason to choose Cyberskills. Click here to find out more...</p>
        </a>
        </div>
    </div>
</li>

the css code is below

menu-items a{
    display: block;
    padding: 10px;
    text-shadow: 1px 1px 1px #666666;
    text-decoration: none;
    color: #000000;
}
.menu-items a:hover{
display: block;
background: #666666;
-moz-border-radius: 3px;
    -webkit-border-radius: 3px;  
    border-radius: 3px;
}

Upvotes: 1

Views: 1290

Answers (1)

Armin
Armin

Reputation: 15938

In HTML5 this is valid. In XHTML 1.0 Transitional not, cause it is not allowed to put "block tags" inside of a link. Block tags are tags in HTML which got display: block per default, like: div, p, h1, h2, ...

You could use <span> instead of h4 and p or put the links inside of h4 and p.

Upvotes: 2

Related Questions