(Solved) : Help Please Web Development Html Css Need Help Figuring Ve Done Wrong Editing Project T Se Q34400381 . . .

Help please – Web Development, HTML/CSS – I need some help infiguring out what I’ve done wrong in editing my project, I can’tsee where I have messed up, these are the instructions I amfollowing:

6. Anne wants the navigation list to be displayed horizontallyon the page. Go to the Horizontal Navigation Styles section andcreate a style rule for every list item within a horizontalnavigation list that displays the list item as a block floated onthe left margin with a width of 16.66%.

7. Display every hypertext link nested within a navigation listitem as a block.

8. Next, you’ll create the style rules for the grid section ofthe March Specials page. Go to the Row Styles section. For everydiv element of the newRow class, create a style rule that displaysthe element with a width of 100% and only when all floated elementshave been cleared. Using the technique from this tutorial, addanother style rule that uses the after pseudo-element to expandeach newRow class of the div element around its floatingcolumns.

9. Next, you’ll format the grid columns. Go to the Column Stylessection. Create a style rule to float all div elements whose classvalue starts with “col-” on the left margin. Set the padding aroundall such elements to 2%. Finally, apply the Border Box Sizing modelto the content of those elements. (Note: Remember to use webextensions to provide support for older browsers.)

10. In the same section, create style rules for div elementswith class names col-1-1, col-1-2, col-1-3, col-2-3, col-1-4, andcol-3-4 to set their widths to 100%, 50%, 33.33%, 66.67%, 25%, and75% respectively.

11. Go to the Specials Styles section. In this section, you willcreate styles for the monthly specials advertised by the company.Create a style rule for all div elements of the specials class thatsets the minimum height to 400 pixels and adds a 1 pixel dashedoutline around the element with a color value of rgb(71, 52,29).

12. Go to the Award Styles section. In this section, you willcreate styles for the list of awards won by Pandaisia Chocolates.Information boxes for the awards are placed within the div elementwith id awardList. Create a style rule for this element that placesit using relative positioning, sets its height to 650 pixels, andautomatically displays scrollbars for any overflow content.

13. Every information box in the awardList element is stored ina div element belonging to the awards class. Create a style rulethat places these elements with absolute positioning and sets theirwidth to 30%.

14. Position the individual awards within the awardList box bycreating style rules for the div elements with id values rangingfrom award1 to award5 at the following (top, left) coordinates:award1 (80px, 5%), award2 (280px, 60%), award3 (400px, 20%), award4(630px, 45%), and award5 (750px, 5%). (Hint: In thepc_specials.html file, the five awards have been placed in a divelement belonging to the awards class with id values ranging fromaward1 to award5.)

15. Go to the Footer Styles section and create a style rule forthe body footer that displays the footer once both margins areclear of previously floated elements.

16. Save your changes to the style sheet and then open thepc_specials.html file in your browser. Verify that the layout anddesign styles resemble the page shown in Figure 3-65

This is the CSS text file I am working on:

/*
New Perspectives on HTML5 and CSS3, 7th Edition
Tutorial 3
Review Assignment

Style Sheet for the Pandaisia Chocolates Monthly Specials
Author:
Date: Jan 24/2019

Filename: pc_specials.css

*/

/* Page Body Styles */
body {
margin-left: auto;
margin-right: auto;
max-width: 960px;
min-width: 640;
width: 95%;
}

/* Image Styles */
body > header > img {
display: block;
width: 100%;
}

/* Horizontal Navigation Styles */
body > header > nav > ul > li {
width: 16.66%;
text-align: center;
}

nav.horizontal li {
display: block;
float: left;
}

nav.horizontalNavigation a {
display: block;
}

/* Row Styles */
div.newRow {
clear: both;
width: 100%;
}

div.newRow:after {
clear: left;
content: “”;
display: table;
}

/* Column Styles */
div[class^=”col-“] {
float: left;
padding: 2%;
}

div.col-1-1 {
width: 100%;
}

div.col-1-2 {
width: 50%;
}

div.col-1-3 {
width: 33.33%;
}

