Is wrapping a div inside an anchor tag valid code?

HTML & CSS
1

Using this as a example.

  <a href="#" target="_blank">
    <div class="test"></div>
  </a>
2

Yes, putting an anchor around a block is valid in HTML5 specs.
It is recommended that the anchor be assigned {display:block} or {display:inline-block}

1 Like
3

Try cutting and pasting the script into the free online validator or pasting the link to your web page.

…far quicker than waiting for answers to the post :slight_smile:

5 Likes
4

Using this as an example.

Would this get

{display:block} or {display:inline-block}

It seems it would get inline block then, right?

or maybe it’s just a block element.

An anchor tag is an inline element, a div tag is a block element.

.wrape .nav a:nth-of-type(15) {
  position: relative;
  border: 3px solid #0059dd;
  background: none;
}

    <a href="" target="_blank" title="">
      <div class="left-background"></div>
      <div class="left-border"></div>
      <div class="middle-background"></div>
      <div class="right-border"></div>
      <div class="right-background"></div>
    </a>

image

5

I’m already using

float:left;

.wrape .nav a {
  float: left;
  width: 50px;
  height: 50px;
  margin: 0 4px 12px 0;
  color: transparent;
  background: rgba(0, 0, 0, .2);
  border: 3px solid #0059dd;
  box-sizing: border-box;
}

“An element that is floated is automatically display: block;”

Then in this case it wouldn’t need to be assigned {display:block} or {display:inline-block} since it already is.

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.