防止 Flexbox 中的 div 通过附加内容改变宽度

Answer 1

尝试改变这样的风格，

.variable-input-container {
  display: flex;
  flex-direction: row;
  position: relative;
}
.var-input {
  flex-grow: 1;
  white-space: nowrap;
  overflow: auto;
  font-size: 14px;
  height: 34px;
  border: 1px solid #cfcfcf;
}
.var-input-span {
  padding: 6px 12px;
  padding-left: 14px;
  width: 100%;
  max-width: 300px; /* Set a reasonable max-width */
  display: inline-block;
  outline: none;
  overflow: auto;
}