时间戳

首页 > 解决方案 > 我在 GRID 中的位置不起作用

css - 我在 GRID 中的位置不起作用

问题描述

我似乎无法解决为什么它没有将我的内容放在网格第二行中所需的第二列中。代码如下：

body {
	display: grid;
	grid-template-columns: 1fr 2fr 2fr 1fr;
	grid-template-rows: 1fr 2fr 2fr 2fr;
	width: 100%;
	height: 100%;
}

header.hdr {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: 100%;	
 	grid-column: 1 / 5;
 	background-color: grey;
 }

 p.lhs-txt {
 	width: 100%;
 	font-size: 2em;
 	display: flex;
 	height: 20rem;
 	grid-area: 2 / 2 / 4 / 4;
 }
<body>
	<header class="hdr">
		<h1> Main header of the page</h1>
	</header>
	<section class="sect">
		<p class="lhs-txt"> Lee Man-hee, the leader of the Shincheonji Church of Jesus, got on his knees and bowed at a news conference.
		About 60% of the country's more than 4,000 confirmed cases are sect members.  </p>
		<img src="logo.png" width="150rem">
		<p> On Monday, South Korea - the biggest hotspot outside China - reported 476 new cases, bringing the total number to 4,212. It has recorded 26 deaths. </p>
		<p>Prosecutors have been asked to investigate Mr Lee on possible charges of gross negligence. "Although it was not intentional, many people have been infected," said the 88-year-old leader. </p>
		<p>"We put our utmost efforts, but were unable to prevent it all." </p>
     </section>
</body>

请指出正确的方向，为什么它没有放在我想要的位置。谢谢你们..

标签： csscss-grid

解决方案

推荐阅读