You have seen the border that surrounds every box element, the padding that can appear inside each box and the margin that can go around them. In this tutorial we will how we can change the dimensions of boxes.
- Height property is used to set the height of a box.
- Width property is used to set the width of a box.
- Line-height property is used to set the height of a line of text.
- Max-height property is used to set a maximum height that a box can be.
- Min-height property is used to set the minimum height that a box can be.
- Max-width property is used to set the maximum width that a box can be.
- Min-width property is used to set the minimum width that a box can be.
The height and width properties allow you to set the height and width for boxes.
<p style=”width:400px; height:100px;border:1px solid green; padding:5px; margin:10px;”>This is dimension</p>
This is dimension
The line-height property allows you to increase the space between lines of text.
<p style=”width:400px; height:100px;border:1px solid green; padding:5px; margin:10px;”>This is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimension</p>
This is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimension
The max-height property allows you to specify maximum height of a box.
<p style=”width:400px; height:100px;border:1px solid green; padding:5px; margin:10px;”></p>
This is dimension
The min-height property allows you to specify minimum height of a box.
<p style=”width100; height400;border:1px solid green; padding:5px; margin:10px;”></p>
This is dimension
The max-width property allows you to specify maximum width of a box.
<p style=”width:400px; height:100px;border:1px solid green; padding:5px; margin:10px;”></p>
This is dimension
The min-width property allows you to specify minmum width of a box.
<p style=”width:400px; height:100px;border:1px solid green; padding:5px; margin:10px;”></p>
This is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimensionThis is dimension