I need to put some padding areas on my page. I use these areas, adjust the z-index and have them appear above or below other areas. I have set up the CSS and then I make them appear on the page as follows:
<div id="pd1"></div>
<div id="pd2"></div>
<div id="pd3"></div>
<div id="pd4"></div>
<div id="pd5"></div>
But is this the best way to do it? Are there any shortcut ways to make square areas of varying sizes appear on the page?
For more complicated shapes, you can also use:
1. SVG
2. HTML5 Canvas
If it’s just RECT/SQUARE/CIRCLE – you can stick with DIV element.