Tell us what’s happening:
When running test on codepen.io the 12th test that needs the submit button to submit to a static page fails. I have checked all over to see if the way I am submitting my code is wrong but I couldn’t find anything. Could this be at the fault of codepen since when I open the console in my browser I get this error only when I try to submit in codepen:
" Refused to frame because an ancestor violates the following Content Security Policy directive: “frame-ancestors ‘self’”.
Your code so far
<!DOCTYPE html>
<html>
<head>
<title>Pro2 Technologies</title>
<link type="text/css" rel="stylesheet" href="landPage.css">
</head>
<body>
<header id="header">
<div class="logo">
<img id="header-img" src="imgs/pro2Re.png" alt="Logo of the company">
</div>
<nav id="nav-bar">
<ul>
<li>
<a class="nav-link" href="#features">Features</a>
</li>
<li>
<a class="nav-link" href="#video">How It Works</a>
</li>
<li>
<a class="nav-link" href="#buy">Pricing</a>
</li>
</ul>
</nav>
</header>
<div class="container">
<section id="hero">
<h2 id="techLike">Tech like you've never seen</h2>
<form id="form" action="https://www.freecodecamp.com/email-submit" method="post">
<input type="email" id="email" placeholder="Enter your email address" required>
<input type="submit" id="submit" value="Get Started">
</form>
</section>
<section id="features">
<div class="shop_description">
<div>
<img class="image" src="imgs/laptop.png" alt="vector image of a laptop">
</div>
<div class="desc">
<h2>Premium Products</h2>
<p>
We here at Pro2 only stock up on the finest products to satisfy our customers. From the high-end to low end we got it all!
</p>
</div>
</div>
<div class="shop_description">
<div>
<img class="image" src="imgs/truck.png" alt="vector image of a truck">
</div>
<div class="desc">
<h2>Fast Delivery</h2>
<p>
Your time is valuable, we know that. That is why we make sure you receive your delievery as soon as it is made.
</p>
</div>
</div>
<div class="shop_description">
<div>
<img class="image" src="imgs/user.png" alt="vector image of a person">
</div>
<div class="desc">
<h2>Reliable Service</h2>
<p>
You can always count on our staff for any assistance what so ever, we are happy to help. There is no question we can't handle.
</p>
</div>
</div>
</section>
<section id="vid">
<iframe src="https://www.youtube.com/embed/dQw4w9WgXcQ" width="560" height="315" id="video">
</iframe>
</section>
<section id="buy">
<div class="products">
<div class="product_header">Laptops</div>
<p class="starting">Starting at</p>
<h2 class="pricing">$600</h2>
<ul class="product_list">
<li>Premium Quality Laptops</li>
<li>5 Years Garanteed Use</li>
<li>Custom App Installs On Demand</li>
<li>Comes With Free Mousepad</li>
</ul>
<input type="submit" class="select_btn" value="More Info">
</div>
<div class="products">
<div class="product_header">Desktops</div>
<p class="starting">Starting at</p>
<h2 class="pricing">$900</h2>
<ul class="product_list">
<li>High End Professional PCs</li>
<li>Great For Heavy Duty Tasks</li>
<li>Custom Builds</li>
<li>Comes With Free Mouse</li>
</ul>
<input type="submit" class="select_btn" value="More Info">
</div>
<div class="products">
<div class="product_header">Tech Maintanence</div>
<p class="starting">Starting at</p>
<h2 class="pricing">$20</h2>
<ul class="product_list">
<li>No Problem We Can't Solve</li>
<li>Over 20 Years Of Experience</li>
<li>Maximum Of 1 Week</li>
<li>Tech As Good As New</li>
</ul>
<input type="submit" class="select_btn" value="More Info">
</div>
</section>
<footer id="footer">
<ul>
<li>
<a class="nav-link" href="#">Privacy</a>
</li>
<li>
<a class="nav-link" href="#">Terms</a>
</li>
<li>
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
<div id="copyright">
<p>© Copyright 2016, Pro 2 Technologies</p>
</div>
</footer>
</div>
</body>
</html>
Your browser information:
User Agent is: Mozilla/5.0 (X11; Linux x86_64; rv:78.0) Gecko/20100101 Firefox/78.0
.
Challenge: Build a Product Landing Page
Link to the challenge: