3

I'm experimenting with CSS3 columns, and I noticed there are top and bottom margins added, despite that I explicitly set them to 0. Here's a screenshot:

enter image description here

I've highlighted the margins in yellow. The red rectangles are block level element outlines drawn from the Web Developer Toolbar add-on in Firefox.

Here's my CSS:

.section .content {
  -moz-column-count: 2;
  -moz-column-gap: 26px;
  margin: 0px;
  padding: 0px;
}

How can I get rid of the margins?

Upon request uploaded my code to jsbin. It also shows the discrepancy between the tops for the two columns. The margin doesn't show when I don't use columns.

TylerH
  • 20,799
  • 66
  • 75
  • 101
stevenvh
  • 2,971
  • 9
  • 41
  • 54
  • @Michael - Seems to be down. I first got a "500 Internal server error", but now iidrn.com confirms it is down. – stevenvh Jan 31 '13 at 15:11
  • jsFiddle is down, try this http://jsbin.com/ ..... are you sure that that margin isn't a margin bottom from the h1? What happens if you remove your column css, do you still see that margin? – Ricardo Castañeda Jan 31 '13 at 15:22
  • @Cadence - I added a link to my code on jsbin. The margin doesn't show if I don't use columns. So it's not a marging from h1 (which would also show the margin for the second coumn, IMO). Thanks for your reply. – stevenvh Jan 31 '13 at 15:52

1 Answers1

4

Your problem is very simple, you are adding CSS to content, but content contains a paragraph with a margin. Reset it to 0.

p {
    margin:0
}
<div class="section">
    <h1>Heading 1</h1>
    <div class="content">
        <p>
        </p>
    </div>
</div>

http://jsbin.com/ufobax/2/edit

TylerH
  • 20,799
  • 66
  • 75
  • 101
Ricardo Castañeda
  • 5,746
  • 6
  • 28
  • 41
  • +1 Aargh! That was probably too easy, and that's why I overlooked it :-). (I'll probably accept as well, but I tend to wait a day, allowing other answers too, which may give additional info.) – stevenvh Jan 31 '13 at 16:48
  • @stevenvh did you perhaps forget to click the checkmark here? :-) – TylerH Feb 16 '21 at 22:33