JSFiddle - React, Tailwind, and code Playground

HTML

<div class="body">

      <div id="1">

          <div class="cProfile" id="1">
            <h1>Title<br><hr></h1>
            <div class="col-4" id="1">
                <h3 id="idAbout">Text</h3>
                <span id="idAboutTxt">Bla bla bla, bla bla bla, bla bla bla, bla bla bla, bla bla bla, bla bla bla, bla bla bla, bla bla bla, bla bla bla, 
                                        bla bla bla, bla bla bla, bla bla bla, bla bla bla, </span> 
            </div>

            <div class="col-4" id="1">
                <img class="imgYo" src="http://www.apicius.es/wp-content/uploads/2012/07/IMG-20120714-009211.jpg" alt="ooops!">
            </div>

            <div class="col-4" id="1">
                <div class="cv">

                    <div class="google">
                      <a href="https://www.google.com/" target="_blank">
                        <table>
                            <tr>
                                <td><img src="https://yt3.ggpht.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAAAA/OixOH_h84Po/s900-c-k-no-mo-rj-c0xffffff/photo.jpg"></td>
                                <td></img><span>Google</span></td>
                            </tr>
                        </table>
                      </a>
                    </div>

                    <div class="dropdown">
                      <button class="dropbtn">Download</button>
                      <div class="dropdown-content" style="left:0;">
                        <a href="1" download>1</a>
                        <a href="2" download>2</a>
                      </div>
                    </div>

                </div>
            </div>
          </div>
      </div>
    </div>

CSS

[class*="col-"] {
    float: left;
}

@media only screen and (min-width: 1200px) {
    /* PC: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;} 
}

.cProfile{
    margin: 5px 15%;
}

.cProfile h1{
    text-align:center;
    color:#5882FA;
    font-size:54px;
}

.cProfile h3{
    color:#5882FA;
    font-size:27px;
}

.imgYo{
  border-radius:50%;
  display: block;
  margin: auto;
  border: 1px solid #5882FA;
  border-radius: 4px;
  padding: 5px 5px;
  margin: 25px 10px 10px 10px;
  width:80%;
  height:80%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.anchor{
  display: block;
  height: 90px; 
  margin-top: -90px; 
  visibility: hidden;
}

.cv{
    padding:20%;
    margin:auto;
}

.cv span{   
    height:50px;
    text-align:center;
    letter-spacing: 0px;
}

.google a{
  text-decoration: none;
  font-variant: small-caps;
  font-style: bold;
  letter-spacing: -1px;
  font-size: 30px;
  margin:auto;
}

a:link {
    color: black;
}

a:visited {
    color: black;
}

.google img{
    width:50px;
    height:50px;
}

/* Dropdown Button */
.dropbtn {
    color: black;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    padding:20px;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    height:200px;
    padding-top:30px;
    margin:auto;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
   ...