I want the code to show up the 3 bars, and the 3 dots to eventually be dropdown options. For some reason the 1st out of the 3 dots does not want to be spaced correctly.

```css
#dropdown {
  background: #3f51b5;
  padding: 30px;
  margin: 0px;
}

#dot {
  width: 5px;
  height: 5px;
  background: white;
  border-radius: 50%;
  float: right;
}

#bar {
  width: 25px;
  height: 3px;
  background: white;
  margin: 5px;
}
```

```html
<div id="dropdown">
  <div id="dot"></div>
  <div id="bar"></div>
  <div id="dot"></div>
  <div id="bar"></div>
  <div id="dot"></div>
  <div id="bar"></div>
</div>
```

Picture of what is returned:

![image](https://i.stack.imgur.com/qOK6F.png)