Dasmoto Feedback

Projects
1

Just finished up the Dasmoto Project and looking for some feedback. For the life of me, I cannot figure out why the “Dasmotos Arts & Crafts” is so large even though I have it at the required 100px. I added a nav bar, and footer with fake contact information.

Images:

image
image1081×915 66 KB

image
image1078×637 128 KB

HMTL:

<!DOCTYPE html>
<html lang="en">
<head>
    <link href="resources/css/style.css" rel="stylesheet" type="text/css">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dasmoto's Arts</title>
</head>
<body>

    <!--title-->
    <div id="title">
        <h1>Dasmoto's Arts & Crafts</h1>
    </div>

    <!--Nav Bar-->
    <nav>
       <div id="nav">
        <ul>
        <li><a href="#brushes">Brushes</a></li>
        <li><a href="#frames">Frames</a></li>
        <li><a href="#paint">Paint</a></li>
        </ul>
       </div>
    </nav>
    
    <!--Brushes-->
    <div id="brushes">
        <h2>Brushes</h2>
    </div>
    <img src="resources/images/hacksaw.jpeg" alt="hacksaw-brush" class="img">
    <h3> Hacksaw Brushes</h3>
    <p> Made of the higheat quality oak, Hacksaw brushes are known for their weight and ability to hold paint in large amounts. Available in different prices. <spa class="price">Starting at $3.00/brush.</span></p>

    <!--Frames-->
    <div id="frames">
        <h2>Frames</h2>
    </div>
    <img src="resources/images/frames.jpeg" alt="assortment-of-frames" class="img">
    <h3>Art Frames (assorted)</h3>
    <p>Assorted frames made of different material, including MFD, birchwood, and PDE. Select frames can be sanded and painted according to your needs. <span class="price">Starting at $2.00/frame.</span></p>

    <!--Paint-->
    <div id="paint">
        <h2>Paint</h2>
    </div>
    <img src="resources/images/finnish.jpeg" alt="spilled-paint" class="img">
    <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 mircrobinds to canvas, increading the finish and longevity of any artwork. <span class="price">Starting at $5.00/tube.</span></p>
</body>
    <!--Bottom of page-->
  <footer>
    <h4><a href="#title">Top of Page</a></h4>
    <h5>Email: [email protected]  |  Ph. 888-444-3332  |  Address: 1455 Art Street Denver, CO 80014</h5>
  </footer>
</html>

CSS:

* {
    font-family: helvetica;
}

#title {
    font-family: helvetica;
    font-size: 100px;
    font-weight: bold;
    color: khaki;
    text-align: center;
    background-image: url('../images/pattern.jpeg');
    margin: 0 auto;
}

#nav {
    list-style: none;
    width: 100%
    margin-bottom: 10px;
    text-align: center;
    font-weight: bold;
}

#nav ul{
    list-style-type: none;
    padding: 0;
    margin: 0px;
}

#nav li{
    display: inline-block;
    font-size: 20px;
    padding: 10px;
    border: solid 1px black;
    background-color: rgb(211, 211, 211);
    text-align:center;
}


#brushes {
    font-family: helvetica;
    font-size: 32px;
    font-weight: bold;
    color: white;
    background-color: mediumspringgreen;
    text-align: left;
}

#frames {
    font-family: helvetica;
    font-size: 32px;
    font-weight: bold;
    color: white;
    background-color: lightcoral;
    text-align: left;
}

#paint {
    font-family: helvetica;
    font-size: 32px;
    font-weight: bold;
    color: white;
    background-color: skyblue;
    text-align: left;
    width: auto;
}

.price {
    font-family: helvetica;
    font-weight: bold;
    color: blue;
    text-align: center;
}

p {
    font-family: helvetica;
    text-align: center;
}

h3 {
    font-family: helvetica;
    text-align: center;
}

img {
    display: block;
    margin: auto auto;
}

footer {
    text-align: center;
    background-color:lightgrey;
    padding: 3px;
}

Any feedback is appreciated! Thanks in advanced.