html - Strange behavior from bootstrap with element immediately following legend

Question

So I'm using Twitter's bootstrap 3.0 and have a div immediately following a <legend> inside of a <form>.

The weird thing is that when I change the margin top of this div, it actually moves the legend up and down (with reference to the enclosing <form> tag in Chrome.

Here's a jsFiddle that demonstrates the effect: http://jsfiddle.net/aq5T7/2/

You'll notice the second item the legend is moved down 50 pixels instead of the div below it.

And in the third item the legend is moved up 50 pixels instead of the div above it.

Is there anyway to change the margin of the item immediately following the legend without having it affect the location of the legend?

Answer 1

看起来这是图例和 webkit 的一个已知问题，与引导程序无关。将此添加到您的CSS：

legend, fieldset {
    -webkit-margin-collapse: separate;
}

您可以查看此其他问题以获取更多信息。