的CSS選擇框箭頭

Question

我想補充的下拉箭頭，在選擇box.I都試過，但箭頭顯示後面的選擇box.I想箭頭​​將選擇框

.form-item-custom-search-types::before { 
 
    content: ''; 
 
    display: block; 
 
    border: 9px solid transparent; 
 
    border-top-color: #4d1c73; 
 
    position: absolute; 
 
    /* right: -17px; */ 
 
    top: calc(50% - 2px); 
 
} 
 

 
.form-item-custom-search-types select { 
 
    appearance: none; 
 
    -moz-appearance: none; 
 
    -webkit-appearance: none; 
 
}

<div class="form-item form-type-select form-item-custom-search-types"> 
 
    <label class="element-invisible" for="edit-custom-search-types">Search for </label> 
 
    <select class="custom-search-selector custom-search-types form-select" id="edit-custom-search-types" name="custom_search_types">  <option value="c-all" selected="selected">All</option> 
 
    <option value="c-announcement">Announcements</option> 
 
    <option value="c-article">Articles</option><option value="c-blog">Blogs</option> 
 
    <option value="c-forum">Forums</option> 
 
    <option value="c-gallery">Galleries</option> 
 
    <option value="c-Documents">Documents</option> 
 
    </select> 
 
</div>

內