CSS drop-initial-after-adjust Property

Description

The drop-initial-after-adjust property sets the alignment point of the drop initial for the primary connection point.

Initial value
text-after-edge
Applies to
::first-letter pseudo element
Inherited
No
Media
Visual
Computed value
Specified values
Animatable
No
CSS Version
CSS3
JavaScript syntax
object.style.dropInitialAfterAdjust

Syntax

Formal syntax: central | middle | after-edge | text-after-edge | ideographic | alphabetic | mathematical | <percentage> | <length>

drop-initial-after-adjust: [value];
drop-initial-after-adjust: 10px;
drop-initial-after-adjust: 5%;

Values

  • centralThe alignment point is at the intersection of the end-edge of the element and the 'central' baseline of the element.
  • middleThe alignment point is at the intersection of the end-edge of the element and the 'middle' baseline of the element.
  • after-edgeThe alignment point is at the intersection of the end-edge of the element and the 'after-edge' of the extended inline box of the element. This may include or not the line-height of the element, depending on the line-stacking-strategy.
  • text-after-edgeThe alignment point is at the intersection of the end-edge of the element and the 'text-after-edge' baseline of the element.
  • ideographicThe alignment point is at the intersection of the end-edge of the element and the 'ideographic' baseline of the element.
  • alphabeticalThe alignment point is at the intersection of the end-edge of the element and the 'alphabetic' baseline of the element.
  • mathematicalThe alignment point is at the intersection of the end-edge of the element and the 'mathematical' baseline of the element.
  • <percentage>The computed value of the property is this percentage multiplied by the computed 'line-height' of the element. The alignment point is on the end-edge of the inline box and is offset from the after-edge by the computed value. A value of '0%' makes the text-after-edge the alignment point.
  • <length>The alignment-point is on the end-edge of the inline box. Its position along the end-edge is offset from the after-edge by the <length> value. A value of '0cm' makes the text-after-edge the alignment point.

Example

.class {
   drop-initial-after-adjust: middle; 
}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
??????
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
??????