在div中使图标和跨度垂直居中[重复]
结构是这样的：
css prettyprint-override">css
.toolBarHolder {
height: 42px;
line-height: 42px;
}
<div class='toolBarHolder'>
<icon class='toolBarIcon'>near_me</icon>
<span class='toolBarText'>lake area</span>
</div>
共有1个答案
只需赋予属性display：flex；对齐-项目：居中；justify-content：center；到.toolbarholder。没有必要使用线高；
应该是这样的：
css
.toolBarHolder {
height: 42px;
display:flex;
align-items:center;
justify-content:center;
}
P.D.：由于我们使用的是justify-content:center，因此还必须设置宽度（div内容也是水平居中的）。
-
我在父div中的图标居中（垂直和水平）存在问题。我的页面上有许多大小不同的父div，因此我希望能够按比例将图标放置在每个父div的中心。下面是一个JSFIDLE问题： JSFIDLE公司 HTML CSS
-
问题内容： 是否可以将 div 垂直居中于％height div中 ？ 问题答案： 在这里以及整个Internet上，已经被要求足够多次了。 快速搜索将为您带来大量结果。无论如何，我这样做的首选方式是使用和。
-
问题内容： 是否可以将div垂直居中放置在％高度div中？ 问题答案： 在这里以及在整个Internet上，已经被要求足够多次了。快速搜索将为您带来大量结果。无论如何，我这样做的首选方式是使用和。有关示例，请参见此页面。（请注意，这不适用于IE6。）
-
我如何让图像垂直居中Div/Row.我已经搜索过了，但所有的解决方案似乎都指向这是一个好的解决方案——但它对我不起作用。我正在使用Bootstrap 3... https://www.bootply.com/vQFalT6KxG
-
问题内容： 我弹出一个包含ASP.NET表单的弹出窗口，单击链接“请求信息”，然后出现该表单。 但是，具有链接“请求信息”以触发弹出窗口的页面包含很多内容，因此需要滚动才能看到该链接。 如果用户滚动阅读内容，则需要始终居中，否则，如果他们不滚动，弹出窗口仍将居中显示在屏幕上。 在绝对定位，整个页面宽度与边距设置为。 问题答案： 如果div具有固定的宽度和高度，请使用：（如果width = 120p
-
问题内容： 有没有办法在 垂直和水平方向上输入一个DIV， 但这很重要， 当窗口小于内容时，内容将不会被剪切 。div必须具有背景色，宽度和高度。 我总是将div的中心定位为绝对位置和负边距，如提供的示例所示。但是它有一个问题，那就是削减内容的顶部。有没有一种方法可以将div.content居中而不会出现此问题？ CSS： HTML： 我的问题不是重复的“如何在水平和垂直方向上居中放置元素？”1-