Build a Confidential Email Page - Build a Confidential Email Page

HTML-CSS
1

Tell us what’s happening:

so many errors i cant figure out. The width 500px and i have done everything but its still not working

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Confidential Email</title>
  <link rel="stylesheet" href="styles/css">

</head>

<body>
  <main id="email">
    <p><span class="blurred">A note is a brief record or reminder of something, whether a short message to someone else or personal information to help you remember.</span> They can be written or digital and are used for various purposes, such as capturing ideas, documenting information from lectures, taking meeting minutes, or creating lists. Popular digital platforms for note-taking include Apple Notes, Microsoft OneNote, Google Keep, Evernote</p>
    <p>A note is a brief record or reminder of something, whether a short message to someone else or personal information to help you remember. They can be written or digital and are used for various purposes, such as capturing ideas, documenting information from lectures, taking meeting <span class="blurred">minutes, or creating lists. Popular digital platforms for note-taking</span>include Apple Notes, Microsoft OneNote, Google Keep, Evernote, and</p>
    <p>A note is a brief record or reminder of something, whether a short message to someone else or personal information to help you remember. They can be written or <span class="blurred">digital and are used for various purposes, such as capturing ideas, documenting information from lectures, taking meeting minutes, or creating lists.</span> Popular digital platforms for note-taking include Apple Notes, Microsoft OneNote, Google Keep, Evernote, and</p>
    <div id="confidential">CONFIDENTIAL</div>
    <div id="top-scret">TOP-SECRET</div>
  </main>

</body>

</html>

/* file: styles.css */
#email{
  padding: 50px;
  margin-top: 50px;
  width: 500px;
  border: 2px;
  box-sizing: border-box;
}
#confidential{
  display: inline-block;
  margin-left: 20px;
  border: 5px;
  transform: rotate(0.5deg);
}
#top-secret{
  display: inline-block;
  margin-left: 20px;
  border: 5px;
  transform: rotate(0.5deg);
}
.blurred{
  filter: blur(3px);
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Challenge Information:

Build a Confidential Email Page - Build a Confidential Email Page
https://www.freecodecamp.org/learn/full-stack-developer/lab-confidential-email-page/build-a-confidential-email-page

2

Hi @juliusaduko81

Check the link element points to the correct file.

Happy coding