I'm trying to get https://vscode.dev/ to pop up and take up the entire page when I click on the icon, but instead it seems to be only taking up the top part of the page. how can i fix this?
var div = document.getElementById("content");
while(div.firstChild) {
div.removeChild(div.firstChild);
}
document.getElementById("vscode").height = "100%";
document.getElementById("vscode").width = "100%";
}```
Elements are not 100% height by default and child elements are dependent on the parent height.
So you need to set the height of the parents including html and body elements to 100% height if you want a child to be 100% height.
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
#vscode {
width: 100%;
height: 100%;
border:0
}<iframe src="https://vscode.dev/" id="vscode"/>Additionally, you could use 100vh