Tell us what’s happening:
hallo, i am doing last test of html.
but I can not find only one correct answer.
Message was
Your #profile-link
element should have a target
attribute of _blank
.
please inform me what is wrong?
Your code so far
<!-- file: index.html -->
<!DOCTZPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=devidce-width initial-scale="1.0>
<title>Personal Portfolo</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main>
<nav id="navbar" >
<div class="background-nav">
<a href="#welcome-section">About</a>
<a href="#projects">Work</a>
<a href="#profile-link">Contact</a></nav>
</nav>
<section id="welcome-section">
<div class="welcome">
<h1>Hey I am Mimic</h1>
<p>a web developer</p>
</div>
</section>
<section id="projects">
<h1>These are some of my projects</h1>
<div class="project-tile">
<a id="profile-link" href="https://codepen.io/freeCodeCamp/full/zNqgVx"><img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/tribute.jpg" >
<figure>Tribute Page</figure></a>
<a id="profile-link" href="https://codepen.io/freeCodeCamp/full/qRZeGZ"><img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/random-quote-machine.png">
<figure>fire</figure></a>
<a id="profile-link" href="https://codepen.io/freeCodeCamp/full/wgGVVX"> <img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/calc.png"> <figure>Dragon</figure></a>
<a href="https://codepen.io/freeCodeCamp/full/wgGVVX"><img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/map.jpg"> <figure>Mao</figure></a>
<a id="profile-link" href="https://cdn.freecodecamp.org/testable-projects-fcc/images/map.jpg"> <img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/wiki.png"> <figure>Avril</figure></a>
<a id="profile-link" href="https://codepen.io/freeCodeCamp/full/KzXQgy"><img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/tic-tac-toe.png"> <figure>Lavin</figure></a>
</div>
</section>
<section id="profile-link" target="_blank">
<h1>Let's work together...</h1>
<p>How do you take your coffee?</p>
<div class="media-links">
<a id="profile-link" target="_blank" href="https://facebook.com/freecodecamp">Facebook</a>
<a href="https://github.com/freecodecamp">GitHub</a>
<a href="https://twitter.com/freecodecamp">Twitter</a>
<a href="example@example.com">Send a mail</a>
<a href="tel:555-555-5555">Call me</a>
</section>
</body>
<footer>
<div class="last">
<div class="left">**This is just a fake portfolio. All the projects and contact details given are not real.</div>
<div class="right">© Created for freeCodeCamp </div>
</div>
</footer>
</main>
</html>
/* file: styles.css */
body {background-color:#000000;
color:#ffffff;
font-size: 16px;
margin: 0;
padding: 0;
}
#navbar{text-align:right;
color:white;
padding:32px;
background-color:red;
box-sizing: border-box
font-size:20px;
top: 0;
left: 0;
right: 0;
position:fixed;}
.background-nav{
;
}
a {text-decoration: none;
color: inherit;}
a:visited{color:white;}
.welcome{
text-align:center;
padding:600px;
font-size:2rem;
height: 100vh;}
.welcome p{color:red;}
#projects {background-color:#909090;}
.project-tile {
display: grid;
grid-template-columns:repeat(3, 1fr);
gap:40px;
justify-items: center;
align-items: center;}
.project-tile img{width: 500px;
height: 300px;
object-fit:cover; }
#projects h1{text-align:center;
padding-bottom:20px;
padding-top:20px;}
#projects figure{border:30px solid blue;}
figure {
margin: 0;
padding: 0;
text-align: center;
background-color:blue;
font-size:2rem;
}
#profile-link{padding-top:50px;
text-align:center;
font-size:2rem;
padding-bottom:50px;}
#profile-link h1{font-size:5rem;
padding-bottom:0;
margin-bottom:0;}
.media-links a{padding:0px 0px 020px 50px;
}
footer {
display: block;
border-top: 10px solid orange;}
.last{
padding-top:20px;
padding-bottom:10px;
display:grid;
grid-template-columns:70% 30%;}
.left{text-align:left;}
.right{text-align:right;}
@media screen and (min-width: 768px) {
body {
font-size: 18px;
}
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.6 Safari/605.1.15
Challenge: Personal Portfolio Webpage - Build a Personal Portfolio Webpage
Link to the challenge: