<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <style> .fuqing{ border: 1px solid red; overflow: hidden; } .erzi{ border: 1px solid blue; height: 100px; float: left; } / * 1, no floating occurs: without any change, the width of the inheritance of his father * / / * 2, father and son floating occurs: stream from the document, without his father width, narrow, softened by the width of the floating {div a float: left; } * / / * . 3, the parent does not float float, occur: Chapter case with * / / * 4, the parent does not float floating occurs: collapsed, the parent does not change, the child becomes small, the solution , a father set overflow: hidden; * / </ style > < body > < div class = "Fuqing" > < div class = "Erzi" > </ div > </ div > </ body > </ HTML >