5

I am having problems putting a box-shadow on trs inside a table. The problem is that the box-shadow doesn't show up at all unless the display of all the trs of the table is set to block (a 'fix' I found here: Box Shadow inside TR tag). However, when the display of trs is set to block, it makes the table cells no longer line up, crowding all to the left.

Here's a fiddle demonstrating the problem: http://jsfiddle.net/jFdEY/

You can try changing it to apply to all trs but that causes another problem (in the second picture below).


Here's some pictures:

The one without display: block on all the trs (table displays properly but box-shadow doesn't work) enter image description here

The one with display: block on all the trs (box-shadow shows up but the table layout is broken) enter image description here

So, is there a way around this?

Community
  • 1
  • 1
Seth Carnegie
  • 73,875
  • 22
  • 181
  • 249
  • Please post all the relevant HTML and CSS to demonstrate what's going on here. I'm sure there's a way to line the table cells up as you desire, but the solution depends on the context. – KatieK May 16 '11 at 05:11

1 Answers1

7

"Many of the elements used within tables are neither block nor inline elements."

For this reason setting all TR to block is most likely breaking the natural table behavior.

EDIT: I was able to create a solution similar to your desired effect however it requires that the columns have fixed width.

Demo: http://jsfiddle.net/jFdEY/2/

Technically this isn't a table anymore though, just appears as such.

wdm
  • 7,121
  • 1
  • 27
  • 29
  • thanks for the answer, but this doesn't work either and makes the `tr`s that this is applied to appear in the normal place but every `tr` that doesn't have this rule has it's left start where the rights of the ones that do end. I will post a code example of what demonstrates the problem I'm having. – Seth Carnegie May 16 '11 at 15:19
  • @Seth please see edits. It's not ideal, but I don't think there is an ideal solution here. – wdm May 16 '11 at 19:00
  • thanks and +1, but I'm not going to mark this q as answered in case someone stumbles accross it and has a complete proper fix. – Seth Carnegie May 16 '11 at 22:18