CSS Width

CSS width property is used to set width of the content area of an element.

  • The width of an element does not include padding, borders, margins.
  • It sets the width of the area inside the padding, border, and margin of the element.
  • The min-width and max-width properties override width.

Width Syntax

width: value;

CSS Width: Parameters

  • length: Defines the width value in pixels, em, cm, etc.
  • percentage: Defines the width value in percentage.
  • auto: The browser will calculate the width for the element, by default.
  • inherit: Element will inherit the width from its parent element.

Example of width:50%

.div_1 {
     background-color: green;
     width: 50%;
     padding: 10px;
  }

Output

Width: 50%

Hello! This is a paragraph inside the div; The width of div is 50%, and padding of this div is 10px with green background-color property.

Example with Height & Width

.div_1 {
     background-color: 1d6792;
     width: 50%;
     height: 150px;
     color: #fff;
     padding: 10px;
  }

Output

The width: 50% | height: 200px

Hello! This is a paragraph inside a div; The width is 50% & height 200px, padding 10px, and color value is #fff with background-color:#1d6792 property.

Policy

GDATAMART.COM is optimized for learning & job information; The users try to improve your knowledge and practical experience through this site but we cannot warrant full correctness of all content... Learn More → | Sitemap →

© 2020 GDATAMART | All Rights Reserved