HTML文件输入不尊重溢出隐藏

时间:2021-12-04 19:37:11

I have a file input element inside of a div with a border-radius and overflow set to hidden, but for some reason I am able to activate the file input by clicking in the area the border-radius cuts off.

我在div中有一个文件输入元素,边框半径和溢出设置为隐藏,但由于某种原因,我可以通过单击border-radius切断的区域来激活文件输入。

JS Fiddle: http://jsfiddle.net/7consvgu/1/

JS小提琴:http://jsfiddle.net/7consvgu/1/

1 个解决方案

#1


2  

I have updated your code is JSFiddle - [https://jsfiddle.net/7consvgu/4/][1]
    * Changes: Input width added: 100%;
    * Border-radius: same as circle
    * Box-sizing: border-box for all elements for normalize
    * Padding: to align text horizontal & vertical center

#1


2  

I have updated your code is JSFiddle - [https://jsfiddle.net/7consvgu/4/][1]
    * Changes: Input width added: 100%;
    * Border-radius: same as circle
    * Box-sizing: border-box for all elements for normalize
    * Padding: to align text horizontal & vertical center