如果列视图标头为空,则标头不会填充IE中的完整大小

时间:2013-03-28 13:25:49

标签: css xpages

如果没有截图,问题很难描述......

我使用此css设置了xpages中视图的列视图标题,只是为了在所有浏览器中获得渐变:

.xspPanelViewColumnHeader {
       background: #58a8cd; /* Old browsers */
       /* IE9 SVG, needs conditional override of 'filter' to 'none' */
       background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU4YThjZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzBjODNiMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzBmNmM5NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMjdkYWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
       background: -moz-linear-gradient(top,  #58a8cd 0%, #0c83b2 50%, #0f6c95 51%, #127daa 100%); /* FF3.6+ */
       background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#58a8cd), color-stop(50%,#0c83b2), color-stop(51%,#0f6c95), color-stop(100%,#127daa)); /* Chrome,Safari4+ */
       background: -webkit-linear-gradient(top,  #58a8cd 0%,#0c83b2 50%,#0f6c95 51%,#127daa  100%); /* Chrome10+,Safari5.1+ */
       background: -o-linear-gradient(top,  #58a8cd 0%,#0c83b2 50%,#0f6c95 51%,#127daa 100%); /* Opera 11.10+ */
       background: -ms-linear-gradient(top,  #58a8cd 0%,#0c83b2 50%,#0f6c95 51%,#127daa 100%); /* IE10+ */
       background: linear-gradient(to bottom,  #58a8cd 0%,#0c83b2 50%,#0f6c95 51%,#127daa 100%); /* W3C */
       background-position: left top;
       color: #FFFFFF;
       padding: 4px 4px 4px 4px;
       font-weight: bold;
 }

到目前为止工作正常。但是如果列视图标题没有标签,则IE9中的渐变存在问题(不在Firefox中)。

在IE9中,渐变不会填充标题的完整大小 - 我可以看到两个块(一个水平和垂直)但两个像素只有几个像素宽。但是列标题的其余部分保持白色。

一旦我输入一个标签(即使它只是一个“。”),标题也会像往常一样显示(全高度和带有渐变的全宽度)。

这种方式有效:

<xp:viewColumnHeader id="viewColumnHeader1" value="."></xp:viewColumnHeader>

这不是:

<xp:viewColumnHeader id="viewColumnHeader1"></xp:viewColumnHeader>

所以问题是(如果有人可以按照我的描述):我如何编辑css以防止列标题缩小而没有定义标签?

0 个答案:

没有答案