2

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

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

我想这是一个 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>
4

1 回答 1

2

完全摆脱 min-width:2000px 条件。

阻止包含 div 包装或折叠的方法是在其末尾插入一个 style="clear:right" 的空 div。这个新的 div 仍然在包含的 div 内，但它必须清除，即低于浮动，所以它拉伸了 div 的垂直高度。

于 2009-04-13T10:53:00.223 回答