CSS---Solutions for internal div settings Margin-top not working

About the inner div setting margin-top does not work solution

The code is as follows:

<div> Upper Layer </div>

<div> <!--parent Layer--
<div style= "margin-top:200px;" > Sub-layer </div>
</div>

The ideal effect is the parent layer and the upper layer of the welt display, the child layer is 200px away from the top of the parent layer, normal in IE, but there is a problem in the FF, the child layer and the parent layer is facing, but the parent layer and the upper layer are spaced 200px.

Think of the solution, to help Google, get the following sentence:

When two containers are nested, if there is no other element between the outer container and the inner container, Firefox will margin-top the inner element with the parent element.

That is, because the child layer is the first non-empty element of the parent layer, this error occurs when you use Margin-top.

There are two ways to solve this problem:

1, using floating to solve, will be the sub-layer code to: <div style= "Margin-top:200px;float:left";> sub-layer </div>

2, use Padding-top to solve, namely:

<div style= "padding-top:200px;" >
<div> Sub-layer </div>
</div>

CSS---Solutions for internal div settings Margin-top not working