Build a Confidential Email Page - Build a Confidential Email Page

HTML-CSS
1

Tell us what’s happening:

There’s no preview or the like and it wont pass the border requirements for 15 and 16. Is there a bug here?

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">
<div id="confidential"></div>
<div id="top-secret"></div>
<p>1<span class="blurred">2</span></p>
<p>1<span class="blurred">2</span></p>
<p>1<span class="blurred">2</span></p>
  </main>
</body>

</html>
 

/* file: styles.css */
#email{
  padding: 50px;
  margin-top: 50px;
  width: 500px;
  border: 2px;
  box-sizing: border-box;
}
#confidential{
  display: inline-block;
  padding: 50px;
  margin-left: 50px;
    border: 2px;
  transform: rotate(45deg);
}
#top-secret{
  display: inline-block;
  padding: 50px;
  margin-left: 50px;
  border: 2px   ;
  transform: rotate(45deg);
  
}
.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/134.0.0.0 Safari/537.36

Challenge Information:

Build a Confidential Email Page - Build a Confidential Email Page

2

Hello @robheyays,
It seems your code is missing its border style.

3

what do you mean that there is no preview?

4

It is just showing the numbers and blurred part maybe that’s it?

5

I do not understand what that mean either

6

There is nothing on the preview except this with the two blurred.

12

12

12

7

so there is a preview?

there is only 12 because that is what is in your html

8

Yes, but this seems unusual to write this code and the end result is three numbers etc…
They all pass except 15 and 16.

9

if that’s what you want to write for the email…

the border property needs three values, you may want to review about it

1 Like
10

Ok, I’ll check that part.