How to have the vertical dividers of inner grids aligned to each other in the following?

{"12",Grid[{{"1","2"},{"foo","bar"}},Dividers-> All]},
{"xxxx",Grid[{{"1","2"},{"foooo","barbar"}},Dividers-> All]}
Dividers-> All

enter image description here


1 Answer 1


You can play with ItemSizes to make sure that the itemsizes in the two sub-grids are in alignment. For example:

  Grid[{{"12",  Grid[{{"1", "2"}, 
   {Item["foo", ItemSize -> {5, 3}], 
  Item["bar", ItemSize -> {10, 3}]}}, Dividers -> All, 
     Alignment -> {Center, Center}]}, {"xxxx", 
  Grid[{{"1", "2"}, 
  {Item["foo", ItemSize -> {10, 3}], 
    Item["barbar", ItemSize -> {10 - 5 + 10, 3}]}}, Dividers -> All,
     Alignment -> {Center, Center}]}}, Dividers -> All, 
   Alignment -> {{Center, Center}, {Center, Center}}, 
     ItemSize -> {{{10, 30}}}]

enter image description here

Given the two column widths {x1,y1} for the top sub-grid, and the column width of the first item in the lower sub-grid x2, the second column width is determined by

 y2 = y1+ x2- x1 

Of course, you also need to add the costraints that x1+y1 = x2+y2 = cw = column width of the second column in the enclosing grid, and that each column width is wide enough for the cell contents etc...

Update: A more flexible, yet still manual, approach is to wrap sub-grids in Pane and use Alignment option of Pane as suggested in halirutan's answer to a related question.

       Pane[Grid[{{"1", "2"}, {"foo", "bar"}},
             Dividers -> All, Alignment -> {Center, Center}],
         ImageSize -> Full, Alignment -> {x12, Center}]}, {"xxxx",
       Pane[Grid[{{"1", "2"}, {"foooooooooooooooooooooooo", "barbar"}},
             Dividers -> All, Alignment -> {Center, Center}],
        ImageSize -> Full, Alignment -> {x22, Center}]}}, 
   Dividers -> All, Alignment -> {Center, Center}, 
   ItemSize -> {{{40, 10}, {40, 10}}}], 
 Grid[{{Control[{{x12, Center, "x12"}, {Left, Center, Right}}], 
       Control[{{x12, 0, ""}, -1, 1, Appearance -> "Labeled"}]}, 
      {Control[{{x22, Center, "x22"}, {Left, Center, Right}}], 
       Control[{{x22, 0, ""}, -1, 1, Appearance -> "Labeled"}]}}]]

enter image description here

  • $\begingroup$ +1, but it's awful to have to manually adjust ItemSizes. It doesn't scale to 10's or 100's of items. $\endgroup$ Aug 29, 2012 at 3:25
  • $\begingroup$ @alan, I agree ... while we keep our fingers crossed that alignment-related issues with Grid will be fixed in version 9, we are left with painful/manual workarounds:) (see e.g. this question). $\endgroup$
    – kglr
    Aug 29, 2012 at 20:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.