Add space to the select box arrow

Explore our HTML category, where you’ll discover a plethora of helpful articles and tutorials suitable for beginners and experienced developers alike. Dive into various HTML elements and structures that can be employed in diverse projects, catering to their unique needs and specifications.
.select-box: This class is applied to a container (probably a div element) that wraps around the select box. It has a background color of #222 (a dark color) and padding of 100px, which might be excessive. You may want to adjust the padding based on your design needs.
.select-box select: This targets the actual select element inside the .select-box. Here are the properties applied to it:
.select-box { background: #222; padding: 100px; } .select-box select { padding: 13px; width: 100%; border-radius: 20px; font-size: 20px; border-right: 20px solid transparent; outline: 0; }
<div class=”select-box”> <select name=”” id=””> <option value=”1″> Select Value </option> <option value=”2″> 2 </option> <option value=”3″> 3 </option> <option value=”4″> 4 </option> <option value=”5″> 5 </option> </select> </div>