Web Page Padding and Margins

We have already seen how we can apply padding and margins to individual HTML elements using CSS. But we can also apply these properties to the web page body as a whole.

By default various web browsers apply different amounts of padding and margin to the web pages we visit. However we can easily over-ride these settings by setting our own values:

body {
	margin: 0;
	padding: 0;
	border: none;

This will clear all default styling from our web pages but feel free to set the values to whatever you want.

Although it is not strictly necessary to set our page properties like this, it is a good habit to get into. If we do not set these properties ourselves then our HTML will display slightly differently in different web browsers due to the default values they use. In the majority of cases these differences will not make any noticeable difference to the layout of our page, but very occasionally circumstances might conspire to shift elements completely out of place.