Css level 16 lesson 3

Question

Css level 16 lesson 3

<!DOCTYPE html>
<html>
<head>
<title>CSS Grid Template</title>
<style>
.grid {
display: grid;
background-color: #d6d1f5;
padding: 20px;

}
.item {
background-color: #E7E4F8;
border: 1px solid black;
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<div class="grid">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
<div class="item">9</div>
</div>
</body>
</html>

css-course

2 years ago by shantnu4755

1 Answer

Login / Signup to Answer the Question.

Login Signup

**sam5epi0l** · Answer 1 · 2023-06-17T11:49:48

I think you need to fix grid element css. Here is how:



<!DOCTYPE html>

<html>

<head>

        <title>CSS Grid Template</title>

        <style>

                .grid {

                        display: grid;

                        background-color: #D6D1F5;

                        padding: 20px;

                        grid-template-columns: [start] 50px [line2] auto [line3] 25% [end];

                        grid-template-rows: 150px 15% auto;

                }

                .item {

                        background-color: #E7E4F8;

                        border: 1px solid black;

                        padding: 20px;

                        text-align: center;

                }

        </style>

</head>

<body>

        <div class="grid">

                <div class="item">1</div>

                <div class="item">2</div>

                <div class="item">3</div>

                <div class="item">4</div>

                <div class="item">5</div>

                <div class="item">6</div>

                <div class="item">7</div>

                <div class="item">8</div>

                <div class="item">9</div>

        </div>

</body>

</html>

C TUTORIAL

C PROGRAMS

INTERVIEW TESTS

EXECUTE CODE

C++ TUTORIAL

C++ PROGRAMS

INTERVIEW TESTS

EXECUTE CODE

PYTHON TUTORIAL

PYTHON HOW TOS

INTERVIEW TESTS

EXECUTE CODE

JAVA TUTORIAL

JAVA CODE EXAMPLES

SPRING TUTORIAL

MORE IN JAVA

COMPUTER ARCHITECTURE

COMPUTER NETWORK

OPERATING SYSTEM

DBMS & SQL

PL/SQL

MongoDB

EXECUTE SQL

ANDROID DEVELOPMENT

GO LANGUAGE

LINUX

DOCKER

HTML TAGS (A to Z)

CSS REFERENCES

SASS/SCSS

KOTLIN

GAME DEVELOPMENT

PHP

GIT GUIDE

JAVASCRIPT

ADVANCED DSA

Css level 16 lesson 3

1 Answer

Login / Signup to Answer the Question.