JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<div id="banner">
    <p>
    <select class="selector" id="first" name="first"><option value="-1">Selector</option></select>
    </p>
    <p>
    <select class="selector" id="second" name="second"><option value="-1">--</option></select>
    </p>
    <p>
    <select class="selector" id="third" name="third"><option value="-1">--</option></select>
    </p>
</div>
</div>

CSS

#container {
        width: 100%;
        max-width: 458px;
        margin: auto;
    }

    #banner {
        height: 0px;
        padding-bottom: calc(100% * 350 / 458);
        background-image: url('https://s29.postimg.org/f5xjgn53b/selector_header_small_anonymous.png');
        background-size: 100% 100%;
    }

    #banner p {
        position: relative;
        width: 100%;
    }

    #banner p .selector {
        left: calc(100% * 50 / 458);
        position: relative;
        height: calc(100% * 37 / 458);
        width: calc(100% * 250 / 458);

        padding-left: 24px;
        overflow: hidden;
    }

    #banner #first.selector {
        top: calc(100% * 120 / 458);
    }

    #banner #second.selector {
        top: calc(100% * 160 / 458);
    }

    #banner #third.selector {
        top: calc(100% * 201 / 458);
    }