0

次のようなページャー ボタンを備えた GridView があります。

<PagerSettings Mode="NextPreviousFirstLast" FirstPageText="<<" PreviousPageText="<" NextPageText=">" LastPageText=" >>" Position="Bottom" />

ページャー スタイルを次のように設定すると、次のようになります。

<PagerStyle CssClass="gridPager" HorizontalAlign="Right" />

私のスタイルを見てください：

   .gridPager
   {
       border-collapse: collapse;
       border-width: 1px;
       border-color: Green;
       border-style: solid;   
       font-size: 7pt;
    }

    .gridPager td
    {
        padding-left: 5px;   
    }

ポケットベル ボタンの行の緑色の境界線が Internet Explorer で表示されない

IE がtr要素の境界線スタイルを認識しないためだと思われます。

私がこれを疑う理由は、F12 を押して IE 開発者ビューを見たときに、GridView によって生成されたテーブルが、ページャー ボタンを含む行に対してこれを作成したことを確認したためです。

 <tr class="gridPager" align="right">
    <td colspan="3"><table border="0">
    <tr>
    <td><a href="...pager button links"  </td>
   </tr>
</table></td>
  </tr>

TRのスタイルに注目してください...

そして、私はこれを見つけました: https://stackoverflow.com/a/583600/614263

その投稿の指示に従おうとしましたが、うまくいきませんでした。ただし、border-width を2px以上にすると機能します。それは良くありませんが、グリッドの残りの部分と一致するように、1px の細い境界線が必要です。

私がやろうとしているのは、グリッドの残りの行に存在するのと同じ色の境界線でページャー ボタンを囲むことだけです。

助けてください！どうすればこれを達成できますか？これは私の時間を無駄にしています！ありがとう！

4

1 に答える 1

1

別のアプローチを試してください。.gridPager ('tr') タグをスタイリングする代わりに、スタイルをテーブルに置きます

.gridPager table { ...styles here...}

テーブルの前の最初の「td」でパディング/マージンを削除する必要があるかもしれませんが、それは簡単に行うことができます。

.gridPager td { padding: 0; margin: 0; } /* this will affect all td tags */
.gridPager table td { padding-left: 5px; } /* add the padding back to the table td tags */

私にとっては...私は通常、下の境界線を除いて、端の周りに境界線を付けて表全体のスタイルを設定します。次に、「td」タグを使用して個々の行を追加します。テーブルを GridLines="none" にします。

/* this line give the table a border on the three sides - the main grid view table */
.gridTable { border: solid 1px #000; border-width: 1px 1px 0 1px }

/* then I put in the row styles */
.gridTable td { border-bottom: solid 1px #000; }

/* Then I fix the pager styles up with no border on the 'td' tag */
.gridTable table td { border: 0; }
于 2012-09-17T01:13:23.210 に答える