Question: Is it possible to get a multiple select box to behave like a select box in the following way: Only show selection box (1 row) and expand when clicked?

```
<select multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

```

but I only want to see the empty 1 row select box until clicked and then have it expand as a dropdown with scroll bar if needed

Answer: 
I hope CSS is enough to solve your problem. Try something like this.

```css
select{height:20px}
select:focus{height:auto}
```

```html
    <select multiple>
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </select>
```
I believe what you are trying to do can be accomplished by:

```html
<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
```

Try running the above snippet and see if that's what you were looking for.

Hope that helped!