div.col-2-3 {
width: 66.67%;
}

div.col-1-4 {
width: 25%;
}

div.col-3-4 {
width: 75%;
}

div[class^=”col-“]:after {
clear: left;
content: “”;
display: table;
}

/* Specials Styles */
div {
min-height: 400px;
outline: 1px dashed rgb(71, 52, 29);
}

/* Award Styles */
div#awardList {
position: relative;
height: 650px;
overflow: auto;
}

div.awards {
position: absolute;
width: 30%;
}

div#award1 {
top: 10px;
left: 5%;
}

div#award2 {
top: 280px;
left: 60%;
}

div#award3 {
top: 400px;
left: 20%;
}

div#award4 {
top: 630px;
left: 45%;
}

div#award5 {
top: 750px;
left: 5%;
}

/* Footer Styles */
body > footer {
clear: both;
}

I’m still reliant on my text book, examples and previousexercises as I am only 3 weeks into my Web development course, anytips to help me understand how to resize the pictures correctlywould be appreciated. Link below for current file set if you canhelp. Thank you.

https://drive.google.com/open?id=1FqSv-sL_tEIsRyAPX3z0Q5xkwTLpv6V0

D Pandaisia Chocolates Monthly Sp × + ← → C ⓘ 127.0.0.1 :2792/review/pc-specials.html 414 Tree LaneEssex, VT 05452 Home The Ftore My Account Specials Revicws Contact Uus March Specials lwards Spring is coming and weve got some mouth-watering specials to help you celebrate the change in seasons in style! Featured throughout March is our always-popular Chocolate Covered Strawberries/Rose Fruit Syrup Combo, now at the special low price of $29.95. For that special someone, consider our Red Rose Select box of Spring chocolates. Remember that for every order of $25 or more, you receive a free truffle of your choice For orders of $100 or more we throw in a four-piece gift box of our signature chocolates and truffles. f Show Best o Confectioners :Association ve Stars Confectioner Quarterly Red Rose elect your Choic Prali ine ignatures Best Chocolate A classic collection of 18 signature chocolates served with a romantic red rose for the special person Build your own collection of signature truffles and Delicious chocolate with delicious pralines presented in a beautiful and elegant box. Enjoy this fantastic collection inspired by the best Parisian chocolate shops. Food World chocolates. Now you can choose old favorites from in your life. One of our most popular box sets our 24-year history of award-winning chocolates and sweets. $24.95 $32.55 $39.23 Pandaisia Chocolates 2017 All Rights Reserved INS UTF-8 ▼ HTML ▼ ● Spaces: 4

D Pandaisia Chocolates Monthly Sp × + ← → C ⓘ 127.0.0.1 :2792/review/pc-specials.html 414 Tree LaneEssex, VT 05452 Home The Ftore My Account Specials Revicws Contact Uus March Specials lwards Spring is coming and we’ve got some mouth-watering specials to help you celebrate the change in seasons in style! Featured throughout March is our always-popular Chocolate Covered Strawberries/Rose Fruit Syrup Combo, now at the special low price of $29.95. For that special someone, consider our Red Rose Select box of Spring chocolates. Remember that for every order of $25 or more, you receive a free truffle of your choice For orders of $100 or more we throw in a four-piece gift box of our signature chocolates and truffles. f Show Best o Confectioners :Association ve Stars Confectioner Quarterly Red Rose elect your Choic Prali ine ignatures Best Chocolate A classic collection of 18 signature chocolates served with a romantic red rose for the special person Build your own collection of signature truffles and Delicious chocolate with delicious pralines presented in a beautiful and elegant box. Enjoy this fantastic collection inspired by the best Parisian chocolate shops. Food World chocolates. Now you can choose old favorites from in your life. One of our most popular box sets our 24-year history of award-winning chocolates and sweets. $24.95 $32.55 $39.23 Pandaisia Chocolates 2017 All Rights Reserved INS UTF-8 ▼ HTML ▼ ● Spaces: 4 Show transcribed image text

Expert Answer


. . .