Tell us what’s happening:
Please can some help me solve this is keeps saying its wrong but i can’t see the problem
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Selection Feature Page</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1>Feature Selection</h1>
<div class="feature-card-container">
<label class="feature-card" for="in1">Notifications & Communication<input type="checkbox" id="in1" name="1" /></label>
<label class="feature-card" for="in2">General Functionality<input type="checkbox" id="in2" name="2" /></label>
<label class="feature-card" for="in3">User Account Features<input type="checkbox" id="in3" name="3" /></label>
</div>
</body>
</html>
/* file: styles.css */
h1 {
text-align: center;
}
.feature-card {
max-width: 300px;
margin: 0 auto;
}
.feature-card {
font-size: 20px;
display: block;
text-align: center;
padding: 15px;
border: 2px solid rgba(0, 0, 0, 0.2);
box-shadow: 0 2px 6px rgba(135, 206, 235, 0.2);
}
input[type="checkbox"] {
appearance: none;
width: 18px;
height: 18px;
color: white;
border: 2px solid goldenrod;
border-radius: 2px;
background-color: white;
transition: all 0.3s;
vertical-align: middle;
}
input[type="checkbox"]:checked {
background-color: goldenrod;
border-color: orange;
}
input[type="checkbox"]:checked::after {
content: "✓";
display: block;
text-align: center;
font-weight: bold;
color: whitesmoke;
line-height: 15px;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/147.0.0.0 Safari/537.36
Challenge Information:
Design a Feature Selection Page - Design a Feature Selection Page