Question: Exercise 5 style.css for more explanation: Setup 1. Download the exercise files: CS0134- E5.zip 2. Unzip and copy the 'CS0134-E5' folder onto your laptop. 3.




Setup 1. Download the exercise files: CS0134- E5.zip 2. Unzip and copy the 'CS0134-E5' folder onto your laptop. 3. Open index.html and style.css in Notepad++ or Brackets. Goals Each goal is worth 1 point. Place all style rules in the style.css file. Rearrange the HTML in index.html so that the ul element is a child of an aside element. The aside element must be a sibling of hte main element. Remove
Animal Categories
Float the paw print image to the left Add a 20px right margin to the paw print image Remove the bullets from the li elements et the left padding for the ul element to 0 Float the aside element to the left Float the main element to the right Set the width of the aside element to 170px Set the width of the main element to 570px Set the padding for both the main and aside elements to 0 for the top and bottom and 15px for the left and right Clear the floating in both directions for the footer element Results Your site should look similar to the following. CS0134 PET SHOP Find Your Friend Dogs Cats Elsh Birds Looking for a pet? We are the CS0134 Pet Shop. It is our job to help you find your perfect furry, feathery or scaley friend. We also have all kinds of food, toys and other supplies for your new and old friends. CS0134 Pet Shop File Edit Find View Navigate Window Debug Help 20134-E 0134- 11 16 1 html { 2 background-color: lightgrey; 3 4 body { font-family: "Open Sans", Arial, Helvetica,sans-serif; width: 80px; background-color: white; margin: auto; 9 10 header { padding: 15px; 12 background-image: linear-gradient(to right, white 0% , grey 100%); 13 overflow: auto; 14 ] 15 header > h2{ margin: ; 17 font-size: 3em; 18 color: #8B4513; 19 text-shadow: 2px 2px gray; 20 font-variant: small-caps; 21 ] 22 header > h3 { 23 font-size: 1.25em; margin: ; 25 } 26h1 { 27 font-size: 1.5em; 28 } 29 hl::first-letter { 30 font-size: 150%; 31 } 32 a:focus, a:hover { 33 text-decoration: none; 34 } 35 footer p { 36 text-align: center; 37 ) 38 footer { 39 padding: 15px 0; 40 } 24 41 UITE 8 CSS http://pitt.edu/~ols9/teaching/cs0134-2204/th/exercise-5/ index.html EN... SO... ion... an... e to
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
