Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

I am having serious trouble with my table styles in the below assignment. I need help with what I am doing wrong in the table

I am having serious trouble with my table styles in the below assignment. I need help with what I am doing wrong in the table layout, elements, and columns. Here is the task:

Table Layout

Open the mi_tables.css and go to the Table Styles section and add a style rule for the table element that:

sets the background color to a linear gradient that goes to the bottom of the table background starting from rgb(190, 215, 255) and ending in black and

adds a 5-pixels solid gray border.

Table Elements

For every th and td element in the table, create a style rule that:

adds a 3-pixel solid gray border,

sets the line height to 1.4em, and

sets the padding space to 8 pixels.

For every th element, create a style rule that:

sets the background color to black,

sets the font color to rgb(130, 210, 255), and

sets the font weight to normal.

For every td element, create a style rule that:

sets the font color to white,

sets the font size to 0.9em, and

aligns the cell text with the top of the cell.

Table Column Styles

Go to the Column Styles section. Create a style rule for col elements with the ID firstCol that sets the column width to 24%.

Create a style rule for col elements belonging to the dataCols class that sets the column width to 19%.

Table Header Styles

Go to the Table Header Styles section. Create a style rule for the table header row group including every row within that row group that sets the row height to 60 pixels.

For the first th element in the first row of the table header row group, create a style rule that sets its font size to 2em. (Hint: Use the first-of-type pseudo-class to select the first table row and first heading cell.)

For th elements in the first row of the table header row group that are not the first heading cell, create a style rule that sets the background color to transparent and the font color to black. (Hint: use the not selector with the first-of-typepseudo-class to select headings that are not first in the table row.)

Instructions

Complete the Table Layout step described above.

Complete the Table Elements step described above.

Complete the Table Header Stylesstep described above.

Here is what I have so far:

/* Table Styles */ table { background: linear-gradient (rgb(190, 215, 255), black); border: 5px solid gray; } th td { border: 3px solid gray; line-height: 1.4em; padding: 8px; }

th { background-color: black; color: rgb(130,210,255); font-weight:normal; } td { color: white; font-weight: 0.9em; text-align: top; }

/* Column Styles */ #firstCol { width: 24%; } .dataCols span { width: 19%; }

/* Table Header Styles */ table thead tr { height: 60px; }

table thead tr:first-of-type th:first-of-type { font-size: 2em; }

table thead tr:first-of-type th:not(:first-of-type) { background-color: transparent; color: black; }

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

Advances In Databases And Information Systems 25th European Conference Adbis 2021 Tartu Estonia August 24 26 2021 Proceedings Lncs 12843

Authors: Ladjel Bellatreche ,Marlon Dumas ,Panagiotis Karras ,Raimundas Matulevicius

1st Edition

3030824713, 978-3030824716

More Books

Students also viewed these Databases questions