Introduction:

In this article we will to learn what is css width property or how to use css width property or css width property with example.

 

Description:

The CSS width property is used to specify width of the content area of a html element.

 

CSS width values

There are many width values that can be used to set the width of the content area of an element.

 

auto: It is a default value. it is used to calculate the width.

length: It is used to define the width in px, cm etc.

%: It defines the width of the containing block in %.

Initial: It is used to set the property to its default value.

Inherit: It is used to inherit the property from its parent element.

 

Example of CSS width property:

<!DOCTYPE html>
<html>
<head>
    <title>Example of CSS width property</title>
    <style> 
        div.ex {
            width: 300px;
            background-color:aqua;
        }
        p.ex {
            height: 150px;
            width: 150px;
            background-color:blue;
        }
    </style>
</head>
<body>    
    <p class="ex">The height and width of this paragraph is 150px.</p>
    <div class="ex">This is a div container.</div>
</body>
</html> 


 

 Let's check live example

Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

You may also like