0

この問題は、スクリーンショットなしで説明するのは難しいです...

すべてのブラウザーでグラデーションを取得するためだけに、この 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 では、グラデーションはヘッダーのフル サイズを埋めません。2 つのブロック (1 つは水平方向、1 つは垂直方向) が表示されますが、両方とも幅が数ピクセルしかありません。ただし、列ヘッダーの残りの部分は白のままです。

ラベルを入力するとすぐに (そしてそれが "." だけであっても) ヘッダーは通常どおり表示されます (グラデーション付きの全高と全幅)。

この方法は機能します：

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

これはしません:

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

したがって、質問は (誰かが私の説明に従うことができれば) です: CSS を編集して、定義されたラベルなしで列ヘッダーが縮小するのを防ぐにはどうすればよいですか?

4

0 に答える 0