Create a style rule for the body element that: Sets the width to 90% of the...

Create a style rule for the body element that:

Sets the width to 90% of the browser window, ranging from a minimum width of 640 pixels up to a maximum width of 1024 pixels.
Sets the top/bottom margin to 30 pixels and the left/right margin to auto.
Displays the body as a CSS grid.
Creates six grid columns each with a width of 1fr.
Creates five grid rows with widths of 50 pixels, 30 pixels, 1fr, 1fr, and 100 pixels.
Adds a grid gap of 15 pixels.

Set the size of the grid items as follows:

Have the header element span from gridline 1 to gridline -1.
Have the article#intro element span two rows and two columns.
Have the article#main element two rows and three columns.
Have the footer element span two columns.

Expert Solution

<!DOCTYPE html>
<html>
<head>
<style>
p.ex1 {
margin: 30px auto;
}
.grid-container {
display: grid;
grid-template-columns: 1fr;
grid-template-columns: 50px, 30px, 1fr, 1fr, 100px;
grid-gap: 15px;
background-color: #2196F3;
padding: 10px;
}

.grid-container > div {
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
padding: 20px 0;
font-size: 10px;
}
</style>
</head>
<body{min-width: 640px; max-width: 1024px; width: 90%;}>

<h1>Grid-template-columns and Grid-template-columns</h1>

<p>You can use the <em><b>Grid-template-columns and Grid-template-columns</em></b> property to specify the number of columns in your grid layout.</p>

<p class="ex1">This paragraph has a top and bottom margins 30 pixels and right and left margins are auto.</p>

</body>
</html>

venereology answered 2 hours ago

1. Go to the Footer Styles section and create a style rule that displays the footer...

1. Go to the Footer Styles section and create a style rule that displays the footer only when both margins are clear of floating objects. 2. Go to the Topics Styles section. This section sets the styles for a list of four topics describing what the company is offering. Karen wants this list to also be displayed horizontally on the page. For list items within the ul element with the id topics, create a style rule to: a) display the...

For all img elements create a style rule that applies a sepia filter with a value...

For all img elements create a style rule that applies a sepia filter with a value of 1. Add a black box shadow with horizontal and vertical offsets of 0 pixels and a blur radius of 20 pixels. Create the following style rules for the five image elements: For the img1 image, translate the image -150 pixels along the z-axis. For the img2 image, rotate the image 90 degrees around the x-axis and translate the image -150 pixels along the...

What style property sets the kerning of the text within an element? letter-spacing word-spacing kerning-size kerning

What is the purpose of the overlap rule? An element of a superclass may not belong...

What is the purpose of the overlap rule? An element of a superclass may not belong to multiple subtypes An element of a supertype can belong to multiple subtypes A subtype of a supertype can be a supertype of a further subtype Two subtypes must have the exact same membership

Provide a style rule to remove underlining from hypertext links marked with the <a> tag and...

Provide a style rule to remove underlining from hypertext links marked with the <a> tag and nested within a navigation list. nav > a {text-decoration: none;} nav > a {text-decoration: no-underline;} nav a {text-decoration: none;} nav a {text-decoration: underline=“no”;}

Write a loop that sets each array element to the sum of itself and the next...

Write a loop that sets each array element to the sum of itself and the next element, except for the last element which stays the same. Be careful not to index beyond the last element. Ex: Initial scores: 10, 20, 30, 40 Scores after the loop: 30, 50, 70, 40 The first element is 30 or 10 + 20, the second element is 50 or 20 + 30, and the third element is 70 or 30 + 40. The last...

What are the four Rule types that you can create with the New Rule Outbound Wizard?...

What are the four Rule types that you can create with the New Rule Outbound Wizard? What is an easy way to test ICMP echo requests? What responses are possible? Do you have the option to block all incoming traffic? Why would you want to do this?

What is the first f element in the 6th period to which Hund's rule must be...

What is the first f element in the 6th period to which Hund's rule must be applied when writing the orbital diagram?

Suppose you have calculated the width of the 90% confidence interval for customer the average waiting...

Suppose you have calculated the width of the 90% confidence interval for customer the average waiting time as ± 10 minutes, based on 10 replications of your experiment. However, your boss isn’t satisfied with your choice of a 90% confidence level and wants you to run additional experiments to give him the average waiting time with a 99% confidence interval of ± 10 minutes. Approximately how many additional replications will be required? (HINT: You may assume that the sample variance...

A student was asked to find a 90% confidence interval for widget width using data from...

A student was asked to find a 90% confidence interval for widget width using data from a random sample of size n = 20. Which of the following is a correct interpretation of the interval 11.8 < μ < 21.7? Check all that are correct. The mean width of all widgets is between 11.8 and 21.7, 90% of the time. We know this is true because the mean of our sample is between 11.8 and 21.7. With 90% confidence, the...

Question