Что не так с тегом ?

Question

[Хазрат Гаджикеримов]

Сверстал следующий блок:

<a class="href" href="#">
     <div class="logo"></div>
     <div class="block">
             <h2>Febox - создание сайтов</h2>
              <p>Веб-студия дизайна</p>
      </div>
      <a class="link" href="#">
           <i class="fa fa-chevron-right"></i>
      </a>
</a>

Вроде бы все понятно, в блоке a.href есть другой блок a.link, но при отображении в браузере вижу следующее:



Теги a не могут быть вложенными?

Answer 1

[Александр Маджугин]

Ниче не понятно. Некоторые теги не могут быть вложенными. Например P. В том числе и A. Просто вложение тегов не имеет смысла и при открытии нового тега, тег родитель будет автоматически закрываться.

Answer 2

[Rsa97]

Из официального стандарта:

The a element may be wrapped around entire paragraphs, lists, tables, and so forth, even entire sections, so long as there is no interactive content within (e.g. buttons or other links).

Answer 3

[Александр Аксентьев]

Нет...

Как оно по вашему должно работать? По двум ссылкам одновременно переходить?

Зачем вторая ссылка для иконки вообще?

Comments

[Хазрат Гаджикеримов]

Предпологаю разные действия им.

[Александр Аксентьев]

Хазрат Гаджикеримов: так а браузер-то как должен это обрабатывать, для него это ссылки и он не уметь так делать.

Answer 4

[Шаров Дмитрий]

Вообще стоит пересмотреть вам вашу разметку и привести к рациональному виду
Ну уж если вам так хочется поизвращаться, то сделайте так

<a class="href" href="#">
     <div class="logo"></div>
     <div class="block">
             <h2>Febox - создание сайтов</h2>
              <p>Веб-студия дизайна</p>
      </div>
      <div class="link" onclik="location.href='/path/to/res'">
           <i class="fa fa-chevron-right"></i>
      </div>
</a>