JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" lang="en"/>
<title>title</title>
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2/swfobject.js"></script>  
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>

 
<div class="ikinciSol">
                <a href="javascript:void(0);"
                <a href="javascript:void(0);" onclick="stop();">Stop</a>
                <a name="ytplayer"></a>
<div id="ytplayer">You need Flash player 10+ and JavaScript enabled to view this video.</div>
<div id="ytplayer_div2"></div>
    <ul id="mylist">
    <li>
    <div class="artist_track">
        <img id="trackArrow" src="http://olmasigereken.com/demo2/img/track_arrow.gif">
        <div class="singer">
            <a href="#" title="">Title1</a>
        </div>                                                             
        -
        <div class="song">
            <a href="#" title="">lorem ipsum1</a>
        </div>
    </div>
        <div class="fav">
            <a target="_blank" title"Share on Twitter" href="#"><img src="http://www.olmasigereken.com/demo2/img/twit.gif" alt="share on twitter" /></a>
            <a target="_blank" title"Share on Facebook" href="#"> <img src="http://www.olmasigereken.com/demo2/img/face.gif" alt="share on facebook" /> </a>
        </div>
    
    </li>
    <li>
    <div class="artist_track">
        <img id="trackArrow" src="http://olmasigereken.com/demo2/img/track_arrow.gif">
        <div class="singer">
            <a href="#" title="">Title2</a>
        </div>                                                             
        -
        <div class="song">
            <a href="#" title="">lorem ipsum2</a>
        </div>
    </div>
...

CSS

body {
    line-height: 1;
    background:#000000;
    color:#fff;
}

#ytplayer_div2
{
    width: 200px;
}
#ytplayer_div2 a
{
display: block;
height: auto;
width: 110px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 0px;
overflow: hidden;
}

 .ikinciSol{
    width:550px;
    height:auto;
    float:left;
    margin-right:0px;
    font-family:Verdana, Geneva, sans-serif;
    text-align:left;
}

.ikinciSol h1{
    font-weight:bold;
    text-decoration:none;
    font-size:14px;
    font-family:Verdana, Geneva, sans-serif;
    color:#fb891a;
}

.ikinciSol ul
{
    list-style-type: none;
}

.ikinciSol ul li {
    margin-left:50px;
    margin-top:5px;
    margin-bottom:5px;
}

.ikinciSol ul li .singer{
    font-size:18px;
    margin-bottom:15px;
    display:inline;
}

.ikinciSol ul li .song{
    font-size:14px;
    margin-bottom:15px;
    display:inline;
}

.ikinciSol ul li a{
    text-decoration:none;
    color:#fff;
    margin-right:5px;
}

.ikinciSol ul li .singer a:hover{
    background:#e5da5f;
    color:#000;
}

.ikinciSol ul li  .song a:hover{
    background:#FF9966;
    color:#000;
}

.artist_track{
    margin-right:12px;
    float:left;
}
.fav{

}    
.temiz{
    border-style:solid;
    border-color:red;
    margin-left:10px;
}
   
.temiz{
    margin-left:10px;
}