gpt4 book ai didi

css - 在 div 中心顶部对齐文本

转载 作者:太空宇宙 更新时间:2023-11-04 13:37:23 26 4
gpt4 key购买 nike

我试图首先将一个 div 对齐到中心。在那个 div 里面是另外 3 个 div,里面有一些文本,我想将该文本对齐到内部 div 的中心顶部。

我写了这个 jsbin 网页,但内部文本不是在顶部居中,而 out div 不是居中

http://jsbin.com/beyuhaxe/1/

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>

<div id="all">
<div id="uno" class="try">
<p>try1</p>
</div>

<div id="dos" class="try">
<p>try2</p>
</div>

<div id="tres" class="try">
<p>try3</p>
</div>
</div>

</body>
</html>

CSS

#uno{
background-color: lightblue;
width:100px;
height:50px;
}

#dos{
background-color: lightgreen;
width:100px;
height:50px;
}

#tres{
background-color: red;
width:100px;
height:50px;
}

#all{
width:400px;
margin: auto;
}

.try {
position:relative;
float: right;
margin-right:10px;
text-align:center;
}

最佳答案

Math (400-300)/4 = 25px 在你的内部 div 上等间距。

.try {
position:relative;
float: right;
margin-right:25px;
text-align:center;
}

此外,进行 css 重置将帮助您确保在某处没有其他边距或填充。

关于css - 在 div 中心顶部对齐文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22942721/

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