min-width的“权重”问题

在用公司内部的组件库的list组件的时候，组件的菜单栏是允许拖动的，当在不同浏览器中使用的时候，发现谷歌、火狐、IE或者edge在被拖动一定的宽度后，将不能继续被拖动，通过审查元素，发现了该元素设置了min-width为80px的属性，怪不得在被拖动到一定的宽度后就不能继续拖动了。但是我又发现此元素上还有一个width的属性为50px，而且是没有被划掉的状态，也就是说这个width的属性是生效的，但是没有起作用，也就是说被min-width覆盖了，此时引起了我对权重的思考。

以下是我写了一个简单的demo以及效果图

   

发现，浏览器中都出现了min-width把width属性覆盖的情况，此时我想会不会是权重的问题，我把min-width放在属性的第一行，width放在最后，结果依然如此。随后我又在width的后边加上了!important，但是最终的结果还是没有改变。我又试了一下max-width，得到了相同的结论。

由此，可知min-width和max-width的“权重”在宽度界是最大的，此时的我，有一个想法，如果想给一个元素固定宽高并且不想被别人轻易覆盖掉的话，可以使用这个属性，即直接设置该元素的min-width和max-width为同一个值以及min-hight和max-height为同一个值即可。