如何在100％高度的桌子内放置图像？

Question

我无法让图像100％适应css制作表的高度。如下所示，表格和图像完全忽略了父元素的维度。

一切都需要动态，这就是我使用百分比的原因。

＆＃13;

＆＃13;

        startInfo2.ErrorDataReceived += proc_DataReceived;
        startInfo2.OutputDataReceived += proc_DataReceived;

        startInfo2.Start();
        startInfo2.BeginOutputReadLine();

        startInfo2.WaitForExit(10);
        //Thread.Sleep(1000);


        DeBug.Invoke(new MethodInvoker(delegate { DeBug.Text = finalpath; }));

        Process[] processes = Process.GetProcessesByName("storescu-beta.exe");
        foreach (Process p in processes)
        {
            IntPtr pFoundWindow = p.MainWindowHandle;
            if (trig.Text == "I: Releasing Association")
            clearFolder(dicompath);clearFolder(dicompath);
        }

＆＃13;

.img {
  max-width: 50%;
  height: 100px; // <-- This should be able to be dynamic ( anything )
}

.img .table {
  display: table;
  width: 100%;
  height: 100%;
}

.img .row {
  display: table-row;
}

.img .cell {
  display: table-cell;
}

.img .row.img-el,
.img .row.img-el .cell {
  height: 100%;
}

.img img {
  max-width: auto;
  height: 100%;
}

＆＃13;

＆＃13;

＆＃13;

预期结果：

更新：是否可以通过flex以任何方式修复它？

Answer 1

这是你需要的吗？

＆＃13;

＆＃13;

.img {
  max-width: 50%;
  max-height: 100%;
}

.img .table {
  display: table;
  width: 100%;
  height: 100%;
}

.img .row {
  display: table-row;
}

.img .cell {
  display: table-cell;
}

.img .row.img-el,
.img .row.img-el .cell {
  height: 100%;
}

.img img {
  max-width: auto;
  height: 100%;
}

.cell img {
  width: 100%;
  height: auto;
}

＆＃13;

<div class="img pull-left gap-right bigger">
  <div class="table">
    <div class="row img-el">
      <div class="cell"><img src="https://1.bp.blogspot.com/-9QM7ciGXRkQ/V1hsB-wNLBI/AAAAAAAAMoA/eYbSHs00PTAjrI4QAmvYAIGCUe1AuRAnwCLcB/s1600/bryan_cranston_0095.jpg" style="float:left" /></div>
    </div>
    <div class="row">
      <div class="cell img-text">Hello</div>
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

你必须给它一个特定的高度，如200px它不能100％的高度。如果你有一个高度为200px的盒子;你可以使图像高度为100％，即200px