When using DIV containers in the design of your Web page, you may feel the need to specify the height, width, and positioning of the individual containers relative to the browser window and to each other. However, when doing so, you may find that your DIV containers overlap with one another and cause your visual layout to break. Fortunately, you can solve this problem by using the HTML display style element.
- Skill level:
- Moderately Easy
Other People Are Reading
Open the Web page with the overlapping DIV containers in your preferred text editor.
Move your cursor to the tag of the first DIV container whose display properties you wish to adjust.
Insert the following code into the tag of the DIV container:
Repeat Step 3 with each subsequent DIV container that is overlapping another.
Save and publish your web page. The DIV containers you have adjusted will now stretch to fill the available horizontal space, adjust their vertical heights to accommodate all of the content within them, and not overlap one another.
- 20 of the funniest online reviews ever
- 14 Biggest lies people tell in online dating sites
- Hilarious things Google thinks you're trying to search for