Question

作为一个初学者，这个错误似乎很奇怪，由于我不能将所有代码都放在这里（大），所以我什至会很高兴听到从哪里开始。如果需要更多代码，我会提供。

我有这个：

<div class="labeledInput">
  <label class="font">Tap To Add Your Photo:</label>
  <div class="imagePreview logoPreview" id="logoPreview" style="background-image: url(images/Holder.png);">
    <input type="file" id="logoPreview">
  </div>
</div>

如果我删除此行（并且仅删除此行）：

<div class="imagePreview logoPreview" id="logoPreview" style="background-image: url(images/logoHolder.png);">

或什至从其中删除类imagePreview，或将其设置为完全不带类：

<div class="logoPreview" id="logoPreview" style="background-image: url(images/logoHolder.png);">

然后另一个button，它是遥远，在单击时变成文件上传按钮，而不仅仅是单击时滚动（使用JS）的按钮。

这是受影响的按钮（与上面的代码完全无关）：

<div class="nextButton">
  <input type="image" src="https://picsum.photos/50/50" onclick='nextButton()'/>
</div>

编辑：

我发现在CSS中，如果删除此样式，则不会发生该错误：

.imagePreview img
{
  max-width: 100%;
  pointer-events: none;
}

//***** this one if removed solve the problem but make an ugly button*****
[type="file"] {
  cursor: pointer;
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

Answer 1

将position作为relative添加到父类

.imagePreview{    
    position: relative;
}

删除一个div或一个类会影响另一个div

1 个答案: