FOLLOW US ON TWITTER



FOLLOW US



img/blogimg/css3.jpg


@coder 904

What is CSS3 Height Property?


2021-11-16 14:03 · 3 min read

CSS3 Height property is used to specify the height of an HTML element. The height of the HTML elements does not include border, margin, padding, etc. So, by default, the CSS3 Height property defines the height of the content area.

 

Height Property

We can change the Height of an HTML Element by using the CSS width property.
We normally use px, vh, and % unit for height property.

 

Example

{height  :  10px;}           

property  value 
 

SYNTAX

  • width: auto | value | initial | inherit;

Note:

  • If you are designing a relative layout then you can use height % and height px unit.
     
  • If you are designing a responsive layout, please don't use height property, because this can create a problem in layout designing.
     
  • The max-width and min-hight properties override the CSS height property.
<!DOCTYPE html>
<html>
<head>
<style>
.tdb-height{
width:200px;
height:300px;
background-color:black;
color:white;
padding:10px;}
</style>
</head>
<body>
<p class="tdb-height">css height property</p>
</body>
</html>

 

Property: values

If you are working on a responsive layout then set the default value of height.

  • length: We can define the height in px, %, cm, etc.
  • vh: Defines the viewport height of the containing block
  • %: Defines the height in percent of the containing block
  • Auto: Default value of height property
  • Initial: Sets this property to its default value.
  • Inherit: Child element inherits height property from its parent element.


 

TAGS:






POST COMMENTS
No Comment

Please login to post comment




POPULAR POSTS

best free web hosting services...
what is new in miui 11?...
free website ssl security using cloudfla...
do you want to make money online?...
CSS3 @IMPORT RULES...
What is HTML Anchor Tag and Hyperlinks?...
CSS3 RESPONSIVE UI...
How to host a web page in 10 minutes....
Tables HTML...
CSS3 FUNCTIONS...
How to use CSS3 Overflow Property?...
CSS3 FILTERS...


RECENT COMMENTS

2022-03-05 11:05
By coder on XAMPP - MySQL shutdown unexpectedly | How to fix MySQL crash unexpectedly
2021-10-12 12:34
By abnongoke on do you want to make money online?
2021-10-12 12:34
By abnongoke on how to get a free website domain name?
2021-10-12 12:34
By solar panel for shed on what is new in miui 11?
2021-10-12 12:34
By solar panel for shed on best free web hosting services
2021-10-12 12:34
By amos tanui on free website ssl security using cloudflare


SOCIAL SHARE



FOLLOW US ON TWITTER



FOLLOW US ON FACEBOOK



FOLLOW US







Recent Blogs



Contact Us

Subscribe Our News-Letter



Kashipur, 244713
Uttarakhand, India



© blog.theprodevelopers.com 2024. All Rights Reserved. Powered by Pro Developer