How do you float elements without a vertical gap?

Question

I am trying to float elements left. Here is my css:

width: 320px;
float: left;
border: 1px solid #ccc;
margin-top: 10px;
margin-right: 10px;
border-radius: 5         


        

Answer 1

Have two different div IDs, one could be #left and the other #right. Everything you want floated on the left side should go into #left and everything you right on the right side goes into #right.

Then you want to add the following style:

#left {
  float: left;
}

That should do the trick. You'll want to apply the style of the boxes separately. If you want an example of this solution in action you can check out my blog, http://refact.io and view the source of my "Recommended Services" which has a similar layout to what you are looking for (two columns with multiple items in each column).

Let me know if this works for you.