mic-gotoのプロフィール

@mic-goto mic-goto
ありがとう数0
質問数0
回答数1
ベストアンサー数
0
ベストアンサー率
0%
お礼率
0%

  • 登録日2013/05/03
  • box-shadowでFirefoxだと内枠に影が

    box-shadowがFirefoxだと内枠にも付いてしまいます(バージョン20)。 内枠には付けたくないのですが、どうすればよろしいでしょうか? 添付画像のようになってしまいます。 IE10だと内枠には付きません。 このような形にしたいです。 コードを下記します。 <table> <tr><th>ID</th><th>名前</th><th>得点</th></tr> <tr><td>1</td><td>ほげ男</td><td>100</td></tr> <tr><td>2</td><td>ほげ子</td><td>11</td></tr> </table> <style type="text/css"> table{ border-spacing:0; font-family:"メイリオ"; } table th{ padding:8px 0; border-top:1px solid #aaa; border-left:1px solid #aaa; border-bottom:1px solid #aaa; text-shadow:0 -1px 0 rgba(255,255,255,0.9); box-shadow:-1px 0 1px rgba(255,255,255,1)inset,0 -1px 1px rgba(255,255,255,0.5)inset; background:#eee; background:linear-gradient(#eee,#ddd 50%); width:134px; } table th:first-child{ border-radius:5px 0 0 0; } table th:last-child{ border-radius:0 5px 0 0; border-right:1px solid #aaa; box-shadow:2px 2px 1px rgba(0,0,0,0.1),0 -1px 1px rgba(255,255,255,0.5)inset,-1px 0 1px rgba(255,255,255,1)inset; } table td{ padding:8px 0; text-align:center; border-left:1px solid #aaa; border-bottom:1px solid #aaa; } table td:last-child{ border-right:1px solid #aaa; box-shadow:2px 2px 1px rgba(0,0,0,0.1); } table tr{ background:#fff; } table tr:last-child td{ box-shadow:2px 2px 1px rgba(0,0,0,0.1); } table tr:last-child td:first-child{ border-radius:0 0 0 5px; } table tr:last-child td:last-child{ border-radius:0 0 5px 0; } </style>

    • ベストアンサー
    • mic_goto
    • CSS
    • 回答数2