你好，我想知道如何让我的div容器的高度更小，但保持文本居中？下面是它的一个图像。减小div容器的大小
我的CSS迄今这个div是，
.contactdet {
background: rgba(255,255,255,0.1); // transparent white
background: #fff; // Left as a fallback for older browsers
color: #FFFFFF;
vertical-align: middle;
}
http://www.webbmaster.com.au/web-programs/questdesign/index.php/contact
对于初学者来说，你可以删除t之上和之下的空白段落分机。如果你检查的元素，你会看到以下内容：
<div class="custom contactdet">
<p> </p>
<p style="text-align: center;">
<span style="font-size: medium;">[email protected] ● (03) 9014 4882 ● 0413 859 064</span>
</p>
<p> </p>
</div>
你有2个<p>标签与他们没有任何内容。
一旦取消，您可以添加一个小填充像这样：
.custom.contactdet > p {
padding: 5px 0;
}
您需要添加一个height财产
.contactdet {
background: rgba(255,255,255,0.1); // transparent white
background: #fff; // Left as a fallback for older browsers
color: #FFFFFF;
vertical-align: middle;
height:30px; /* Change this to the height you want*/
}
没有好。当我这样做时，它与底部的div容器合并。 http://www.webbmaster.com.au/web-programs/questdesign/index.php/contact – 2015-02-11 23:25:37
这种方法的问题是它不是动态的。如果字体大小曾经改变或者添加了更多内容，则高度不会相应地调整，并且必须再次手动改变。 – Lodder 2015-02-11 23:34:53
@Lodder这是真的，但OP要求设置一个高度。如果内容填满，则添加填充可能会导致较高的页脚。 OP没有提到动态的需要。当然，使用填充而不是固定高度更好。 – 2015-02-11 23:38:01
Firstable清洁你的容器。删除这两个<p> </p>是的<div class="custom contactdet"> 内之后，只需要添加“高度”和line-height到类：
.contactdet {
background: rgba(255,255,255,0.1); // transparent white
background: #fff; // Left as a fallback for older browsers
color: #FFFFFF;
vertical-align: middle;
height:35px;
line-height:35px
}
完成了。非常感谢。 – 2015-02-11 23:32:35
@EndôFujimoto - 不客气;） – Lodder 2015-02-11 23:33:43