Tutorial search
Tutorials
Stuff
Affiliates
Photoshop Templates
Featured Photoshop templates - professional ready to use designs for your next project.
View all templates
CSS width and height properties - CSS tutorial
This property allows you to control the height and width of your elements. It also gives you an option to adjust the space between two lines.
Properties of Dimension
- height - this property sets the height of an element.
- line-height - this property specifies the distance between lines.
- max-height - this property defines the maximum height of an element.
- max-width – this property sets the maximum width of an element.
- min-height – this property specifies the minimum height of an element.
- min-width – this property defines the minimum width of an element.
- Width – this property sets the width of an element.
Command to set width:
div.box {
width: 200px;
border: 1px solid black;
background: orange;
}
width: 200px;
border: 1px solid black;
background: orange;
}
Command to set height
div.box {
height: 500px;
width: 200px;
border: 1px solid black;
background: orange;
}
height: 500px;
width: 200px;
border: 1px solid black;
background: orange;
}
Another possibility is to set the width and height in percentages of the available space within the current element:
div.box {
width: 50%;
border: 1px solid black;
background: orange;
}
width: 50%;
border: 1px solid black;
background: orange;
}