38 lines
2.0 KiB
HTML
38 lines
2.0 KiB
HTML
|
<!DOCTYPE>
|
||
|
|
<html>
|
||
|
|
<style>
|
||
|
|
#element-container-vmax {
|
||
|
|
background:green;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div id="element-container-vmax">TEST PASSED</div>
|
||
|
|
<script>
|
||
|
|
function applyStyle() {
|
||
|
|
var viewportMaxLength = Math.max(window.innerWidth, window.innerHeight);
|
||
|
|
var elementStyle = document.getElementById("element-container-vmax").style;
|
||
|
|
elementStyle.height = Math.floor(30 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.width = Math.floor(30 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.fontSize = Math.floor(3 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.lineHeight = Math.floor(4 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.textIndent = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.marginLeft = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.marginRight = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.marginTop = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.marginBottom = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.borderTopLeftRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.borderTopRightRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.borderBottomLeftRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.borderBottomRightRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.paddingLeft = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.paddingRight = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.paddingTop = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.paddingBottom = Math.floor(2 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.minHeight = Math.floor(10 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.minWidth = Math.floor(10 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.maxHeight = Math.floor(60 * viewportMaxLength / 100) + "px";
|
||
|
|
elementStyle.maxWidth = Math.floor(60 * viewportMaxLength / 100) + "px";
|
||
|
|
}
|
||
|
|
applyStyle();
|
||
|
|
</script>
|
||
|
|
</html>
|