curriculum/challenges/english/blocks/learn-intermediate-css-by-building-a-cat-painting/646ce8bb4b35544d501c7184.md
Inside your .cat-ears element, create two div elements with the classes cat-left-ear and cat-right-ear respectively.
You should not change the existing div element with the class cat-ears.
assert(document.querySelectorAll('div.cat-ears').length === 1);
You should create two div elements inside your .cat-ears element.
assert(document.querySelectorAll('.cat-ears div').length === 2);
Your first div element should have the class cat-left-ear.
assert(document.querySelectorAll('.cat-ears div')[0]?.classList.contains('cat-left-ear'));
Your second div element should have the class cat-right-ear.
assert(document.querySelectorAll('.cat-ears div')[1]?.classList.contains('cat-right-ear'));
<!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">
--fcc-editable-region--
<div class="cat-ears">
</div>
--fcc-editable-region--
</div>
</main>
</body>
</html>
* {
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%;
}