Markup from hell

A collection of bad practices in HTML, copied from real websites.

<body>
  <header>…</header>
  <main>…</main>
  <footer>…</footer>

  <div class="cookie_consent modal">
    <p>We use cookies…</p>
    <div class="cookie_consent__close">
      <i class="fa fa-times"></i>
    </div>
    <div class="cookie_consent__ok">OK</div>
  </div>
</body>

Details and tips on how to fix the diabolic code of #9.

#8 anchor tag used as button
submitted on Oct 30, 2019 by Sven
skip code sample
```
<a href="#" onclick="modal.open()">Login</a>
```
Details and tips on how to fix the diabolic code of #8.

<table>
   <tr id="body">
     <td id="body">
       <table id="body">
         <tr id="body_row">
           <td id="body_left">…</td>
           <td id="body_middle">…</td>
           <td id="body_right">…</td>
         </tr>
       </table>
     </td>
   </tr>
 </table>

Details and tips on how to fix the diabolic code of #7.

#6 link with void operator as href value
submitted on Oct 25, 2019 by Sarah
skip code sample
```
<a href="javascript:void(1)" onClick='window.location="index.html"'>Link</a>
```
Details and tips on how to fix the diabolic code of #6.
#5 button-like-link
submitted on Oct 22, 2019 by Vadim
skip code sample
```
<a href="#form" role="button" aria-haspopup="true"> &nbsp;&nbsp;Register&nbsp;&nbsp; </a>
```
Details and tips on how to fix the diabolic code of #5.

Markup from hell

#9 Cookie Consent from Hell

#8 anchor tag used as button

#7 multiple duplicate ids and table layout

#6 link with void operator as href value

#5 button-like-link