CSS Dimensions

Using CSS, we can define dimensions (width and height) to an element. The following CSS properties are used to define dimensions of an element:

  • height - defines the height of an element
  • max-height - defines the maximum height of an element
  • min-height - defines the minimum height of an element
  • width - defines the width of an element
  • max-width - defines the maximum width of an element
  • min-width - defines the minimum width of an element

For example:

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      div{background-color: chocolate; color: white; padding: 10px;
         margin: 10px 0;}
      div.a{width: 220px; height: 100px;}
      div.b{min-width: 220px; min-height: 120px;}
   </style>
</head>
<body>
   
   <div class="a">CODESCRACKER</div>
   <div class="b">CODESCRACKER</div>
   
</body>
</html>
Output
CODESCRACKER
CODESCRACKER

CSS Online Test


« Previous Tutorial Next Tutorial »