Question

我在IE7 / 8中遇到了网页的有线问题。页面配置为 dir =“rtl”。并且 divRow 非常大宽度，因此其包含的div不会换行。

单击编辑器区域，键入一些单词，然后单击“Hello world”文本。布局将变得混乱，因为 divRow 类的div的偏移和宽度发生了变化。

我想这是一个IE7 / 8错误。有没有办法解决这个问题？

基本上， divRow 必须让其包含的div不包裹。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
  <style>
    div 
    {
      border: 1px;
      border-color: black;
    }

    .divRow
    {
      /* this is to make its containing div not to wrap */
      min-width: 2000px; 
    }

    div.divEditor
    {
      width: 100%;
    }

    iframe
    {
      height: 100%;
      width: 100%;
    }
  </style>
  <script>
    function $(id)
    {
      return document.getElementById(id);
    }

    function focusToRight()
    {
      var elem = $("innerDiv1");

      function fcs()
      {
        elem.focus();
      }
      setTimeout(fcs, 1);

    }
  </script>
  </head>
  <body dir="rtl">
    <div>
    <div id='main' 
      style="overflow: hidden; position: relative; width=100%">
      <div class="divRow" id="firstRow">
        <div style='float:right' id='innerDiv1'>
          Hello world.
        </div>
        <div style='float:right' id='innerDiv2'>
          This is to make it is very very very very very very very very  
          very very very very very very very very long
        </div>
      </div>
      <div class="divEditor">
        <iframe id="editorIFrame" onbeforedeactivate="focusToRight();" 
          src="about:blank"></iframe>
      </div>
    </div>

    </div>
    <script>
      //document.getElementById('main').style.width='40px';
      //$("editorIFrame").document.designMode = "on";
      document.frames["editorIFrame"].document.designMode = "On";
    </script>
  </body>
</html>

Answer 1

彻底摆脱min-width：2000px条件。

阻止包含div的包装或折叠的方法是在它结束之前插入一个带有style =“clear：right”的空div。这个新的div仍然在包含div中，但它必须清除，即在浮动下方，因此它会拉伸div的垂直高度。

在onBeforeDeactivate事件处理程序中调用focus（）时为什么DIV会发生变化？

1 个答案: