gpt4 book ai didi

html - 使 iframe 成为其容器的 100% 宽度

转载 作者:太空狗 更新时间:2023-10-29 15:08:05 26 4
gpt4 key购买 nike

好的,所以我希望这个 iframe 100% 填充它的父 div,它是宽度为 900 像素的包装器,但出于某种原因我无法完成此操作

HTML

<fieldset>
<legend>Random Patch:</legend>
<iframe src="../../index.php?Patch_No='.$patches[$patch].'" frameborder="0" ></iframe>
</fieldset>';

CSS 更新语法与代码中的语法类似,但仍然不起作用我对 html 感到困惑了一秒钟,这是它的外观:http://i.imgur.com/9Jv5sFz.png

iframe {
width: 100%;
height: 500px;
}

更新 2 整个 html

<body>
<div id="wrapper">
<header>
<div id="menu"> <a href="new_patch/new_champions.php" id="new">NEW</a>
<!-- Editing patches still in works href="edit_patch.php" -->
<a id="edit" style="color: grey;" alt="Edit" title="Disabled still in works.">EDIT</a>
<a href="delete_patch.php" id="delete">DELETE</a>
<a href="logout.php" id="logout">LOGOUT</a>
</div>
</header>
<div id="sitelive">
<?php
//Generating random patch from DB
$sql="SELECT Patch_No FROM info";
$result=$ conn->query($sql);
$patches=$result->num_rows;
if($patches!=0) {
$patch = rand(1, $patches);
$i = 1;
$patches = array();
while($data=$result->fetch_assoc()){
$patches[$i] = $data['Patch_No'];
$i+=1;
}
echo '
<fieldset>
<legend>Random Patch:</legend>
<iframe src="../../index.php?Patch_No='.$patches[$patch].'" frameborder="0" height="500" width="100%" scrolling="no"></iframe>
</fieldset>';
} ?>
</div>
</div>
</body>

最佳答案

像这样更改您的 CSS: Updated Demo

iframe {
width:100%;
height:500px;
}
fieldset, legend {
margin:0;
padding:0;
width:100%;
height:100%;
}

HTML:

<fieldset>
<legend>Random Patch:</legend>
<iframe src="../../index.php?Patch_No='.$patches[$patch].'" frameborder="0"></iframe>
</fieldset>

希望这就是你想要的..

关于html - 使 iframe 成为其容器的 100% 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28986339/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com