Html overlay question

Say I had a normal clip I’d like to overlay some text with html, the html layer/text always appears top left…

Is there an easy way to position this html layer? center, or drag it around?

Thanks.

Use something like the following:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style> 
	html, body {margin:0; padding:0; border:0; background-color: transparent;}
	#parent {display: table;  width:100vw; height: 100vh; border:0; border-collapse: collapse;}
	#child  {display: table-cell; width:100vw; height: 100vh; margin: 0; padding:0; border:0;
			text-align: center; vertical-align: middle; overflow: hidden;
			color: #ff0000;}
</style>
</head>
<body>
	<div id='parent'>
		<div id='child'>
			THIS TEXT SHOULD BE CENTRED ON THE PAGE
		</div>
	</div>
</body>
</html>

There are other ways, but this is probably the easiest if you don’t know the size of the “child” div.

1 Like

That answered my question… so no special on screen controls, just do the positioning in css.
Thanks for the response.