2018-09-30 22:01:58 +00:00
---
id: 587d7791367417b2b2512ab5
title: Adjust the Height of an Element Using the height Property
challengeType: 0
videoUrl: 'https://scrimba.com/c/cEDaDTN'
---
## Description
< section id = 'description' >
You can specify the height of an element using the < code > height< / code > property in CSS, similar to the < code > width< / code > property. Here's an example that changes the height of an image to 20px:
2019-05-14 08:11:58 +00:00
```css
img {
height: 20px;
}
```
2018-09-30 22:01:58 +00:00
< / section >
## Instructions
< section id = 'instructions' >
Add a < code > height< / code > property to the < code > h4< / code > tag and set it to 25px.
< / section >
## Tests
< section id = 'tests' >
```yml
2018-10-04 13:37:37 +00:00
tests:
- text: Your code should change the < code > h4</ code > < code > height</ code > property to a value of 25 pixels.
2019-03-04 18:33:02 +00:00
testString: assert($('h4').css('height') === '25px' && /h4{\S*height:25px(;\S*}|})/.test($('style').text().replace(/\s/g ,'')));
2018-09-30 22:01:58 +00:00
```
< / section >
## Challenge Seed
< section id = 'challengeSeed' >
< div id = 'html-seed' >
```html
< style >
h4 {
text-align: center;
2018-10-08 00:01:53 +00:00
2018-09-30 22:01:58 +00:00
}
p {
text-align: justify;
}
.links {
margin-right: 20px;
text-align: left;
}
.fullCard {
width: 245px;
border: 1px solid #ccc ;
border-radius: 5px;
margin: 10px 5px;
padding: 4px;
}
.cardContent {
padding: 10px;
}
< / style >
< div class = "fullCard" >
< div class = "cardContent" >
< div class = "cardText" >
< h4 > Google< / h4 >
< p > Google was founded by Larry Page and Sergey Brin while they were Ph.D. students at Stanford University.< / p >
< / div >
< div class = "cardLinks" >
< a href = "https://en.wikipedia.org/wiki/Larry_Page" target = "_blank" class = "links" > Larry Page< / a >
< a href = "https://en.wikipedia.org/wiki/Sergey_Brin" target = "_blank" class = "links" > Sergey Brin< / a >
< / div >
< / div >
< / div >
```
< / div >
< / section >
## Solution
< section id = 'solution' >
2019-03-04 18:33:02 +00:00
```html
< style >
h4 {
text-align: center;
height: 25px;
}
p {
text-align: justify;
}
.links {
margin-right: 20px;
text-align: left;
}
.fullCard {
width: 245px;
border: 1px solid #ccc ;
border-radius: 5px;
margin: 10px 5px;
padding: 4px;
}
.cardContent {
padding: 10px;
}
< / style >
< div class = "fullCard" >
< div class = "cardContent" >
< div class = "cardText" >
< h4 > Google< / h4 >
< p > Google was founded by Larry Page and Sergey Brin while they were Ph.D. students at Stanford University.< / p >
< / div >
< div class = "cardLinks" >
< a href = "https://en.wikipedia.org/wiki/Larry_Page" target = "_blank" class = "links" > Larry Page< / a >
< a href = "https://en.wikipedia.org/wiki/Sergey_Brin" target = "_blank" class = "links" > Sergey Brin< / a >
< / div >
< / div >
< / div >
2018-09-30 22:01:58 +00:00
```
2019-07-18 15:24:12 +00:00
2018-09-30 22:01:58 +00:00
< / section >