How to add space between elements with display: inline-block?

← Back to Community

How to add space between elements with display: inline-block?

Profile icon

upsideumop

Go to aboutme.css. the raindrops look squished together if you go to the about me page. how to fix?

Answered by OldWizard209 [earned 5 cycles]

Voters

Comments

hot new top

Profile icon

OldWizard209

You simpley just need to change the margin size. Go to your aboutme.css and in the .raindrop selector, add a margin-right of 20px or some other number of choice, making the code look like:


.raindrop {
  background: rgb(0, 162, 255);
  border-radius: 10px;
  width: 10px;
  height: 17px;
  animation: hai 5s infinite;
  display: inline-block;
  animation-direction: alternate;
  margin-right: 20px;
}

The page looks like this now:

PS: Mark answer as correct if it helped :P

@OldWizard209 thx!

np, here to help @upsideumop