Untitled

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        box-sizing: border-box;
      }
      html,
      body,
      div,
      span,
      h1,
      h2,
      h3,
      h4,
      h5,
      h6,
      p,
      a,
      img,
      dl,
      dt,
      dd,
      ol,
      ul,
      li,
      form,
      table,
      caption,
      tr,
      th,
      td,
      article,
      aside,
      footer,
      header {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        vertical-align: baseline;
      }
      #header {
        font-size: 2em;
        padding: 20px;
        border-bottom: 1px solid #000;
        background-color: #dedede;
        margin-bottom: 0px;
      }

      #menu ul li {
        display: inline-block;
        border-left: 1px solid #000;
        font-size: 1.5em;
        padding: 5px;
      }
      #menu ul li a {
        text-decoration: none;
      }
      #menu ul li:last-child {
        border-right: none;
      }
      #menu ul li:first-child {
        border-left: none;
      }
      #sidebarl {
        float: left;
        width: 20%;
        padding: 10px;
      }
      #sidebarr {
        float: right;
        width: 20%;
        padding: 10px;
      }
      #sidebarl h3 {
        font-size: 1.3em;
      }
      #sidebarr h3 {
        font-size: 1.3em;
      }
      #main {
        margin: 0;
        border-top: 1px solid #000;
        border-right: 1px solid #000;
        border-left: 1px solid #000;
        padding: 10px;
        width: 60%;
        margin-left: 20%;
        margin-right: 20%;
        background-color: #fff;
      }
      #main img {
        float: left;
        width: 50px;
        height: 100px;
        margin: 10px 10px 0px 0px;
      }
      #main h2 {
        font-size: 1.6em;
      }
      .wrapper {
        border-top: 1px solid #000;
      }
      #footer {
        background-color: #ddd;
        text-align: center;
      }
    </style>
  </head>
  <body>
    <div id="header">
      <h1>MySite.org</h1>
    </div>
    <div id="menu">
      <ul>
        <li><a href="">О блоге</a></li>
        <li><a href="">Сотрудничество</a></li>
        <li><a href="">Контакты</a></li>
        <li><a href="">Прочее</a></li>
      </ul>
    </div>
    <div class="wrapper">
      <div id="sidebarl">
        <h3>Lorem ipsum dolor sit amet.</h3>
        <br />
        <p>
          Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque,
          eligendi? Autem eos tempore eaque fuga quos soluta eum maiores a quod
          sunt illo animi, quisquam eligendi labore praesentium, non quae.
        </p>
      </div>
      <div id="sidebarr">
        <h3>Lorem ipsum dolor sit amet.</h3>
        <br />
        <p>
          Lorem ipsum dolor sit, amet consectetur adipisicing elit. Error
          tenetur molestiae excepturi amet numquam optio molestias! Dolorum
          tenetur ut distinctio excepturi numquam maiores expedita, vero ratione
          nesciunt vel eius eveniet.
        </p>
      </div>
      <div id="main">
        <h2>
          Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi,
          assumenda.
        </h2>
        <p>
          <img src="2c74a75cec93bb0d89d90217b9a1ed6d.jpg" alt="" /> Lorem ipsum
          dolor sit amet consectetur adipisicing elit. Similique quaerat non
          nulla consequatur, ratione fuga dolor dolorem commodi, obcaecati iste
          animi accusantium, magni nihil velit maiores soluta quidem sequi
          asperiores quasi! Voluptatum, adipisci ipsum tenetur labore architecto
          iusto vero placeat voluptas, repudiandae sed, explicabo saepe! Est eum
          ut doloribus nulla voluptatum, inventore numquam incidunt blanditiis,
          ex possimus amet? Sint laborum voluptate deleniti dolorum voluptas
          architecto omnis atque officiis molestiae, unde possimus quis tempora
          repudiandae dignissimos numquam? Nemo, ducimus labore similique odio
          aperiam cupiditate eos reprehenderit magnam tempore illum consectetur
          voluptatem sequi fugiat quam eius sit praesentium maxime voluptates
          atque ut. Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem
          voluptatibus sed voluptas deserunt earum dolorum tempore cumque
          praesentium, veniam excepturi fugit voluptatem dolore saepe asperiores
          hic eos. Expedita, minus! Quasi consequuntur porro consectetur,
          repellendus eius illum corporis itaque laborum quas temporibus! Esse,
          enim officiis non est provident optio? Vitae repellat quisquam alias
          facere tenetur rerum molestias? Harum blanditiis expedita qui dolorem
          beatae assumenda maiores omnis. Quam eveniet eaque enim, commodi sit
          dolores expedita suscipit aut voluptatem natus sapiente, fugit nisi at
          ad tenetur amet maxime consectetur aspernatur aliquid praesentium
          modi. Sunt temporibus perferendis inventore quod magni blanditiis
          veritatis voluptas iste. Lorem ipsum dolor sit amet consectetur
          adipisicing elit. Quidem, fugit explicabo! Velit quis necessitatibus,
          sint laborum laudantium vel cupiditate voluptas mollitia esse
          perferendis provident sequi adipisci voluptatum iure! Autem asperiores
          minima velit, debitis ea incidunt cupiditate! Aliquid natus
          accusantium, quidem, eaque saepe deleniti voluptatibus id perferendis
          accusamus maiores nulla blanditiis eligendi corporis cupiditate
          tempore deserunt optio modi asperiores iusto, sequi quo at veniam
          exercitationem? Eligendi assumenda eius mollitia est libero, maxime
          itaque laboriosam, fugit deleniti cum repellendus sit aperiam dolor
          distinctio autem placeat? Vitae tempora et illo, eius libero pariatur
          voluptatibus numquam magni repudiandae illum ratione tempore ut eaque
          recusandae neque commodi deserunt quos placeat dicta aut. Repudiandae
          itaque quaerat qui omnis? Omnis ut saepe molestias fugiat, minus
          sapiente porro dolores dolore eius fuga, repellat sint consequuntur
          ipsa minima odio blanditiis harum labore sed aliquid cupiditate
          laborum, rerum itaque quisquam. Obcaecati voluptatibus, excepturi
          exercitationem possimus neque sit quae veniam cupiditate eum dolores
          facere doloremque beatae repudiandae accusamus, magni repellendus
          deserunt minus corporis blanditiis atque rem quia! Labore illo velit,
          aperiam sed nobis assumenda a autem voluptate recusandae doloribus!
          Placeat repellat non nesciunt eos officiis ipsum soluta quas
          consequatur laboriosam repudiandae dolores necessitatibus sit deserunt
          sed quidem, cumque dolor cum? Maxime eos rem magnam eum aperiam
          aspernatur nostrum delectus, ea quaerat asperiores repellendus.
          Quibusdam, magni laborum adipisci exercitationem obcaecati tenetur ea,
          amet harum repellat ut praesentium eveniet odit numquam fuga sapiente.
          Asperiores voluptate rerum possimus ea consequatur id sit distinctio
          unde accusamus?
        </p>
      </div>
    </div>
    <div id="footer">
      <p>copyrait admin sup /dr/!</p>
    </div>
  </body>
</html>