英文:
CSS Style not being applied completely
问题
我正在尝试通过使用 right : -80px; 来裁剪嵌套在 iframe 中的网站的右侧。一切似乎都正常，但右侧的裁剪没有生效。
我已经尝试过：
- 将
right和left更改为margin-right和margin-left - 通过按 Ctrl+F5 来执行“完全刷新”浏览器
- 尝试将值从 -80px 更改为不同的值，以查看是否有效
- 使用 Edge 和 Firefox 进行测试
英文:
I am trying to crop the right side of the embedded website within the iframe with right : -80px;. Everything seems to work but the cropping of the right side.
<html lang="en">
<body>
<style>
#div-id{
border : 2px solid blue;
width : 600px;
height : 800px;
position : relative;
overflow : hidden;
}
#iframe-id{
position : absolute;
top : -160px;
right : -80px;
left : -25px;
width : 620px;
height : 450vh;
}
</style>
<div id="div-id">
<iframe title="example" src="https://example.org" id="iframe-id" scrolling="yes"></iframe>
</div>
</body>
</html>
I've tried to:
- change the
rightandlefttomargin-rightandmargin-left - "Full"-refreshed the browser via ctrl+F5
- Changed the value from -80px to many different things to see if it is working at all
- Used Edge and Firefox for testing
答案1
得分: 0
只拿走权利，因为你想向左走。
<style>
* {
margin:0;
padding:0;
}
body,html {
overflow:hidden;
}
#div-id{
border: 2px solid rgb(255, 0, 0);
width: 40%;
height: 85%;
position: relative;
overflow: hidden;
}
#iframe-id{
position: absolute;
top: -160px;
left: -80px;
width: 620px;
height: 450vh;
}
</style>
<div id="div-id">
<iframe title="example" src="https://example.org" id="iframe-id" scrolling="yes"></iframe>
</div>
</body>
</html>
英文:
Just take away the right because you want to go left.
<html lang="en">
<body>
<style>
* {
margin:0;
padding:0;
}
body,html {
overflow:hidden;
}
#div-id{
border: 2px solid rgb(255, 0, 0);
width: 40%;
height: 85%;
position: relative;
overflow: hidden;
}
#iframe-id{
position: absolute;
top: -160px;
left: -80px;
width: 620px;
height: 450vh;
}
</style>
<div id="div-id">
<iframe title="example" src="https://example.org" id="iframe-id" scrolling="yes"></iframe>
</div>
</body>
</html>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论