gpt4 book ai didi

html - 灵活的 html 模型与对齐

转载 作者:太空宇宙 更新时间:2023-11-04 14:16:52 24 4
gpt4 key购买 nike

我的结构如下:

<style>
#main{
max-width: 500px;
margin: 0 auto;
overflow: hidden;
border: 1px solid red;
}
#container{
margin-right: -50px;
}
.block{
display: inline-block;
width: 100px;
height: 100px;
border: 1px solid grey;
margin-right: 30px;
}
</style>
<div id="main">
<div id="container">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
</div>

如果我有宽宽度它看起来像 http://i.stack.imgur.com/3I1yM.png没关系。

但是如果我使用 narrow 就很糟糕了我需要内部 block 像这样对齐到中心

http://i.stack.imgur.com/5GXMJ.png

最佳答案

您好,您需要的是属性text-align:center:

#container{
margin-right: -50px;
text-align:center;
}

演示 http://jsfiddle.net/u5HHc/

关于html - 灵活的 html 模型与对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20287488/

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