Hypertext markup language (HTML) padding is a setting a designer can use to specify the distance between content and the border of the element that contains it. This differs from the margin, which is the space between different elements. This property can be set in HTML or cascading style sheets (CSS) to affect the look and feel of a design. Some HTML padding may be aesthetically necessary to get something to look right, or it could be critical to the function of content, which might not be readable without appropriate margins.
Designers can specify the amount of padding in em, percentage, pixels, or points, depending on their preference and the nature of the project. When deciding which units to use, it is advisable to be consistent throughout the design to ensure that all the elements will work well together. If HTML padding is measured in pixels in one place, for example, it should be measured in pixels everywhere else as well.
In all cases, HTML padding tells the web browser to create blank space between the edges of the content and the border of the containing element. In a table, for example, people usually do not want text to run up right against the edge of a field, because this can make the table hard to read. They add padding to create white space around the content and make the arrangement of fields easier to see.
Designers can specify HTML padding for the top, bottom, and sides to tightly control the appearance of content inside containers. Additional margins can also be added between containers, if this is desired. On a blog, for instance, the author might want to create a sidebar that goes alongside the main content. Margins and borders can clearly differentiate it from the content in the blog posts. Padding can ensure that the content of the sidebar doesn’t run up against the border, which might not look very attractive.
Operating system, browser version, and monitor can all affect the way content displays on the web. Designers need to think about this when they develop web pages to ensure that the content will be readable for most web users, in order to reach the largest possible audience. Another issue to consider is what may happen if the user increases or decreases the text size. Properties like HTML padding can prevent overruns of text and other issues that might make it difficult for users to adjust font size for their vision or a mobile device.