IFrame widthProperty
Frame/IFrame Object
Definition and Usage
The width property sets or returns the value of the width attribute in an iframe element.
The width attribute specifies the width of an iframe.
Syntax
iframeObject.width=value
The width attribute can be the following values:
| Value | Description |
|---|---|
| pixels | In pixels (e.g. "100px" or "100") |
| % | As a percentage of the width (e.g. "20%") |
Browser Support
![]()
![]()
![]()
![]()
![]()
All major browsers support the width attribute
Example
Example
Change the height and width of an iframe:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example Tutorial (example.com)</title>
<script>
function changeSize(){
document.getElementById("myframe").height="300";
document.getElementById("myframe").width="300";
}
</script>
</head>
<body>
<iframe id="myframe" src="../index.html" height="200" width="200">
<p>Your browser does not support iframes.</p>
</iframe>
<br><br>
<input type="button" onclick="changeSize()" value="Change Size">
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Example Tutorial (example.com)</title>
<script>
function changeSize(){
document.getElementById("myframe").height="300";
document.getElementById("myframe").width="300";
}
</script>
</head>
<body>
<iframe id="myframe" src="../index.html" height="200" width="200">
<p>Your browser does not support iframes.</p>
</iframe>
<br><br>
<input type="button" onclick="changeSize()" value="Change Size">
</body>
</html>
Try it Yourself »
Frame/IFrame Object Other Extensions