How to Draw a Rectangle in HTML


If, for whatever reason, you sometimes feel like creating a rectangle using html/css, the below code is the easiest way to do so. A given rectangle can also be decorated using tags like background-color.

Here’s the code:

<div style="width:500px;height:100px;border:1px solid #000;">This is a rectangle!</div>

And here’s the result:

This is a rectangle!

There you go: no fuss, no muss.

Learn HTML5 Online

Get all SitePoint books and courses with a Learnable membership. Start building future-proof websites that are faster, more powerful, and easier to maintain.

No Reader comments