我怎样才能从中删除边框<video>标签？

Question

I have a video on my website and everything looks fine on desktop. However, on iPhone (I'm using Chrome) there is a border. I've tried the solutions posted here , but none have worked so far (I'm using Bootstrap 4).

My code:

 video { -webkit-mask-image: -webkit-radial-gradient(white, black); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -webkit-appearance: none } .medio-pago-img-container, .national-video { border: none; outline: none !important; box-shadow: none; }

 <div class="col-lg-6 col-md-12 col-sm-12 col-xs-12 col-12 medio-pago-img-container text-center"> <video src="images/phone-national.mp4" class="national-video" id="nationalVideo" type="video/mp4" width="464" height="500" muted autoplay loop playsinline>Your browser does not support the video tag</video> </div>

I tried taking a screenshot of my iPhone screen but the borders are not shown in the screenshot, so I took a picture of my phone.

Answer 1

The answer given by @cssyphus above worked. I added outline: unset; and the border is gone.