如何将div缩放到另一个元素内部的100%高度和宽度 [英] How can I scale a div to 100% height and width inside of another element

查看:536
本文介绍了如何将div缩放到另一个元素内部的100%高度和宽度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何将div缩放到另一个元素内部的100%高度和宽度?在我的情况下sourrounding td。由于我是一个插件,我无法控制页面上的其他HTML。这是我的HTML:

How can I scale a div to 100% height and width inside of another element? In my case a sourrounding td. Since I'm a plugin I can not control the other HTML on the page. Here is my HTML:

<body style="height:100%;">
  <table width="600px" height="400px" border="1">
    <tr>
      <td style="background-color:silver;">Cell 1</td>

      <td style="background-color:silver;">
    <div style="height:100%; background-color:yellow;">
      <div style="min-height:100%; height:100%; background-color:red;">
        Cell 2
      </div>
    </div>
      </td>
    </tr>
  </table>
</body>

因此,Cell 2 div应该最大化。有没有跨浏览器的方法来做到这一点?为什么这么复杂?

So, the Cell 2 div should be maximized. Is there a cross browser way to do this? Why is this so complicated?

推荐答案

查看这个堆栈溢出问题以及...查看在该问题的评分最高的答案,它看起来像你必须将容器的高度设置为100%和子元素的最小高度,高度到100% 。

Look at this stack overflow question as well ... after reviewing the top rated answer in that question, it looks like you have to set the height of the container to 100% and "min-height, height" of a child element to 100%.

转到此网站更多信息 - 下面的HTML是网站的缩减版本

Go to this website for more info - the HTML below is stripped-down version of the website

<div style="height:100%;">
  <div style="min-height:100%; height:100%; background-color:red;">  
    put your content here 
  </div> 
</div> 

这篇关于如何将div缩放到另一个元素内部的100%高度和宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