Is it possible to add a before element in selection box?-CodePudding

I'm trying to add an SVG image before the select input box. Here is the code

<select  name="" id="">
    <option value="">Last 7 days</option>
    <option value="">Last 3 days</option>
</select>

This is what I'm trying to achieve

CodePudding user response：

I think you should try styles for custom select

.custom_select {
  display: inline-flex;
  border: 1px solid black;
  border-radius: 8px;
  overflow: hidden;
  padding: 4px;
}

.rankings_selection {
  border: none;
  outline: none;
  padding: 0;
}

<div >
  <img src='https://picsum.photos/24/24' />
  <select  name="" id="">
    <option value="">Last 7 days</option>
    <option value="">Last 3 days</option>
  </select>
  <div>