相关疑难解决方法(0)

这是代码:

<div style="width:400px">
    some text..
    <input type="text" />
    <button value="click me" />
</div>

如何使输入元素展开以填充所有剩余空间,同时保持在同一条线上？如果我把它100%放到它自己的线上......

我们正在使用最新的Chrome和Windows 10，

69.0.3497.100 (Official Build) (32-bit)

在某些监视器上，缺少边框的“选择/下拉”控件。有时候这是正确的；然后当我使用宽度播放时（将其设为px而不是百分比，增加更多的宽度），它将变为最底端。

但是在其他监视器上，此“选择/下拉”始终很好。它始终具有所有边界。从来没有任何问题。

所有显示器的分辨率均为1920 x 1200（在Windows 10中建议使用），无论有没有此问题。经过不同缩放比例测试-100％，80％，120％。有些用户（总是）有这个问题，或者（永远）没有，都使用相同的浏览器，并且没有缩放级别。

控件上没有特殊的CSS样式。实际上，即使我要添加border: 1px solid它也不会影响系统选择区域。这只会影响顶级框。

我能找到的最接近的东西是，很久以前，Chrome就在2012年出现了一个错误，但已经修复了很久，因此我们无法使用此信息。

Chrome有时不显示边框

有什么想法吗？

<hr>我的网站上的 某些标签有问题。
参考图像

正如你在这个非常简单的小提琴看到https://jsfiddle.net/bau1hp9L/的<hr>标签不都呈现相同的高度。

的 CSS<hr>非常简单，所以不会受到其他东西的干扰......

hr {
  border: 0;
  height: 1px;
  background-color: #243588;
}

关于为什么会发生这种情况的任何想法？

我希望所有的<hr>都具有 1px 的高度。

更多信息：

我知道它是一个子像素计算的东西，我阅读了另外两个关于它的 SO（1 , 2），但是，我想知道是否有一个优雅的解决方案专门针对这种情况而不改变规范（因为我知道我是否添加了额外的填充在父容器周围会避免它）。 https://codepen.io/adamchenwei/pen/GxKZpd 如果框具有 1 像素宽度的边框，并且悬停效果的背景颜色会在用户放大 50% 时以某种方式覆盖边框本身 *注意：我确实意识到我正在处理的实际组件，当我放大 75% 左右时它会消失，所以请在将光标悬停在每个项目上时尝试不同的百分比，以查看右侧和底部的边框何时在特定缩放级别消失，并非所有缩放级别都会观察到它！

工作站：

我正在使用最新的 Chrome 浏览器在 15.4 英寸的 Macbook pro 上工作。

CSS

.container {
  border-width: 1px;
  border-color: lightgray;
  border-style: solid;
}

.aaa {
  &:hover {
    background-color: beige;
  }
}

HTML

<div class='container'>
  <div class='aaa'>abc</div>
  <div class='aaa'>abc</div>
  <div class='aaa'>abc</div>
</div>