JSFiddle - React, Tailwind, and code Playground

by der_robert

HTML

<div class="pp-bg-box2">
    <h2 class="pp-box-h2">So werden Sie Taschenkaufhaus Partner</h2>
    <div class="pp-box-points">
        <div class="pp-box-parts">
            <div class="pp-img-point1"></div>
            <h2 class="pp-box-h2" style="padding:0">Registrieren & Werbung auf Ihrer Webseite platzieren</h2>
        </div>
        <div class="pp-box-parts">
            <div class="pp-img-point2"></div>
            <h2 class="pp-box-h2" style="padding:0">Kunde klickt & kauft bei Taschenkaufhaus</h2>
        </div>
        <div class="pp-box-parts">
            <div class="pp-img-point3"></div>
            <h2 class="pp-box-h2" style="padding:0">Provisionsauszahlung</h2>
        </div>
        <div style="clear:both;"></div>
    </div>
</div>

CSS

/*http://www.taschenkaufhaus.de/resources/tk/img/layout/partnerprogramm/partnerprogramm_sprite.png*/
html{
  background-color: white;
}
div, span, p, td {
    color: #000;
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 12px;
    margin: 0;
}
h2 {
    color: #900;
    font-size: 16px;
    margin: 0;
}
.pp-bg-box1, .pp-bg-box2, .pp-bg-box3, .pp-bg-box4, .pp-projecter, .pp-hook-green {
    background: #fff url("http://www.taschenkaufhaus.de/resources/tk/img/layout/partnerprogramm/partnerprogramm_sprite.png") no-repeat scroll 0 0;
}
.pp-bg-box1, .pp-bg-box2, .pp-bg-box3, .pp-bg-box4 {
    margin-left: -5px;
    width: 711px;
}
.pp-bg-box2 {
    background-position: -5px -325px;
    height: 325px;
    overflow: hidden;
}
.pp-box-h2 {
    color: #000;
    font-size: 13px;
    padding: 7px 7px 7px 15px;
}
.pp-box-points {
    padding: 215px 16px;
    width: 695px;
}
.pp-box-parts {
    float: left;
    margin-left: 16px;
    text-align: center;
    width: 203px;
}
.pp-img-point1 {
    background-position: 0 -750px;
}
.pp-img-point1, .pp-img-point2, .pp-img-point3 {
    background: rgba(0, 0, 0, 0) url("http://www.taschenkaufhaus.de/resources/tk/img/layout/partnerprogramm/partnerprogramm_sprite.png") no-repeat scroll 0 -750px;
    height: 27px;
    margin: auto;
    width: 29px;
}