an issue with div section of this html css code.  I would lie to get abetter understanding of what I did wrong.  I did have an issuewith the header, but got that straightened out but I still have thewrong font in the nav portion of that.  But my biggest problem is trying to understand the DIV containers css that is causing meall kinds of grief.  Can someone llok at this code and let meknow what needs to be corrected. My code is at the bottom.

 

Go to the ce_styles.css file and goto the Window and Body Styles section and create a style rule toset the background color of the browser window to rgb(101,101, 101).

Create a style rule for the body element that:

sets the background color to white,

sets the default font to the stack: Verdana, Geneva,Arial,sans-serif,

centers the page by setting the top/bottom margins to 20 pixelsand the left/right margins to auto, and

sets the width of the page body to 95% ranging from 320 pixelsup to 960 pixels.

Insert style rules to display all images in the document asblocks with widths of 100%.

Insert a style rule to remove all underlining from hypertextlinks within navigation lists.

Body Header Styles

Go to the Body Header Styles section. Richard wants you toformat the links that are displayed in the header at the top of theweb page. To format the links, create a style rule that sets thebackground color of the body header to rgb(191, 168,170) and sets the height to 40 pixels.

Create a style that displays all list items within thenavigation unordered list in the body header as blocks, floated onthe left, with a right margin of 20 pixels and top/bottom paddingof 10 pixels with left/right padding of 0 pixels.

Create a style rule to set the font size of hypertext linkswithin the body header navigation list to 0.9em with acolor value of rgb(51, 51, 51) for both visited andnon-visited links. Change the text color to rgb(255, 211,211) when the user hovers over or activates those links.

DIV Container Styles

Go to the DIV Container Styles section. Richard wants you to addsome additional spacing between the images and the edge of the pagebody. To add this spacing, create a style rule that sets the rightand bottom padding of the divelement with theID container to 8 pixels.

For every a element within a div elementbelonging to the cell class, create a style rule to:

display the hypertext link as a block with a width of 100%and

set the left and top padding to 8 pixels.

Footer Styles

Richard wants the page footer to be displayed in the bottomright corner of the web page. To place the footer in this position,go to the Windows and Body Styles section and setthe position property of the body element torelative, then go to the Footer Styles section and create a stylerule for the footer element to do the following:

set the position property of the footer to absolutewith a right coordinate and bottom coordinate of 8 pixels,

set the text of the footer to rgb(143, 33, 36),

right-align the footer text, and

set the font size to 2vmin so that the text resizesautomatically with the width and/or height of the browserwindow.

Tasks

 

 

@charset "utf-8";

/*
   New Perspectives on HTML5 and CSS3, 7th Edition
   Tutorial 3
   Case Problem 2



   Filename: ce_styles.css
*/

/* Window and Body Styles */

html {
  background-color: rgb(101, 101, 101);
}
body {
  position: relative;
  background-color: white;
  font-family: Verdana, Geneva, Arial, san-serif;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  width: 95%;
  min-width: 320px;
  max-width: 960px;
}

body img{
  display: block;
  width: 100%;
}
nav a{
  text-decoration: none;
  }
/* Body Header Styles */
body > header{
  background-color: rgb(191, 168, 170);
  height: 40px;
}
nav>ul>li>a{
  Display: block;
  float: left;
  font-size: 0.9em;
  margin-right: 20px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
}

nav a:link, nav a:visited{
 color:rgb(51,51,51);
}
nav a:hover, nav a:active {
 color: rgb(255,211,211);
}
/* DIV Container Styles */
div#container {
  padding-right: 8px;
  padding-bottom: 8px;
}
div[class^="cell"]>a {
  display: block;
  width: 100%;
  padding-left: 8px;
  padding-top: 8px;
}

/* Footer Styles */
footer {
  position: absolute;
  right: 8px;
  bottom: 8px;
  color: rgb(143, 33, 36);
  text-align: right;
  font-size: 2vmin;
}