hi all i cant get past the step21 as i have done what it wants and it keeps saying sorry you should not change yhe existing div element with the class cat-right-ear when i have not even done the left ear yet.
pleas can you point me in the right direction or correct me.
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>fCC Cat Painting</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<main>
<div class="cat-head">
<div class="cat-ears">
<!-- User Editable Region -->
<div class="cat-left-ear">
<div class="cat-left-inner-ear"></div>
</div>
<!-- User Editable Region -->
</div>
</div>
</main>
</body>
</html>
/* file: styles.css */
* {
box-sizing: border-box;
}
body {
background-color: #c9d2fc;
}
.cat-head {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: linear-gradient(#5e5e5e 85%, #45454f 100%);
width: 205px;
height: 180px;
border: 1px solid #000;
border-radius: 46%;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:135.0) Gecko/20100101 Firefox/135.0
Learn Intermediate CSS by Building a Cat Painting - Step 21
Hey, compare this to what you have posted in your html and work from there, because you have one div nested in the other.
<div class="cat-left-ear">
</div>
<div class="cat-right-ear">
</div>
Your nested div looks good, but you only did it for one of the ears. For the cat one, you’re going to have to make the divs for the left and right side. Ears, whiskers, eyes, etc.
Thank you so much that worked well, great job.
may i ask you another question please
ILM
March 26, 2025, 5:17pm
6
if you need help with this step ask here
if you need help with a different step please use the help button on that step
Hi all i have tried to finish this off but it keeps saying you should have one div element inside your .cat-left-ear element can someone please correct this for me as i am confused about this now.
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>fCC Cat Painting</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<main>
<div class="cat-head">
<div class="cat-ears">
<!-- User Editable Region -->
<div class="cat-left-ear">
<div class="cat-right-ear">
<div class="cat-left-inner-ear"></div>
</div>
<!-- User Editable Region -->
</div>
</div>
</main>
</body>
</html>
/* file: styles.css */
* {
box-sizing: border-box;
}
body {
background-color: #c9d2fc;
}
.cat-head {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: linear-gradient(#5e5e5e 85%, #45454f 100%);
width: 205px;
height: 180px;
border: 1px solid #000;
border-radius: 46%;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:135.0) Gecko/20100101 Firefox/135.0
Learn Intermediate CSS by Building a Cat Painting - Step 21
Hi all this is what i keep getting when i try to finish off this step21
Sorry, your code does not pass. Keep trying.
You should not change the existing div element with the class cat-right-ear.
can someone please correct me as i am confused.
Thank you.
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>fCC Cat Painting</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<main>
<div class="cat-head">
<div class="cat-ears">
<!-- User Editable Region -->
<div class="cat-left-ear">
<div class="cat-left-inner-ear"></div>
</div>
<!-- User Editable Region -->
</div>
</div>
</main>
</body>
</html>
/* file: styles.css */
* {
box-sizing: border-box;
}
body {
background-color: #c9d2fc;
}
.cat-head {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: linear-gradient(#5e5e5e 85%, #45454f 100%);
width: 205px;
height: 180px;
border: 1px solid #000;
border-radius: 46%;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:135.0) Gecko/20100101 Firefox/135.0
Learn Intermediate CSS by Building a Cat Painting - Step 21
Hi there,
It looks like you’re not following what the lesson asked for:
Create two div elements:
One inside the .cat-left-ear element with a class of cat-left-inner-ear.
Another inside the .cat-right-ear element with a class of cat-right-inner-ear.
You’ve removed the .cat-right-ear div, which is required. Reset your code and follow the instructions carefully. Keep going—you’re doing great!
thank you but i still get the same thing.
1 Like
ILM
March 27, 2025, 12:29pm
11
what is your most recent code?
Hi all
sorry i am new to this but i am still getting it wrong on step 21 i am trying hard but everthing i do it just says the same thing and i keep going around and around.
Sorry, your code does not pass. Try again.
You should have one div element inside your .cat-left-ear element
can someone pleas correct me on this step so i can move on to the next one. thank you very much.
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>fCC Cat Painting</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<main>
<div class="cat-head">
<div class="cat-ears">
<!-- User Editable Region -->
<div class="cat-left-ear">
<div class="cat-left-inner-ear"></div>
<div class="cat-right-ear">
<div class="cat-right-inner-ear"></div>
</div>
<!-- User Editable Region -->
</div>
</div>
</main>
</body>
</html>
/* file: styles.css */
* {
box-sizing: border-box;
}
body {
background-color: #c9d2fc;
}
.cat-head {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: linear-gradient(#5e5e5e 85%, #45454f 100%);
width: 205px;
height: 180px;
border: 1px solid #000;
border-radius: 46%;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:135.0) Gecko/20100101 Firefox/135.0
Learn Intermediate CSS by Building a Cat Painting - Step 21
HI ILM
<div class="cat-right-ear">
<div class="cat-right-inner-ear"></div>
</div>
Your .cat-right-ear div has a closing tag, but your .cat-left-ear div is missing its closing tag.
this needs to be added “cat-left-ear” div
you are also missing cat-right-inner-ear div within "cat-right-ear"div
address these changes and it should be alright, happy coding
ILM
March 27, 2025, 1:01pm
17
I have merged your 4 topics on this step 21, please do not open multiple topics for the same step
You are not interpreting the instructions correctly. Is this clearer?
Now create two div elements with a class of cat-left-inner-ear inside the .cat-left-ear element. Create two more div elements with a class of cat-right-inner-ear inside the .cat-right-ear element.
