html - 在父 div 中,我还有两个元素。如果我删除了一个然后元素的其余部分不垂直居中对齐

标签 html css

在父元素中我还有两个元素。如果我删除了一个,则元素的其余部分不会垂直居中对齐。

h3 {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: table;
  max-width: 115px;
  padding: 0px 6px;
  vertical-align: middle;
}
h3 a {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  float: left;
}
<h3>
  <a href="#">Nathan</a>
  <a href="#">sdfsdfsdf</a>
</h3>

最佳答案

您正在使用 float:left; 以及 display: table-cell;。两者都使用是没有意义的。如果您要使 h3 具有 display: table;,则 display: table-cell; 足以让您获得 float 影响。您需要将其删除才能获得您要查找的内容。

例如,

h3 a {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  }

LIVE DEMO

希望这对您有所帮助。

关于html - 在父 div 中,我还有两个元素。如果我删除了一个然后元素的其余部分不垂直居中对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30300130/

相关文章:

html - 为什么我的按钮和它的边框之间有一个空白?

javascript - 仅打印网页的一部分

android - 更改 Android PopupMenu 文本颜色不起作用

css - 在我网站的顶部菜单中写希伯来语

css - 如何将复杂的xpath转换为css

javascript - HTML:停止在 div 中呈现 HTML 代码

javascript - 如何在 JavaScript 中为函数添加时间延迟?

html - z-index 只影响同一组内的元素吗?

html - 带提交按钮的 CSS 填充问题

css - HTML/CSS : Keep Hovered Image in Menu Title While Hovered Over Submenu