Height: 100% not working?

Asked Dec 27 '17 at 13:49

Active Dec 27 '17 at 14:29

Viewed 71 times

I can't get the height: 100% to work with my code! The parent div is 100% (I think) so shouldn't the div be stretched a ton?

P.S I know it will ugly, I just want to get it to work for now.

.featuredCourse {
  width: 35%;
  height: 100%;
  margin: 0 auto;
  background-color: white;
  -webkit-box-shadow: 0px 0px 13px 1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 13px 1px rgba(0, 0, 0, 0.75);
  box-shadow: 0px 0px 13px 1px rgba(0, 0, 0, 0.75);
}

<div class="courses">
  <div class="featuredCourse">
    <img src="images/featuredcourse.jpg" alt="featuredcourse">
    <h1 class="featuredCourseTitle">JavaScript in 4 weeks</h1>
    <p class="featuredCourseDesc">Learn the most popular web programming language in a months time</p>
  </div>
</div>

edited Dec 27 '17 at 14:29

Temani Afif

245,468
26
309
415

asked Dec 27 '17 at 13:49

user8098132

1

In your code example, the parent div is `height: auto`. You haven't set it to `100%` – Quentin Dec 27 '17 at 13:50
Does the parent element (`.courses`) have a fixed height? Or what should your child be `100%` of? The window? – Niklas Higi Dec 27 '17 at 13:53

Height: 100% not working?

0 Answers0