Video Header Fullscreen

My header is a video in 1920x1080 but still have black space in the sides, is there a recommanded size or a way I can make it fullscreen ? Thanks.
My website :

Hello there,

I hope you are doing well today.

What is the aspect ration of the video?
The size of the container in seems to be 1920×1080 but the video does not seem to be 1920x1080.

Best Regards,

Well I checked, the source is 1920x1080 (so 16:9 ratio) and then I uploaded it on youtube so there shouldn’t be any modification ?

hey there

Hope you are having a good day and thank you for your question :slight_smile:
Please add this CSS in appearance - customize - additional CSS

.home #header .bottom-header {
padding-top: 212px;
.home #header .top-header {
padding-top: 0px;
padding-bottom: 0px;

Colorlib Support Team


Thanks for your answer, but the probleme is on left and right I stil have black spaces :confused:
There is a screenshot.

If it can help (i’m a novice in css) I searched and tried this :

.home #header .top-header {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;	

It make it fullscreen but it mess up the placement of the video and text, here are screenshots :


I forward this issue to the dev team, they will respond asap.

Let us know,


Thank you, is there any other theme that I can use with fullscreen video header / responsive ?

You can check all of our themes here:

i suggest trying Shapaley :slight_smile:

Well I tried Shapely but now when I try to activate the “Shapely Companion” Plugin I have this error :
Fatal error: Cannot redeclare shapely_companion_dashboard_widget() (previously declared in /htdocs/wp-content/plugins/illdy-companion/illdy-companion.php:34) in /htdocs/wp-content/plugins/shapely-companion/shapely-companion.php on line 37


Please deactivate illdy companion plugin :wink: