splitter居中显示问题

登录

你好，我在页面中间放了一个C1Splitter，但是想把它放在页面的中间；当我在css文件中设置了body的一个属性为 text-align:center；的时候，splitter显示就变样了，如果不设置这句的话，那么splitter又无法居中显示，请问应该如何解决呢？

ZenosZeng · ZenosZeng

Splitter显示的位置由SplitterDistance来设置，你设置了body的text-align:center之后显示不正常，请检查另外的两条线是不是其他Div的边框

mengmeng_032 · mengmeng_032

你好，我splitter外面并没有div啊，我把我的文件附上了，麻烦帮忙看一下，非常感谢！

ZenosZeng · ZenosZeng

你好，谢谢提供详细的代码，附件中的页面可以打开，但是缺少Style.css和ace-template.js文件，所以看不到最终显示的效果，还请再次上传Style.css和ace-template.js文件。

mengmeng_032 · mengmeng_032

不好意思给忘了

ZenosZeng · ZenosZeng

你好，我使用你的代码在IE8进行测试，并没有发现你图中除了Splitter之外的那两根线，请检查那两
根线是不是C1NavPanel和iframe的边框
页面加载后的初始状态：

拖动Splitter之后的状态：

mengmeng_032 · mengmeng_032

抱歉，我给你发到style.css是我修改过了的，里面把居中显示给去掉了，那里面的body部分是这样：body {
font:12px Arial, Helvetica, sans-serif;
color: #000;
background-color: #EEF2FB;
margin: 0px;
text-align :center;

}
加上最后一句测试一下就看到我说的那个情况了；
第二张图往右边拉出现的线是正常的，是navpanel的线；

ZenosZeng · ZenosZeng

我是先添加了text-align :center;这行代码进行的测试，测试结果就是6楼中图片显示的样子。而且我这儿天不添加这行代码对Splitter的位置都没有影响，只是对页面中的文字等产生了影响

不知道你是否使用的是IE8浏览器，或者在其他浏览器中测试结果怎么样。

mengmeng_032 · mengmeng_032

我试一下，我是在360浏览器中调试的

mengmeng_032 · mengmeng_032

我调试过了，确实在ie8中text-align :center这句话不对splitter产生影响，但是在其他浏览器中会，如果使用ie8的兼容试图，也会。
这个是splitter的一个属性，那两条线是splitter左边panel1的两条边线，因为设置了居中，所以solitter条也居左边panel1的中间了，即显示的样子，解决方法是必须将splitter外面容器设置为内容居左。
我的解决方法是在外面放了一个大的div，不设置 text-align，而是设置成 margin：0 auto；这样整个页面就居中了，然后在splitter的外面放一个div，设置为 float：left，这样终于达到了我想要的效果。

		自动登录	找回密码
密码			立即注册

splitter居中显示问题

本帖子中包含更多资源

10 个回复

回复 1# mengmeng_032 的帖子

本帖子中包含更多资源

回复 3# mengmeng_032 的帖子

本帖子中包含更多资源

本帖子中包含更多资源

回复 6# Zera 的帖子

回复 7# mengmeng_032 的帖子

回复 8# Zera 的帖子

回复 9# mengmeng_032 的帖子

活字格认证

圣诞拼拼乐

微信认证勋章

讲师达人

元老葡萄

悬赏达人