none
IE8显示XML文件的浮动框宽度问题 RRS feed

  • 问题


  • 1. 请看下列HTML文件(text.html):

    <!DOCTYPE html 
    
              PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
    
              "xhtml-math11-f.dtd">
    
    
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    
    
    <head>
    
      <title>Internet信息技术基础</title>
    
      <link rel="stylesheet" type="text/css" href="stylesheet.css" />
    
    </head>
    
    
    
    <body>
    
    
    
      <div id="content_left">
    
        <p>左框内容</p>
    
      </div>
    
    
    
      <div id="content_right">
    
        <p>右框内容</p>
    
      </div>
    
    
    
    </body>
    
    </html>
    
    


    2. 样式表文件(stylesheet.css):

    body {
    
      margin: 0px 0px 0px 0px; /* Top, Right, Bottom, Left */	
    
      padding: 0px 0px 0px 0px;  /* Top, Right, Bottom, Left */
    
      width: 100%;
    
    }
    
    
    
    #content_left {
    
      margin: 0px 0px 0px 0px;  /* 上,右,底,左 */
    
      padding: 20px 0px 60px 2%;  /* 上,右,底,左 */
    
      width: 15%;  /* 宽度 */
    
      text-align: left;  /* 文字左对齐 */
    
      float: left;  /* 浮动于左侧 */
    
      background-color:	#E0E0E0;  /* 背景色 */
    
      border: 1px solid #888;  /* 实线边框 */
    
    }
    
    
    
    #content_right {
    
      margin: 0px 0px 0px 0px;  /* 上,右,底,左 */
    
      padding: 20px 4% 60px 2%;  /* 上,右,底,左 */
    
      width: 76%;  /* 宽度 */
    
      text-align: left;  /* 文字左对齐 */
    
      float: right;  /* 浮动于右侧 */
    
      background: transparent;  /* 透明背景 */
    
      border: 1px solid #888;  /* 实线边框 */
    
    }
    
    
    
    .clear {
    
      clear: both;
    
    }
    
    

    此时,HTML文件左右两个浮动块在IE8中能正常显示宽度。


    3. 但为了制作含有数学公式的页面,我需要将上述HTML文件写成如下的xml文件(text.xml):


    <?xml version="1.0" encoding="utf-8"?>
    
    <?xml-stylesheet type="text/xsl" href="mathml.xsl"?>
    
    
    
    <!DOCTYPE html 
    
              PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
    
              "xhtml-math11-f.dtd">
    
    
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    
    
    <head>
    
      <title>Internet信息技术基础</title>
    
      <link rel="stylesheet" type="text/css" href="stylesheet.css" />
    
    </head>
    
    
    
    <body>
    
    
    
    <div id="content_left">
    
      <p>左框内容</p>
    
    </div>
    
    
    
    <div id="content_right">
    
      <p>右框内容</p>
    
    </div>
    
    
    
    </body>
    
    </html>
    
    

    将mathml.xsl、xhtml-math11-f.dtd等文件拷入当前目录,这时左右两个浮动块的宽度在IE8中发生了变化,但在Firefox中能够正常显示。


    可见,IE8号称已经符合W3C标准,但实际上似乎并没有完全达到!



    2009年4月19日 5:51

答案

  • 最好看一下xml+xsl最终转换后生成的结果html,浏览器显示的是转换后的结果,你可以使用服务器端的xml,xsl类转换之后看看最终结果是否是变了。


    孟宪会
    2009年4月19日 9:04
    版主

全部回复

  • 在做WEB开发时,一个在浮动框层在IE6/IE7/Forefox/Google chrome /Safari/Opera 下显示的都是浮在HTML页面上面,而在IE8下面就相反了
    2009年4月16日 8:56
  • 看代码。这么问无法回答
    孟宪会
    2009年4月17日 9:04
    版主
  • Hi, 孟先生

    我有问题:

    请看下列HTML文件(text.html):

    <!DOCTYPE html 
              PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
              "xhtml-math11-f.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
      <title>Internet信息技术基础</title>
      <link rel="stylesheet" type="text/css" href="stylesheet.css" />
    </head>
    
    <body>
    
      <div id="content_left">
        <p>左框内容</p>
      </div>
    
      <div id="content_right">
        <p>右框内容</p>
      </div>
    
    </body>
    </html>
    样式表文件(stylesheet.css):

    body {
      margin: 0px 0px 0px 0px; /* Top, Right, Bottom, Left */	
      padding: 0px 0px 0px 0px;  /* Top, Right, Bottom, Left */
      width: 100%;
    }
    
    #content_left {
      margin: 0px 0px 0px 0px;  /* 上,右,底,左 */
      padding: 20px 0px 60px 2%;  /* 上,右,底,左 */
      width: 15%;  /* 宽度 */
      text-align: left;  /* 文字左对齐 */
      float: left;  /* 浮动于左侧 */
      background-color:	#E0E0E0;  /* 背景色 */
      border: 1px solid #888;  /* 实线边框 */
    }
    
    #content_right {
      margin: 0px 0px 0px 0px;  /* 上,右,底,左 */
      padding: 20px 4% 60px 2%;  /* 上,右,底,左 */
      width: 76%;  /* 宽度 */
      text-align: left;  /* 文字左对齐 */
      float: right;  /* 浮动于右侧 */
      background: transparent;  /* 透明背景 */
      border: 1px solid #888;  /* 实线边框 */
    }
    
    .clear {
      clear: both;
    }
    此时,HTML文件左右两个浮动块在IE8中能正常显示宽度。
    但为了制作MathML文件,我需要用xml文件,并在文件前加载MathML的转换文件(.xsl文件),形成如下代码的xml文件(test.xml):

    <?xml version="1.0" encoding="utf-8"?>
    <?xml-stylesheet type="text/xsl" href="mathml.xsl"?>
    
    <!DOCTYPE html 
              PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
              "xhtml-math11-f.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
      <title>Internet信息技术基础</title>
      <link rel="stylesheet" type="text/css" href="stylesheet.css" />
    </head>
    
    <body>
    
    <div id="content_left">
      <p>左框内容</p>
    </div>
    
    <div id="content_right">
      <p>右框内容</p>
    </div>
    
    </body>
    </html>
    


    将mathml.xsl、xhtml-math11-f.dtd等文件拷入当前目录,这时左右两个浮动块的宽度在IE8中发生了变化,但在Firefox中能够正常显示。

    2009年4月19日 5:16
  • 最好看一下xml+xsl最终转换后生成的结果html,浏览器显示的是转换后的结果,你可以使用服务器端的xml,xsl类转换之后看看最终结果是否是变了。


    孟宪会
    2009年4月19日 9:04
    版主