CSS dimension is used to set dimension of boxes on web pages.
CSS dimension make elements to change the dimensions of surrounds by box.
You can set following properties of a box dimensions:
height : This property is used to set the height of a box.
width : This property is used to set the width of a box.
line-height : This property is used to set the height of a line of text.
max-height : This property is used to set a maximum height that a box can be.
min-height : This property is used to set the minimum height that a box can be.
max-width : This property is used to set the maximum width that a box can be.
min-width : This property is used to set the minimum width that a box can be.
Example : Dimension
<html>
<head>
</head>
<body>
<p style = "width:400px; height:80px; border:1px solid blue;
padding:5px; margin:10px;">
1-- CSS stands for Cascading Style Sheets
</p>
<p style = "width:400px; height:100px; border:1px solid blue;
padding:5px; margin:10px; line-height:50px;">
2-- CSS stands for Cascading Style Sheets
</p>
<p style = "width:400px; max-height:80px; border:1px solid blue;
padding:5px; margin:10px;">
3-- CSS stands for Cascading Style Sheets
</p>
<p style = "width:400px; min-height:80px; border:1px solid blue;
padding:5px; margin:10px;">
4-- CSS stands for Cascading Style Sheets
</p>
<p style = "max-width:100px; height:200px; border:1px solid blue;
padding:5px; margin:10px;">
CSS stands for Cascading Style Sheets
</p>
<p style = "min-width:400px; height:100px; border:1px solid blue;
padding:5px; margin:10px;">
5-- CSS stands for Cascading Style Sheets
</p>
</body>
</html>
When the above code is compiled , it produces the following result.