In web design, we sometimes inadvertently create a browser compatibility problem. Causes the content of each browser to be disordered or not the result we want. Of course, one of the most problematic is IE6.
Method One:
Using a blank div to serve as the margin value between the target Div, margin does bring us a lot of convenience, but there are also many problems, not only IE6 double margin compatibility problem, there are other child elements kidnapped parent element problem. At this point, we can use the new content as a space div, to achieve the effect of margin. You only need to set the width or height of the div. Float-left of the time. Float the new div setting width together. Margin-top can also use this method. But I prefer to set the padding-top value of the div.
Method Two:
We can also use positioning to solve the compatibility problem of float after the margin. However, this method requires us to have a more profound understanding of the location of the use. The first position can be divided into relative positioning and absolute positioning, want absolute positioning accurate, preferably to his parent element to add positioning. If it is not easy to change the state of the parent element or the parent element uses Margin:auto to center horizontally, then add a relative positioning to the parent element (without writing top and left values). We'll be able to put the target Div in any position we want.
2 ways to avoid IE6 using float after using margin compatibility