html不打开控制台点击事件失效

我在做文件上传时，希望通过a标签时文件选择按钮变得美观，所以讲a标签与input标签重叠。

<div class="hand_file" style="width:500px;">
      <a href="javascript:;" id="upload" class="a-upload mr10 hand_a">
      <input type="file" name="myFile" id="myFile" class="upload_input">点击这里上传作业</a>
      <h5 class="showFileName hand_h5"></h5>
      <button type="button" class="btn hand_btn" id="uploadBtn" onclick="uploadWorkAjax()">上交实验作业</button>
</div>

为了将input与a重叠，我在css中将input设为position:absolute; 并通过控制台得到想要的位置。

所以就有了标题的“效果”，每当我不打开控制台时，input标签没与a重叠，点击a标签当然不会触发input点击事件；当我打开控制台时（宽度与之前一样），点击事件又能触发。

哈哈哈，被自己坑了好久。