Home >Web Front-end >CSS Tutorial >How to make a div float over another div with css
How to make a div float on another div: 1. Add the "position:absolute" absolute positioning style to the two div elements; 2. Add "{top: distance from the top of the page" to one of the div elements. ;left: Distance from the left side of the page;}" style to float it on another div element.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
How to use css to suspend a div on another div
1. Create a new html file named test.html for Explain how to use css div to make a div float on another layer of div. In the test.html file, create two divs, called "First Layer" and "Second Layer". Set the class attributes for the two divs, "aa" and "bb" respectively, which are mainly used to set the CSS styles of the two divs below.
2. In the css tag of the test.html file, use css to initialize the inner and outer margins of all elements on the page and set them to 0. Within the css tag, set the style of the div with the class name aa. Set its width to 200px, height to 200px, position attribute to absolute positioning, and background color to red.
In the css tag, set the style of the div with the class name bb. Set its width to 200px, height to 200px, position attribute to absolute positioning, distance to the left edge of the page to 50px, distance to the top edge of the page to 50px, and background color to yellow.
3. Open the test.html page in the browser and check the effect of letting the div float on another layer of div.
For more programming related knowledge, please visit: Programming Video! !
The above is the detailed content of How to make a div float over another div with css. For more information, please follow other related articles on the PHP Chinese website!