BlockBox: <html> (block) (B) (0,0)->(1024 x 224) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
  BlockBox: <body> (block) (B) (0,0)->(1024 x 124) effMargin=[18.0, 8.0, 16.0, 8.0]  styleMargin=[8.0, 8.0, 8.0, 8.0] 
    BlockBox: <p> (block) (I) (8,18)->(1008 x 20) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[18.0, 0.0, 18.0, 0.0] 
      LineBox: (8,18)->(809,20)
        InlineLayoutBox: (anonymous) (SE) (baseline=12) (8,21)->(809 x 16)
          InlineText: (In the following test, the purple square should be on the left (⇦)
          BlockBox: <img> (inline-block) (E) (407,18)->(19 x 19) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
          InlineText: (), and the teal square on the right ()
          BlockBox: <img> (inline-block) (E) (641,18)->(19 x 19) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
          InlineText: (⇨) of the blue rectangle.)
    BlockBox: <div> (block) (B) (8,38)->(1008 x 70) effMargin=[18.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
      BlockBox: <div> (block) (I) (8,56)->(1008 x 52) effMargin=[0.0, 16.0, 0.0, 16.0]  styleMargin=[16.0, 16.0, 16.0, 16.0] 
        LineBox: (192,64)->(624,18)
          BlockBox: <img> (inline-block) (E) (floated) (8,56)->(160 x 160) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
          BlockBox: <img> (inline-block) (E) (floated) (808,56)->(160 x 160) effMargin=[0.0, 0.0, 0.0, 0.0]  styleMargin=[0.0, 0.0, 0.0, 0.0] 
          InlineLayoutBox: (anonymous) (S) (baseline=12) (192,65)->(624 x 16)
            InlineText: (Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue)
        LineBox: (192,82)->(556,18)
          InlineLayoutBox: (anonymous) (E) (baseline=12) (192,83)->(556 x 16)
            InlineText: (rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle.)
