JSFiddle - React, Tailwind, and code Playground

by Colmea

HTML

<div style="margin: auto; width: 300px">

    <form action="lol.php">
        <div class="select-style">
            <select name="youpi"  required="required" style="width:200px">
                <option value="lol">plop</option>
                <option value="lol">ploqsdqqsdqsdqsdsdp</option>
                <option value="lol">pqsdqsqsdqsdqsdqsdqsddlop</option>
                <option value="lol">plqsdqsdop</option>
            </select><br />
        </div>
        <input type="submit" value="Envoyer" />
    </form>
    
</div>

CSS

.select-style {
    border: 1px solid #ccc;
    width: 190px;
    border-radius: 3px;
    overflow: hidden;
    background: #fafafa url("data:image/png;base64,R0lGODlhDwAUAIABAAAAAP///yH5BAEAAAEALAAAAAAPABQAAAIXjI+py+0Po5wH2HsXzmw//lHiSJZmUAAAOw==") no-repeat 90% 50%;
}

.select-style select {
    padding: 5px 8px;
    width: 120%;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
}

.select-style select:focus {
    outline: none;
}