How to change height and width of an iframe?

Member

by gilbert , in category: Javascript , 3 months ago

How to change height and width of an iframe?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by ryan.murray , 3 months ago

@gilbert 

To change the height and width of an iframe, you can use the "height" and "width" attributes within the HTML code of the iframe. Here is an example:

1
<iframe src="https://www.example.com" width="500" height="300"></iframe>


In this example, the iframe will have a width of 500 pixels and a height of 300 pixels. You can adjust these values to suit your specific requirements.


Alternatively, you can also use CSS to style the iframe and set the height and width. Here is an example:

1
2
3
4
5
6
7
8
<style>
  .custom-iframe {
    width: 500px;
    height: 300px;
  }
</style>

<iframe src="https://www.example.com" class="custom-iframe"></iframe>


In this example, the CSS class "custom-iframe" is applied to the iframe to set the width to 500 pixels and the height to 300 pixels. Again, you can adjust these values as needed.