Question

所以不使用Flex，当另一个div（固定图像）已经在里面时，如何让这个文本容器填充父文件的空白？提前谢谢。

以下是代码：

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>Testing</title>

  <style>
      #container { width: 50%; height: 100px; margin: 0 auto; border: solid 1px #fb9494;}
      .image { height: 100px; width: 100px; background-color: #d9d9d9; float: left;}
      .text { width: 100%; background-color: yellow; float: left;}

  </style>
</head>

<body>

<div id="container">
    <div class="image">image</div>
    <div class="text">text</div>
</div>


</body>
</html>

Answer 1

尝试将其添加到text类：

.text { 
    width: calc(100% - 100px);
    height: 100px;
 }

DEMO：http://jsfiddle.net/abbts5n3/

具有固定图像的自动大小容器，其中文本应填补空白

1 个答案: