Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

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.

Exercise 5
image text in transcribed
image text in transcribed
image text in transcribed
style.css
image text in transcribed
for more explanation:
image text in transcribed
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

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Data Access Patterns Database Interactions In Object Oriented Applications

Authors: Clifton Nock

1st Edition

0321555627, 978-0321555625

More Books

Students also viewed these Databases questions

Question

What is the orientation toward time?

Answered: 1 week ago

Question

4. How is culture a contested site?

Answered: 1 week ago