设为首页收藏本站

jQuery MiniUI

 找回密码
 立即注册
jQuery MiniUI › 论坛 › MiniUI › BUG报告和需求建议 › mini-fit的问题
返回列表 发新帖
查看: 3810|回复: 9
打印 上一主题 下一主题

mini-fit的问题 [复制链接]

kevinyau

Rank: 3Rank: 3
跳转到指定楼层
楼主
发表于 2012-10-12 13:44:47 |只看该作者 |倒序浏览
在一个页面body区域包含 <style type="text/css"></style>
会影响mini-fit的布局（页面下方有空白），不知道这个能不能解决

举报

niko

Rank: 9Rank: 9Rank: 9
沙发
发表于 2012-10-12 13:46:03 |只看该作者
这个是不会有空白的。
你参考我们的fit示例：
http://www.miniui.com/demo/fit/fit.html

举报

kevinyau

Rank: 3Rank: 3
板凳
发表于 2012-10-12 14:22:26 |只看该作者
本帖最后由 kevinyau 于 2012-10-12 14:25 编辑
niko 发表于 2012-10-12 13:46
这个是不会有空白的。
你参考我们的fit示例：
http://www.miniui.com/demo/fit/fit.html ...

body区域没有style确实是不会有空白（html规范style应该放在head区域）

你把<style type="text/css"></style>放到body区域试

举报

niko

Rank: 9Rank: 9Rank: 9
地板
发表于 2012-10-12 16:14:41 |只看该作者
测试了，没有问题。
你更新下版本试试。

举报

kevinyau

Rank: 3Rank: 3
5#
发表于 2012-10-12 18:06:46 |只看该作者
本帖最后由 kevinyau 于 2012-10-12 18:09 编辑
niko 发表于 2012-10-12 16:14
测试了，没有问题。
你更新下版本试试。

那就奇怪了哦，我放在body区域就有问题，移到head区域就没问题
用的IE10，兼容模式也是这样
用chrome测试也是这样

举报

niko

Rank: 9Rank: 9Rank: 9
6#
发表于 2012-10-12 18:53:12 |只看该作者
不要用兼容模式，用标准模式。
你基于我们标准示例测试。

举报

kevinyau

Rank: 3Rank: 3
7#
发表于 2012-10-13 08:27:24 |只看该作者
niko 发表于 2012-10-12 18:53
不要用兼容模式，用标准模式。
你基于我们标准示例测试。

我在IE 10标准模式和兼容模式下测试都是这样Chrome也是，我就用你说的那个示例的代码吧
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5.      <title>Fit Layout</title>
  6.      <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  7.      <link href="../demo.css" rel="stylesheet" type="text/css" />
  8.      <script src="../../scripts/boot.js" type="text/javascript"></script>
  9. </head>
  10. <body>

  12.      <style type="text/css">
  13.          body { margin: 0; padding: 0; border: 0; width: 100%; height: 100%; overflow: visible; }
  14.      </style>
  15.      <div class="mini-toolbar" style="padding: 2px; border-bottom: 0;">
  16.          <table style="width: 100%;">
  17.              <tr>
  18.                  <td style="width: 100%;">
  19.                      <a class="mini-button" iconcls="icon-save" plain="true">保存</a>
  20.                      <a class="mini-button" iconcls="icon-close" plain="true">关闭</a>
  21.                      <span class="separator"></span>
  22.                      <a class="mini-button" iconcls="icon-reload" plain="true">刷新</a>
  23.                  </td>
  24.                  <td style="white-space: nowrap;">
  25.                      <label style="font-family: Verdana;">名称: </label>
  26.                      <input class="mini-textbox" />
  27.                      <a class="mini-button" iconcls="icon-search" plain="true">查询</a>
  28.                  </td>
  29.              </tr>
  30.          </table>
  31.      </div>
  32.      <!--撑满页面-->
  33.      <div class="mini-fit">

  35.          <div id="datagrid1" class="mini-datagrid" style="width: 100%; height: 100%;"
  36.              url="../data/AjaxService.aspx?method=SearchEmployees" idfield="id"
  37.              sizelist="[5,10,20,50]" pagesize="10">
  38.              <div property="columns">
  39.                  <div type="indexcolumn"></div>
  40.                  <div field="loginname" width="120" headeralign="center" allowsort="true">员工帐号</div>
  41.                  <div field="name" width="120" headeralign="center" allowsort="true">姓名</div>
  42.                  <div field="gender" width="100" renderer="onGenderRenderer" align="center" headeralign="center">性别</div>
  43.                  <div field="salary" width="100" allowsort="true">薪资</div>
  44.                  <div field="age" width="100" allowsort="true">年龄</div>
  45.                  <div field="createtime" width="100" headeralign="center" dateformat="yyyy-MM-dd" allowsort="true">创建日期</div>
  46.              </div>
  47.          </div>

  49.      </div>

  51.      <script type="text/javascript">

  53.          mini.parse();

  55.          var grid = mini.get("datagrid1");

  57.          grid.load();

  59.      </script>

  61. </body>
  62. </html>
复制代码
只是把
  1. <style type="text/css">
  2. body { margin: 0; padding: 0; border: 0; width: 100%; height: 100%; overflow: visible; }
  3. </style>
复制代码
移到从head区域移到body区域

举报

kevinyau

Rank: 3Rank: 3
8#
发表于 2012-10-13 08:33:38 |只看该作者
niko 发表于 2012-10-12 18:53
不要用兼容模式，用标准模式。
你基于我们标准示例测试。

上传一张截图

附件: 你需要登录才可以下载或查看附件。没有帐号？立即注册

举报

kevinyau

Rank: 3Rank: 3
9#
发表于 2012-10-13 08:37:20 |只看该作者
niko 发表于 2012-10-12 18:53
不要用兼容模式，用标准模式。
你基于我们标准示例测试。

再来张chrome的截图


附件: 你需要登录才可以下载或查看附件。没有帐号？立即注册

举报

niko

Rank: 9Rank: 9Rank: 9
10#
发表于 2012-10-14 08:21:12 |只看该作者
我们也测试到了，已修复。
下周一更新。

举报

返回列表 发新帖

Archiver|普加软件

GMT+8, 2024-11-23 07:07 , Processed in 1.030188 second(s), 10 queries .

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部