demo · v144

Side-relative Syntax

Pick the X anchor side, Y anchor side, and offsets. The stage repositions live and the generated CSS appears below. Chrome 144 accepts <side> <offset> in the longhand form — earlier the shorthand was the only place this worked.

side-relative longhand support: checking…


  


  

    
the CSS


.banner {
  background-position-x: right 16px;
  background-position-y: bottom 8px;
}

  


  

    
see also