Position: top-x-1
Style: xhtml outline
Position: top-x-2
Style: xhtml outline
Position: top-x-3
Style: xhtml outline
Position: top-y-1
Style: xhtml outline
Position: top-y-2
Style: xhtml outline
Position: top-z-1
Style: xhtml outline
Position: top-z-2
Style: xhtml outline
Position: top-z-3
Style: xhtml outline
Position: top-z-4
Style: xhtml outline
Position: top-z-5
Style: xhtml outline
Position: top-z-6
Style: xhtml outline
Position: logo-1
Style: xhtml outline
Position: logo-2
Style: xhtml outline
Position: logo-3
Style: xhtml outline
Position: logo-4
Style: xhtml outline
Position: logo-5
Style: xhtml outline
Position: logo-6
Style: xhtml outline
Position: content-top-1
Style: CardHeaderBody outline
Position: content-top-2
Style: CardHeaderBody outline
Position: content-top-3
Style: CardHeaderBody outline

This demo shows:

  • a Fluid Layout & Template Positions
  • Top-z Block is fixed always.
  • Background color added to few blocks.
  • Different number of columns & different column width for few blocks.
  • Scroll to Top button at right-bottom position.

If you can see only texts here, no demo, you might be in the wrong link.

Click Here  

Position: content-bottom-1
Style: CardHeaderBody outline
Position: content-bottom-2
Style: CardHeaderBody outline
Position: content-bottom-3
Style: CardHeaderBody outline
Position: bottom-x-1
Style: xhtml outline
Position: bottom-x-2
Style: xhtml outline
Position: bottom-x-3
Style: xhtml outline
Position: bottom-x-4
Style: xhtml outline
Position: bottom-x-5
Style: xhtml outline
Position: bottom-x-6
Style: xhtml outline
Position: bottom-y-1
Style: xhtml outline
Position: bottom-y-2
Style: xhtml outline
Position: bottom-z-1
Style: xhtml outline
Position: bottom-z-2
Style: xhtml outline
Position: bottom-z-3
Style: xhtml outline
Position: bottom-z-4
Style: xhtml outline
Position: bottom-z-5
Style: xhtml outline
Position: bottom-z-6
Style: xhtml outline
Position: debug
Style: none outline