How to space the children of a div with css?

Question

I want a gap of say 30px; between all children of my div. E.g if I have:

    
   
   
...
   

        
      

Answer 1

The following css will work well

div > *:not(:last-child) {
    display: block;
    margin-bottom: 30px; 
} 

> selects all elements that are direct children of the div (so you don't get weird inner spacing issues), and adds a bottom margin to all that aren't the last child, using :not(:last-child) (so you don't get a trailing space).

display: block makes sure all elements are displayed as blocks (occupying their own lines), which imgs aren't by default.