CSS putting an item on the right side of a grid


يرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.


I would like to put the button(containing 14) on the right end of the division.
I tried justify content end
But it’s not working.
I set the background color to gray, so it’s easier to see.
My code is below.
Thanks in advance.

<html lang=”en”>
<meta charset=”UTF-8″ />
<meta http-equiv=”X-UA-Compatible” content=”IE=edge” />
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″ />
<title>Exercise 12a</title>
.line-div {
display: grid;
grid-template-columns: 300px 80px;
align-items: center;
width: 300px;
vertical-align: middle;
font-family: arial;
font-size: 19px;
background-color: gray;
margin-top: 0;
margin-bottom: 0;
background-color: gray;
vertical-align: middle;
justify-items: end;
background-color: rgb(0, 89, 255);
border-style: none;
font-family: Arial;
font-size: 18px;
color: white;
padding-left: 13px;
padding-right: 13px;
padding-top: 4px;
padding-bottom: 4px;
border-radius: 13px;
<div class=”line-div”>
<div class=”left-div”><p class=”description”>Home</p></div>
<div class=”right-div”>
<button class=”number”>14</button>

X 5 أشهر 2022-07-10T12:04:08+03:00 0 إجابة 1 مشاهدات مبتدئ 0

‫أضف إجابة


مجهول يجيب