Bug 131166 - :-webkit-full-screen fails when ancestor has float (and more css issues)
Summary: :-webkit-full-screen fails when ancestor has float (and more css issues)
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebCore Misc. (show other bugs)
Version: 528+ (Nightly build)
Hardware: Mac OS X 10.9
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2014-04-03 09:09 PDT by Guy
Modified: 2022-11-24 21:36 PST (History)
0 users

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Guy 2014-04-03 09:09:04 PDT
Detected when using <video> inside these bootstrap classes - modal (fixed) > container > row > col-md-X (float).
When switching the video to fullscreen it did not show well and the video itself was actually positioned below the visible area of the screen.

I looked at the css -
https://code.google.com/p/webkit-mirror/source/browse/Source/WebCore/css/fullscreen.css?name=master
and although I didn't fully understand why it uses static positioning (rather than fixed) these rules seemed incomplete.
My workaround was to add these custom css rules that fixed the display (though I'm no expert if it has other side-effects).
It might be worth fixing somehow in the original webcore css.

/* make ancestors show fullscreen and cancel float */
:-webkit-full-screen-ancestor:not(iframe) {
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	height: 100% !important;
}
/* hide fullscreen siblings */
:-webkit-full-screen-ancestor > *:not(:-webkit-full-screen):not(:-webkit-full-screen-ancestor) {
	display: none !important;
}

Thanks,
Guy