To get the results shown above, you need to complete the styles in styles/box-styles.css. The classes already exist in the HTML so you can focus on styles today.
To get the results shown above, you need to complete the styles in styles/box-styles.css. The classes already exist in the HTML so you can focus on styles today.
Computer Networking: A Top-Down Approach (7th Edition)
7th Edition
ISBN:9780133594140
Author:James Kurose, Keith Ross
Publisher:James Kurose, Keith Ross
Chapter1: Computer Networks And The Internet
Section: Chapter Questions
Problem R1RQ: What is the difference between a host and an end system? List several different types of end...
Related questions
Question
@import url('https://fonts.googleapis.com/css2?family=Rubik+Mono+One&display=swap');
body {
font-size: 62.5%;
margin: 0;
}
h1 {
}
h3 {
}
p {
}
h3, p {
}
.title-padding {
}
.body-padding {
}
.light-shadow {
}
.max-width {
}
.full-width {
}
.center-element {
}
.round-borders {
}
.bb {
}
.cb {
}
Transcribed Image Text:To get the results shown above, you need to complete the styles in styles/box-styles.css. The
classes already exist in the HTML so you can focus on styles today.
Use the following specifications to complete the style rules:
Level One Section Headings:
Text in h1 elements should be 4x the base font-size
Text in h1 elements should be centered
The font in h1 elements should be Rubik Mono One of the sans-serif font-family
o This is a custom font already imported at the top of this stylesheet
Level Three Section Headings:
• Text in h3 elements should be 2x the base font-size
Paragraph
• Text in p elements should be 1.5x the base font-size
Paragraph and Level Three Section Headings:
• There shouldn't be any margins applied to these elements
Title Padding
Vertical padding values should be less than horizontal paddings values
• Your padding does not need to match the screenshots I provide in this document
Body Padding
• Horizontal padding for this class should match the horizontal padding defined in the
Title Padding class
• Vertical padding can be unique but it must be less than or equal to the vertical padding
in Title Padding
Your padding does not need to match the screenshots I provide in this document
Light Shadow
• Define a transparent box shadow
o Your shadow does not need to match the screenshots I provide in this document
Transcribed Image Text:Max Width
• This class should set a maximum width of 50x the base font-size
Center Element
• Set a top margin that is 8x the base font-size
• Make it so the horizontal margin is automatically calculated by the browser
o Check your browser before continuing
o Your boxes/cards should be centered in the browser
Round Borders
Use the border radius property to create round borders
• The border radius should be between 0.25x and 2x the base font-size
o Your borders do not need to match the screenshots I provide in this document
Border Box (BB)
• elements with this class will account for border and padding when calculating width
Content Box (CB)
• elements with this class will apply width to the content area
вох МODEL
Content Box
content-box gives you the default CSS box-sizing behavior. If you set an
element's width to 100 pixels, then the element's content box will be 100 pixels
wide, and the width of any border or padding will be added to the final rendered
width, making the element wider than 100px
Expert Solution
This question has been solved!
Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.
Step by step
Solved in 2 steps
Recommended textbooks for you
Computer Networking: A Top-Down Approach (7th Edi…
Computer Engineering
ISBN:
9780133594140
Author:
James Kurose, Keith Ross
Publisher:
PEARSON
Computer Organization and Design MIPS Edition, Fi…
Computer Engineering
ISBN:
9780124077263
Author:
David A. Patterson, John L. Hennessy
Publisher:
Elsevier Science
Network+ Guide to Networks (MindTap Course List)
Computer Engineering
ISBN:
9781337569330
Author:
Jill West, Tamara Dean, Jean Andrews
Publisher:
Cengage Learning
Computer Networking: A Top-Down Approach (7th Edi…
Computer Engineering
ISBN:
9780133594140
Author:
James Kurose, Keith Ross
Publisher:
PEARSON
Computer Organization and Design MIPS Edition, Fi…
Computer Engineering
ISBN:
9780124077263
Author:
David A. Patterson, John L. Hennessy
Publisher:
Elsevier Science
Network+ Guide to Networks (MindTap Course List)
Computer Engineering
ISBN:
9781337569330
Author:
Jill West, Tamara Dean, Jean Andrews
Publisher:
Cengage Learning
Concepts of Database Management
Computer Engineering
ISBN:
9781337093422
Author:
Joy L. Starks, Philip J. Pratt, Mary Z. Last
Publisher:
Cengage Learning
Prelude to Programming
Computer Engineering
ISBN:
9780133750423
Author:
VENIT, Stewart
Publisher:
Pearson Education
Sc Business Data Communications and Networking, T…
Computer Engineering
ISBN:
9781119368830
Author:
FITZGERALD
Publisher:
WILEY