The margin-top of a child element acts on the outer parent element resolution method:
Sometimes, when setting the Margin-top property of a child element, it is intended to be used for the parent element, but the result is that the parent element has a margin-top effect, and the following is an example of how to resolve the problem through a code instance.
The code example is as follows:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.softwhy.com/" /><title>Ant Tribe</title><styletype= "Text/css">#box{width:200px;Height:200px;background:Red;Overflow:Hidden;}#main{width:50px;Height:50px;background:Blue;Margin-top:50px;}</style><Body><DivID= "box"> <DivID= "Main"></Div> </Div></Body></HTML>
The above code to achieve our requirements, in fact, this is a typical margin merge problem, add Overflow:hidden can eliminate this phenomenon, here is not more introduced, specifically, you can refer to margin of the merger of a detailed chapter.
The original address is: http://www.softwhy.com/forum.php?mod=viewthread&tid=12696
For more information, refer to: http://www.softwhy.com/divcss/
Margin-top of child elements acting on the outer parent element resolution method
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
