我有一个html页面,我在2列中显示数据。我在右栏中有一张图片。当页面缩小时,图像会下降到屏幕底部而不是不断变小。我确定我错过了一些简单的事情。这是代码:
<div id="page_content" style="left: 0px; top: 0px;overflow: auto;">
<div style="position:relative;float:left;width:50%;padding: 0 10px 10px 20px;overflow: auto;">
some text
</div>
<div style="position:relative;float:right;width:47%; padding-right: 5px;overflow: auto;">
<map id="FPMap0" name="FPMap0">
<area coords="453, 343, 579, 411" href="M/default.html" shape="rect" />
<area coords="455, 427, 580, 494" href="P/default.html" shape="rect" />
<area coords="17, 42, 164, 102" href="#1._Plan" shape="rect" />
<area coords="5, 150, 185, 269" href="#2._Mod" shape="rect" />
<area coords="284, 98, 430, 166" href="#3._Prep" shape="rect" />
<area coords="286, 176, 431, 241" href="#4._Cond" shape="rect" />
<area coords="285, 347, 423, 412" href="#5._Close" shape="rect" />
<area coords="286, 432, 423, 496" href="#6._Collect" shape="rect" />
<area coords="285, 525, 425, 569" href="#7._Analyze" shape="rect" />
</map>
<img id="the_pic" style="vertical-align:top; top:5px; max-width:100%;max-height:100%;overflow: auto;" src="images/img8.jpg" usemap="#FPMap0"/>
</div>
</div>
我尝试做的是让图片根据需要调整大小而不移动。