7. Identify Your IDs Glitch


#1

Here's my code:

HTML:

<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
		<title>My Social Network</title>
	</head>
	<body>
		<div class="friend" id="best_friend">
		    <p></p>
		</div>
		<div class="family" id="archnemesis">
		    <p></p>
		</div>
		<div class="enemy">
		    <p></p>
		</div>
		
	</body>
</html>

CSS:

div {
	display: inline-block;
	margin-left: 5px;
	border-radius: 100%;
	border: solid black 2px;
	height: 100px;
	width: 100px;
}

.friend {
    border: dashed 2px #008000;
}

.family {
    border: dashed 2px #0000FF;
}

.enemy {
    border: dashed 2px #FF0000;
}

#best_friend {
    border: 4px solid #00C957;
}

#archemesis {
    border: solid 4px #CC0000;
}

I think I have everything right but for some reason it won't accept the code. Ideas?


#2

you misspelled #archemesis in css

for next time, use one of the two following options to make your code/indent is visible:

select your code and press ctrl + shift + c (or cmd + shift + c if you use a mac)

if this instructions are unclear, you can also insert 3 backticks before and after your code, like so:

```
<p>visible</p>
```

the backtick is located above the tab key on your keyboard