CSS CSS Selectors Selectors - Beyond the Basics Attribute Selectors Challenge

Tim Abbott
Tim Abbott
14,206 Points

CSS Selectors - Challenge Task 1 of 3 - Why is my code wrong?

Create an attribute selector that targets img elements with a title attribute value of "avatar". Give the elements a border radius of 50%.

img [title = "avatar"] { border-radius: 50%; }

The prompt tells me the error is with the border-radius declaration. I don't see the error?

style.css
/* Complete the challenge by writing CSS below */

img [title="avatar"]{
    border-radius: 50%;
}
index.html
<!DOCTYPE html>
<html>
<head>
    <title>Selectors</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href='http://fonts.googleapis.com/css?family=Nunito:400,300' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" href="base.css">
  <link rel="stylesheet" href="style.css">
</head>
<body>
    <div id="container">
        <form class="form-contact">
        <img src="avatar.png" title="avatar" alt="">

          <label for="un">Username:</label> 
          <input type="text" id="un">

        <label for="pw">Password:</label>
        <input type="password" id="pw">

          <input type="submit" value="Sign up">
        </form>
    </div>
</body>
</html>

1 Answer

yahav rosner
yahav rosner
4,304 Points

Hi Tim!, you are pretty close. The spacing should be removed like this. img[title="avatar"] { border-radius: 50%; }

Tim Abbott
Tim Abbott
14,206 Points

Thank you. I now need to update my notes. I hadn't picked this up!