我看了你的问题和代码，Tooltip被Header Tab遮挡的核心原因大概率是Header的层级（z-index）比Tooltip更高，或者Tooltip的定位上下文导致它被限制在父元素范围内。咱们一步步来解决：

1. 提升Tooltip的层级优先级 #

你已经给Tooltip加了z-index: 200，但可能Header的z-index比这个值更高。可以把Tooltip的z-index调得更高，比如设成9999（这个值足够高，一般不会被其他元素覆盖）：

.showmeonhover {
  display: none;
}

.label-input100:hover .showmeonhover {
  display: inline;
  width: auto;
  background-color: #555; /* 统一背景色，去掉重复设置 */
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 5px 6px; /* 合并内边距，简化代码 */
  position: absolute;
  margin-left: -100px;
  margin-bottom: -18px;
  z-index: 9999; /* 大幅提高层级，确保覆盖Header */
  font-size: 8px !important;
  text-transform: capitalize !important;
}

2. 降低Header Tab的层级（可选补充） #

如果上面的方法还没解决问题，就给Header Tab设置一个明确的、比Tooltip低的z-index：

.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin: 2px 0 0 0;
  padding: .5em .5em .5em .7em;
  font-size: 100%;
  z-index: 100; /* 确保比Tooltip的9999低 */
}

3. 确认定位上下文 #

另外要检查.label-input100这个父元素有没有设置position: relative，如果没有的话，Tooltip的position: absolute会相对于最近的有定位的父元素（甚至是body），可能位置偏移导致被遮挡。如果需要，给父元素加上：

.label-input100 {
  position: relative; /* 让Tooltip相对于它定位，避免位置错乱 */
}

试一下这几个调整，应该就能让Tooltip正常显示在Header Tab上方了！

内容的提问来源于stack exchange，提问作者AM I IDIOT