Html CSS网格中的嵌套

为什么对齐自/对齐自：开始/中心/结束（或任何变体）在我的“nestedheader”容器中工作。我试图把标题框放在左手边，但我觉得它应该已经在网格中了

.header{
网格区域：标题；
背景色：#22222；
}
.nestedheader{
显示：网格；
网格模板列：重复（4，1fr）；
网格自动行：70px；
栅隙：20px；
网格模板区域：“headername headername headercopy headercopy”“headername headername headercopy headercopy”；
颜色：白色；
字体系列：“Rubik”，无衬线；
}
海德纳姆先生{
网格区域：headername；
字体大小：30px；
右边填充：20px；
边框：5px纯红；
自我辩护：开始；
}
.头颅镜{
网格区域：头镜；
字体重量：较轻；
右边填充：20px；
边框：5px纯红；
}

---

这是代码笔：

您的代码很好。唯一没有检查的是

.header

和

.nestedheader

的大小。 他们没有填满第一排

查看header和nestedheader上的更改。我只需将

宽度设置为100%


html，正文{
保证金：0；
字体大小：100%；
}
.集装箱{
显示：网格；
网格模板列：重复（4，1fr）；
网格模板行：最小最大值（100px，自动）；
栅隙：7px；
网格模板区域：
“标题”
“主介绍主介绍”
“主介绍主介绍”
“底部”
“底部”
“页脚页脚”；
文本对齐：居中；
}
.container>div{
填充物：5px；
边框：3倍实心#22222；
显示器：flex；
对齐项目：居中；
证明内容：中心；
颜色：#2B0E24；
}
/*---标题开始--*/
.标题{
网格区域：标题；
框大小：边框框；
宽度：100%；
背景色：#22222；
}
.nestedheader{
框大小：边框框；
宽度：100%；
身高：100%；
显示：网格；
网格模板列：重复（4，1fr）；
栅隙：20px；
网格模板区域：
“headername headername headercopy headercopy”；
颜色：白色；
字体系列：“Rubik”，无衬线；
}
海德纳姆先生{
网格区域：headername；
字体大小：30px；
右边填充：20px；
边框：5px纯红；
}
.头颅镜{
网格区域：头镜；
字体重量：较轻；
右边填充：20px；
边框：5px纯红；
}
/*---收割台端--*/
.介绍{
网格区域：简介；
高度：450px；
}
梅因先生{
网格区域：主；
高度：450px；
}
.底部{
网格区域：底部；
高度：800px；
}
.页脚{
网格区域：页脚；
高度：325px；
背景色：#22222；
颜色：白色；
}
/*---页脚开始--*/
.页脚文本{
颜色：白色；
字体系列：“Rubik”，无衬线；
字体大小：30px；
}
.页脚链接{
字体大小：16px；
字体重量：较轻；
}
a{
颜色：#20bde5；
文字装饰：无；
填充：10px；
}
a:悬停{
颜色：白色；
}
/*---页脚结束---*/

标题名
这是复印件
简介
主要
底部
我们开始…


你的代码很好。唯一没有检查的是
.header
和
.nestedheader
的大小。
他们没有填满第一排

查看header和nestedheader上的更改。我只需将
宽度设置为100%


html，正文{
保证金：0；
字体大小：100%；
}
.集装箱{
显示：网格；
网格模板列：重复（4，1fr）；
网格模板行：最小最大值（100px，自动）；
栅隙：7px；
网格模板区域：
“标题”
“主介绍主介绍”
“主介绍主介绍”
“底部”
“底部”
“页脚页脚”；
文本对齐：居中；
}
.container>div{
填充物：5px；
边框：3倍实心#22222；
显示器：flex；
对齐项目：居中；
证明内容：中心；
颜色：#2B0E24；
}
/*---标题开始--*/
.标题{
网格区域：标题；
框大小：边框框；
宽度：100%；
背景色：#22222；
}
.nestedheader{
框大小：边框框；
宽度：100%；
身高：100%；
显示：网格；
网格模板列：重复（4，1fr）；
栅隙：20px；
网格模板区域：
“headername headername headercopy headercopy”；
颜色：白色；
字体系列：“Rubik”，无衬线；
}
海德纳姆先生{
网格区域：headername；
字体大小：30px；
右边填充：20px；
边框：5px纯红；
}
.头颅镜{
网格区域：头镜；
字体重量：较轻；
右边填充：20px；
边框：5px纯红；
}
/*---收割台端--*/
.介绍{
网格区域：简介；
高度：450px；
}
梅因先生{
网格区域：主；
高度：450px；
}
.底部{
网格区域：底部；
高度：800px；
}
.页脚{
网格区域：页脚；
高度：325px；
背景色：#22222；
颜色：白色；
}
/*---页脚开始--*/
.页脚文本{
颜色：白色；
字体系列：“Rubik”，无衬线；
字体大小：30px；
}
.页脚链接{
字体大小：16px；
字体重量：较轻；
}
a{
颜色：#20bde5；
文字装饰：无；
填充：10px；
}
a:悬停{
颜色：白色；
}
/*---页脚结束---*/

标题名
这是复印件
简介
主要
底部
我们开始…


请同时发布您的HTML部分好吗？请同时发布您的HTML部分好吗？