Homework Help is Here – Start Your Trial Now!
Engineering
Computer Science
Add a blank line after the contact id style rule, add a comment with the text Style rules for footer content, and then create the following style rules for the footer and footer a selectors. Create a style rule for the footer selector that aligns text center, sets a font size value of 0.85em, sets a background color value of #2a1f14, sets a font color value of #f6eee4, and sets top and bottom padding values to 1% and right and left padding values to 0%. Create a style rule for footer a that sets the font color value to #f3e6d8 and removes the text decoration. I'm not sure what is wrong then my footer section.

Add a blank line after the contact id style rule, add a comment with the text Style rules for footer content, and then create the following style rules for the footer and footer a selectors. Create a style rule for the footer selector that aligns text center, sets a font size value of 0.85em, sets a background color value of #2a1f14, sets a font color value of #f6eee4, and sets top and bottom padding values to 1% and right and left padding values to 0%. Create a style rule for footer a that sets the font color value to #f3e6d8 and removes the text decoration. I'm not sure what is wrong then my footer section.

New Perspectives on HTML5, CSS3, and JavaScript
New Perspectives on HTML5, CSS3, and JavaScript
6th Edition
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Patrick M. Carey
Chapter3: Designing A Page Layout: Creating A Website For A Chocolatier
Section: Chapter Questions
Problem 19CP2
See similar textbooks
icon
Related questions
Question

Add a blank line after the contact id style rule, add a comment with the text Style rules for footer content, and then create the following style rules for the footer and footer a selectors.

  • Create a style rule for the footer selector that aligns text center, sets a font size value of 0.85em, sets a background color value of #2a1f14, sets a font color value of #f6eee4, and sets top and bottom padding values to 1% and right and left padding values to 0%.
  • Create a style rule for footer a that sets the font color value to #f3e6d8 and removes the text decoration.

I'm not sure what is wrong then my footer section. 

--- HTML

<!-- Write your code here -->
<!--Student Name:
    File Name: contact.html
    Date:10/04/2022
-->
<!DOCTYPE html>
<html lang="en">
  <head>
  <title>Wild Rescues: Contact</title>
     <meta charset="utf-8">
      <link rel="stylesheet" href="css/styles.css" />
  <body>
    <header>
      <img src="images/baby-hawk.jpg" alt="rescued baby hawk">
    </header>

    <nav>
      <ul> 
        <li><a href="index.html">Home</a></li>      
        <li><a href="about.html">About Us</a></li>    
        <li><a href="partnership.html">Partnership</a><li
        <li><a href="gallery.html">Gallery</a></li>      
        <li><a href="faqs.html">FAQs</a></li>       
        <li><a href="contact.html">Contact</a></li>
      </ul> 
    </nav>
<!-- Use the main area to add the main content to the webpage -->
    <main>
      <div id="contact">
        <h2>You can reach us at:</h2>
        <p>Office: (814)555-8989.</p>
        <p>Email: <span class="link">contact@wildrescues.net</span>
          <a href="mailto:contact@wildrescues.net"></a></p>
        <p>Address: <span class="link">8989 Rescue Drive Ocala, FL 34471</span><a 
        href="https://goo.gl/maps/BTJzjc2tALd4RDWA8" 
        target="_blank"></a></p>
      </div>
    </main>

    <footer>
      <p>&copy; Copyright 2021. All Rights Reserved.</p>
      <p> 
        <a href="mailto:contact@wildrescues.net">contact.@wildrescues.net</a> 
      </p>
    </footer>
  </body>
</html>

--CSS
/*
Author: 
File Name: styles.css
Date: 10/12/2022
*/

/*CSS Reset*/
body, header, nav, main, footer, img, h1, h3 {
  margin: 0;
  padding: 0;
  border: 0;
}

/*Style rules for body and images*/
body {
    background-color: #f6eee4;
}
img {
    max-width: 100%;
    display: block;
}

/*Style rules for navigation area*/
nav {
  background-color: #2a1f14;
}
nav ul {
  list-style: none;
  margin: 0;
  text-align: center;
}

nav li {
  display: inline-block;
  font-size: 1.5em;
  font-family: Geneva, Arial, sans-serif;
  font-weight: bold;
}

nav li a {
  display: block;
  color: #f6eee4;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  padding-left: 2em;
  padding-right: 2em;
  text-decoration: none;
}

/*Style rules for main content*/
main {
  padding: 2%;
  font-family: Verdana, Arial, sans-serif;
}
main p {
  font-size: 1.25em;
}
main h3 {
  padding-top: 2%;
}
main ul {
  list-style: square;
}

/*Style rules for class and id selectors*/
.link {
  color: #4d3319;
  text-decoration: none;
  font-weight: bold;
  font-style: italic;
}
.action {
  font-size: 1.75em;
  font-weight: bold;
  text-align: center;
}
#contact {
  text-align: center;
}

/*Style fules for footer content*/
footer {
  text-align: center;
  font-size: 0.85em;
  background-color: #2a1f14;
  color: #f6eee4;
  padding-top: 1%;
  padding-bottom: 1%;
  padding-left: 0%;
  padding-right: 0%;
}
footer a {
  color: #f3e6d8;
  text-decoration: none;
}
Expert Solution
steps

Step by step

Solved in 3 steps with 1 images

SEE SOLUTIONCheck out a sample Q&A here
Blurred answer
Knowledge Booster
Hyperlinks
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.
Recommended textbooks for you
New Perspectives on HTML5, CSS3, and JavaScript
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:
9781305503922
Author:
Patrick M. Carey
Publisher:
Cengage Learning
SEE MORE TEXTBOOKS