Custom styled dropdown
Html and Css
<div class="select-dropdown"> <select name="my-review-status" id="my-review-status"> <option value="1">Given</option> <option value="2">Not Given</option> </select> </div> .select-dropdown { position: relative; background-color: #e6e6e6; width: auto; float: left; max-width: 100%; border-radius: 2px; } .select-dropdown select { font-family: "helvetica neue", helvetica; font-size: 1rem; font-weight: 200; max-width: 100%; padding: 8px 24px 8px 10px; border: none; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .select-dropdown select:active, .select-dropdown select:focus { outline: none; box-shadow: none; } .select-dropdown:after { content: " "; position: absolute; top: 50%; margin-top: -2px; right: 8px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #aaa; }