Step 2 Below the tablet media query, add a new comment with the text, Media Query for Desktop Viewport. Below the comment, add a new media query that targets a screen with a minimum width of 769px and print. Within the desktop media query, add a new comment with the text, Desktop Viewport: Style rule for header. Below the comment, add a style rule for the header selector that sets the padding to 2%.   Within the desktop media query, below the header style rule, add a new comment with the text, Desktop Viewport: Style rules for nav area. Below the comment, add a style rule for the nav li a selector that sets the padding to 0.5em on the top and bottom and 1.5em on the left and right. Add another style rule for the nav li a selector that uses the hover pseudo-class and sets the color to #373684 and the background-color to #e5e9fc. 2   Within the desktop media query, below the nav area style rules, add a new comment with the text, Desktop Viewport: Style rules for main content. Below the comment, add a style rule for the following selectors: #info ul selector that sets the left margin to 5% main h3 selector that sets the font-size to 1.5em #piano, #guitar, and #violin selectors that sets the width to 29%, a float to the left, top/bottom margin value of 0, and left/right margin value of 2% Below the desktop media query, add a new comment with the text, Media Query for Print. Below the comment, add a new media query that targets print. Within the print media query, add a style rule for the body selector that sets the background-color to #fff and the color to #000.

New Perspectives on HTML5, CSS3, and JavaScript
6th Edition
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Patrick M. Carey
Chapter7: Designing A Web Form: Creating A Survey Form
Section: Chapter Questions
Problem 8RA
icon
Related questions
Question

Step 2

Below the tablet media query, add a new comment with the text, Media Query for Desktop Viewport. Below the comment, add a new media query that targets a screen with a minimum width of 769px and print.

Within the desktop media query, add a new comment with the text, Desktop Viewport: Style rule for header. Below the comment, add a style rule for the header selector that sets the padding to 2%.

 

Within the desktop media query, below the header style rule, add a new comment with the text, Desktop Viewport: Style rules for nav area. Below the comment, add a style rule for the nav li a selector that sets the padding to 0.5em on the top and bottom and 1.5em on the left and right.

Add another style rule for the nav li a selector that uses the hover pseudo-class and sets the color to #373684 and the background-color to #e5e9fc.

2
 

Within the desktop media query, below the nav area style rules, add a new comment with the text, Desktop Viewport: Style rules for main content. Below the comment, add a style rule for the following selectors:

  • #info ul selector that sets the left margin to 5%
  • main h3 selector that sets the font-size to 1.5em
  • #piano, #guitar, and #violin selectors that sets the width to 29%, a float to the left, top/bottom margin value of 0, and left/right margin value of 2%

Below the desktop media query, add a new comment with the text, Media Query for Print. Below the comment, add a new media query that targets print.

Within the print media query, add a style rule for the body selector that sets the background-color to #fff and the color to #000.

Expert Solution
trending now

Trending now

This is a popular solution!

steps

Step by step

Solved in 2 steps

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.
Similar questions
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
Np Ms Office 365/Excel 2016 I Ntermed
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:
9781337508841
Author:
Carey
Publisher:
Cengage
COMPREHENSIVE MICROSOFT OFFICE 365 EXCE
COMPREHENSIVE MICROSOFT OFFICE 365 EXCE
Computer Science
ISBN:
9780357392676
Author:
FREUND, Steven
Publisher:
CENGAGE L