Create a More Complex Shape Using CSS and HTML-I keep on getting two out of four helpp plz

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**


<style>
.heart {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: pink;
  height: 50px;
  width: 50px;
  transform: ;
}
.heart::after {
  background-color: pink;
  content: "";
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0px;
  left: 25px;
}
.heart::before {
  content: ;
  background-color: pink;
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: -25px;
  left: 0px;
}
</style>
<div class="heart"></div>

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36

Challenge: Create a More Complex Shape Using CSS and HTML

Link to the challenge:

2

The two failing tests say:

The transform property for the heart class should use a rotate() function set to -45 degrees.

The content of the heart::before selector should be an empty string.

When I look at your code,

.heart {
  // ...
  transform: ;
}

and

.heart::before {
  content: ;
  // ..
}

I see that those are indeed not set. It explains what is needed in the description. Please reread the description and make the appropriate changes. Please let us know if you are still stuck.

3

Oh! Thank you very much Kevin. This solves it! :grinning: :grinning:

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.