gpt4 book ai didi

html - 将 flex 元素堆叠在一起

转载 作者:搜寻专家 更新时间:2023-10-31 22:37:35 24 4
gpt4 key购买 nike

<分区>

如何简单地在单独的行中显示 h3 标签和 p 标签,并在顶部显示 h3 标签?

这段代码是一个更大元素的一部分,我知道还有其他方法可以在不同的行中将元素定位在中心,但我不想影响它的父元素(更大元素的)并且想要使用更简单的 flex 盒子。

.hover-over-windows-style {
height: 100%;
background: red;
/* Fails because h3 and p tags are not on separate lines */
display: flex;
align-items: center;
/* padding-top of 25% nearly works but content isnt in centre of parent div */
}

#parent {
height: 300px;
width: 300px;
}
<div id="parent">
<div class="hover-over-windows-style">
<h3><a href="matches/blitz.html">H3 Tag on top</a></h3>
<p>Paragraph here should be below the H3 tag, on a separate line. Not sure how to get this done. Setting 100% widths don't work and cannot display as block elements.</p>
</div>
</div>

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com