The project is: https://www.codecademy.com/paths/web-development/tracks/styling-a-website/modules/web-dev-html-css-practice/projects/dasmoto
Project Name: Dasmoto’s Arts & Crafts (on Codeacademy)
I attempted to recreate the site:
but I seem to have an extra spacing within the paragraph
part of the html where I separated the blue text with
It should look like
Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs. Starting at $2.00 / frame.
but
ends up being shown like
Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs.
Starting at $2.00 / frame.
my index.html:
<!DOCTYPE html>
<html>
<!--sample link for the website-->
<!--https://s3.amazonaws.com/codecademy-content/courses/freelance-1/unit-2/dasmotos-arts_redline.jpg-->
<head>
<title>Dasmoto's Arts & Crafts</title>
<link rel ="stylesheet" href = "style.css">
</head>
<body>
<h1>Dasmoto's Arts & Crafts</h1>
<h2 class = "bcmediumspringgreen">Brushes</h2>
<img src= "./img/hacksaw.jpeg" alt = "Hacksaw Brushes">
<h3>Hacksaw Brushes</h3>
<p>Made of the highest quality oak, Hacksaw brushes are known for their weight and ability to hold paint in large amounts. Available in different sizes. <div class = "txtblue">Starting at $3.00 / brush.</div></p>
<h2 class = "bclightcoral">Frames</h2>
<img src= "./img/frames.jpeg" alt = "Art Frames (assorted)">
<h3>Art Frames(assorted)</h3>
<p>Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs. <div class = "txtblue">Starting at $2.00 / frame.</div></p>
<h2 class = bcskyblue>Paint</h2>
<img src= "./img/finnish.jpeg" alt = "Clean Finnish Paint">
<h3>Clean Finnish Paint</h3>
<p>Imported paint from Finland. Over 256 colors available in-store, varying in quantity (1 oz. to 8 oz.). Clean Finnish paint microbinds to canvas, increasing the finish and longevity of any artwork. <div class = "txtblue">Starting at $5.00 / tube.</div></p>
</body>
</html>
my style.css:
h1{
background-image: url("pattern.jpeg");
font-family: Helvetica;
font-size: 100px;
font-weight: bold;
color: khaki;
text-align: center;
}
h2{
font-family: Helvetica;
font-size: 32px;
font-weight: bold;
color: white;
}
h3{
}
p{
}
.txtblue{
color: blue;
font-weight: bold;
font-family: Helvetica;
}
.bcmediumspringgreen{
background-color: mediumspringgreen;
}
.bclightcoral{
background-color: lightcoral;
}
.bcskyblue{
background-color: skyblue;
}