Home >Web Front-end >CSS Tutorial >How to Make an Iframe Fill 100% of the Browser Height?
How to Make an Iframe Fill 100% of the Browser Height?
- Patricia ArquetteOriginal
- 2024-12-23 14:57:15724browse
Full-screen Iframe with a Height of 100%
Q: Is iframe height=100% supported in all browsers?
Yes, iframe height=100% is supported in all major browsers (IE, Firefox, Safari) as long as the parent element also has a height of 100%.
Q: Will it actually take the height of the remaining page?
Yes, if you have another frame on top with a fixed height (e.g., 50px), the iframe will take the height of the remaining page (100% - 50px = 50%).
Q: How do you completely hide scrollbars and set the iframe height automatically?
Option 1: Overflow: Hidden
<body>
Option 2: Position: Absolute
<body>
Tip: To hide scrollbars completely, you can set the iframe height to a slightly larger value, e.g., 150%, or use a hack to force the scrollbars outside the page, e.g., overflow-x:hidden;overflow-y:hidden.
The above is the detailed content of How to Make an Iframe Fill 100% of the Browser Height?. For more information, please follow other related articles on the PHP Chinese website!