Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/apache-kafka/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 使部门使用it中所有可用的大小'；父母_Html_Css - Fatal编程技术网
Fatal编程技术网
  • html/
  • Html 使部门使用it中所有可用的大小'；父母

Html 使部门使用it中所有可用的大小'；父母

html css

Html 使部门使用it中所有可用的大小'；父母,html,css,Html,Css,在下面的代码中，父div的宽度将动态更改。左右分割具有固定的宽度。我需要中间分区填充父分区中的剩余空间。这样，我认为中间分区的宽度应该根据它的父分区动态变化 <body> <div id='parent' style='width:100%'> <div id='leftDiv' style='width:30px;float:left;'>left division</div> <div id='middleD

在下面的代码中，父div的宽度将动态更改。左右分割具有固定的宽度。我需要中间分区填充父分区中的剩余空间。这样，我认为中间分区的宽度应该根据它的父分区动态变化

<body>
   <div id='parent' style='width:100%'>
      <div id='leftDiv' style='width:30px;float:left;'>left division</div>
      <div id='middleDiv' ***style='width:??;'***>middle division</div>
      <div id='rightDiv' style='width:30px;float:right;'>right division</div>
   </div>
</body>


左除法
中师
右派
请注意，我只想用CSS而不是js来实现这一点。

像这样使用

width: calc(100% - 60px);
左分区30px右分区30px=60px 中间分区宽度=100%-60px

这样使用

width: calc(100% - 60px);
左分区30px右分区30px=60px
中间div width=100%-60px看起来是一个很好的选择

看起来是一个很好的候选人

middleDiv不需要宽度，只需添加
float:rightdiv到第一个



以下是解决方案：


<div id='parent' style='width:100%'>
      <div id='rightDiv' style='width:100px;float:right;background-color:red;'>right division</div>
      <div id='leftDiv' style='width:100px;float:left;background-color:green;'>left division</div>
      <div id='middleDiv' style='background-color:yellow;'>middle division</div>      
   </div>




右派
左除法
中师

middleDiv不需要宽度，只需添加
float:rightdiv到第一个



以下是解决方案：


<div id='parent' style='width:100%'>
      <div id='rightDiv' style='width:100px;float:right;background-color:red;'>right division</div>
      <div id='leftDiv' style='width:100px;float:left;background-color:green;'>left division</div>
      <div id='middleDiv' style='background-color:yellow;'>middle division</div>      
   </div>




右派
左除法
中师

宽度：计算（100%-30px-30px）宽度：计算（100%-30px-30px）