JSFiddle - React, Tailwind, and code Playground

HTML

<table id="mytable">

      <tr id="titles">
        <th id="varekodetext">Varekode</th>
        <th id="produkttext">Produkt</th>
        <th colspan="2" id="pristext">Pris</th>

        <th id="antalltext">Antall</th>
        <th id="pristotaltext">Pris Total</th>
        <th id="sletttext">Slett</th>
      </tr>
          <tr class="even first">
        <td class="cart2Varekode">                    <span>39261-02 </span>

                        </td>
        <td class="cart2Produkt">                     <a href="/Plantronics-CS361N.11" target="_blank" class="tooltip" title="Plantronics CS361N">
                    Plantronics CS361N
                    <span>
                    <img src="upload/productimage/11-22-2.jpg?1249726571" alt="Plantronics CS361N" />
                    </span>
                    </a>
                    
                            
            <p>
             
                        </p>

            
      </td>
        <td class="cart2Price"><span class="actualPrice">2390.-</span></td>
        <td class="cart2Salg">
    <span class="orderlistPrice">
        
    </span>
    </td>
        <td class="antallbox">
        <span class="cartQuant"><input name="item_1364" class="DG-spinner" id="text" type="text" value="1"/> 
        
        <span class="cartUpdate"><button type="submit" class="submit" id="rfrsh_btn" name="saveFields" title="Oppdater" value="">&nbsp;</button></span>

        </span>
</td>


<td class="cart2Total">

                <span class="basePrice">2390.-</span><span class="actualPrice">2390.-</span>
                        
            </td>
        <td class="delete">
        
                    <a class="slett" href="../..//order/delete/1364?return=" title="Slett"></a>

            
            </td>
      </tr>
     <tr class="odd last">
        <td class="cart2Varekode">                    <span>7050-20</span>
                        </td>
        <td class="cart2Produkt">                     <a...

CSS

/*NEW PRODUCT PAGE BY KS*/

/***********************************TITLES*/

#mytable,
#mytable th,
#mytable tr,
#mytable td

{
    border: 0;
    width:555px;
}


#titles  {
   margin: 0px auto 0px auto;
   width: 555px;
   padding-bottom:50px;
   z-index:1;
   border: 1px #ccc solid;
   
}


.cart2Produkt a {
    color:#0a5692;
    text-decoration:none;
    line-height:15px;
    clear:both;
    z-index:999;
}

productOptionsMenu {
    clear:both;
}

#pristotaltext p,
#varekodetext p,
#sletttext p,
#pristext p,
#antalltext p,
#produkttext p  {
   font: 12px/11px "Helvetica";
   margin: 0px;
   color: #828273;
   text-align: left;
}

#thinline,
#thinlinecopy  {
   background: url(../../upload/thinline.png) no-repeat;
   visibility: visible;
   position: absolute;
   left: 0px;
   z-index: 4;
   width: 747px;
   height: 1px;
}

#thinlinefakt{
   background: url(../../upload/thinline.png) no-repeat;
   visibility: visible;
   position: absolute;
   top:100px;
   left: 0px;
   z-index: 4;
   width: 747px;
   height: 1px;
}

#thinlinefakt2{
   background: url(../../upload/thinline.png) no-repeat;
   background-position: bottom;
   visibility: visible;
   position: absolute;
   top:205px;
   left: 0px;
   z-index: 4;
   width: 747px;
   height: 28px;
   margin:5px;
    margin-left:10px;
    margin-top:0px;
    padding:5px;
    color:#000000;
    font-size:22px;
    font-family: "Helvetica";
}

.Fadresse {
    display:block;
margin:5px;
    padding:0;
    color:#000000;
    font-size:22px;
    font-family: "Helvetica";
}

#thinlinecopylever  {
   background: url(../../upload/thinline.png) no-repeat;
   background-repeat:repeat-x;
   position: relative;
   left: 0px;
   top: -3px;
   width: 100%;
   height: 1px;
   padding:0px;
}

#varekodetext  {
   visibility: visible;
   width: 65px;
}

#produkttext  {
   visibility: visible;
   z-index: 4;
   width: 120px;
}





#sgproductview  {

   margin: 0px auto 0px auto;
   width: 555px;
   height:1%;
  ...