rounded corners on html5 video

by

Create a div container with rounded corners and overflow:hidden. Then place the video in it. 

<style>
.video-mask{
    width: 350px;
    border-radius: 10px; 
    overflow: hidden; 
}
</style>


<div class="video-mask">
    <video></video>
</div>

More Related Contents:

  1. Background color not showing in print preview
  2. Blurry text after using CSS transform: scale(); in Chrome
  3. CSS Border radius not trimming image on Webkit
  4. CSS3 – How to style the selected text in textareas and inputs in Chrome?
  5. Chrome / Safari not filling 100% height of flex parent
  6. How can I force WebKit to redraw/repaint to propagate style changes?
  7. css transform, jagged edges in chrome
  8. HTML5 video will not loop
  9. Webkit CSS to control the box around the color in an input[type=color]?
  10. Bug with transform: scale and overflow: hidden in Chrome
  11. Webkit bug with `:hover` and multiple adjacent-sibling selectors
  12. webkit-transform overwrites z-index ordering in Chrome 13
  13. content attribute of img elements
  14. HTML 5 Video “autoplay” not automatically starting in CHROME
  15. CSS3 calc(100%-88px) not working in Chrome [duplicate]
  16. Disable download button for Google Chrome?
  17. WebKit CSS content Unicode bug?
  18. How to keep a flex item from overflowing due to its text? [duplicate]
  19. “CAUTION: provisional headers are shown” in Chrome debugger
  20. When running WebDriver with Chrome browser, getting message, “Only local connections are allowed” even though browser launches properly
  21. Debugging WebSocket in Google Chrome
  22. Favicon not showing up in Google Chrome [duplicate]
  23. Webkit-based blurry/distorted text post-animation via translate3d
  24. How to disable CSS in Python selenium using ChromeOptions
  25. Freeze screen in chrome debugger / DevTools panel for popover inspection?
  26. How to download a CRX file from the Chrome web store for a given ID? [closed]
  27. programmatically changing webkit-transformation values in animation rules
  28. Add text above HTML5 Video
  29. chrome could play html5 mp4 video but html5test said chrome did not support mp4 video codec
  30. Image scaling by CSS: is there a webkit alternative for -moz-crisp-edges?

Leave a Comment