如何让内容自动获取div的剩余宽度？

问题描述：

我有一个div，其包含闪光灯和图像，我想他们会在线显示，并希望闪光的div将容器的剩余宽度（图像DIV应该采取的宽度图像本身）。如何让内容自动获取div的剩余宽度？

所以我让闪光灯浮起来。

<div id=chartcon> 
    <div id="chartflash" style="float:left"></div> 
    <div id="map"><img src="../example.jpg"></div> 
    <div style="clear: both;"></div> 
</div>

但它不起作用，图像总是坐在chartflash div下。

似乎chartcon的宽度太大，所以地图div必须坐在它下面。

所以我试着计算chartflash DIV dynamiclly的宽度和高度：

var mapWidth = parseInt($('#map img').css('width')); 
var mapHeight = parseInt($('#map img').css('height')); 
var chartwidth = parseInt(window.screen.width - mapWidth - 70); 
$('#chartflash').width(chartwidth);

的“70”是不知道（我已经尝试了很多次），如果它比70小，图像也会显示在chartflash div下。

虽然问题是由计算dynamiclly sloved，但我不认为这是一个好主意，我不知道是否有任何CSS的方式，使这个？

答

我会把图像放在包含flash文件的div里面，然后把它浮起来。我把css内联，以便你在上下文中看到它。

<div id="chartcon"> 
    <div id="chartflash"> 
      <div id="map" style="float:right"><img src="../example.jpg"></div> 
      <div style="clear: both;"></div> 
    </div> 
</div>

答

您可以像pixeline说的那样做，也可以使两个元素左移。

如何让内容自动获取div的剩余宽度？

相关推荐