change wording

files/en-us/web/css/position/index.md

@@ -277,7 +277,7 @@ Fixed positioning is similar to absolute positioning, with the exception that th
 
 ### Sticky positioning
 
-A stickily positioned element stays in its normal position as long as it stays within the provided [inset](/en-US/docs/Web/CSS/inset) boundaries, and if the element is moved out of the boundary it stays fixed to the boundary in that direction. So the sticky positioning could be thought of as a hybrid of relative and fixed positioning. For inset sides that have `auto` value, the element doesn't stay fixed in that direction and can go out of the [scrollport](/en-US/docs/Glossary/Scroll_container#scrollport) due to scrolling.
+Sticky positioning mixes relative positioning with fixed positioning. When an item has `position: sticky`, it'll scroll in normal flow until it hits offsets from the [scrollport](/en-US/docs/Glossary/Scroll_container#scrollport) that we have defined. At that point, it becomes "stuck" as if it had `position: fixed` applied. The offsets are defined using [inset](/en-US/docs/Web/CSS/inset) properties. For the offsets that have inset values `auto`, the element doesn't stay fixed in that direction and can go out of the scrollport.
 
 You must specify at least one of `top`, `right`, `bottom`, or `left` inset for sticky positioning to behave as expected. Otherwise, it will be indistinguishable from relative positioning.
 
@@ -290,6 +290,8 @@ You must specify at least one of `top`, `right`, `bottom`, or `left` inset for s
 
 The above CSS rule would position the element with id _one_ relatively until the viewport was scrolled such that the element would be less than 10 pixels from the top. Beyond that threshold, the element would be fixed to 10 pixels from the top.
 
+Consider the following example, where we have two light bulb emojis in a paragraph. Both the light bulbs have been made sticky, and inset boundaries have been specified as 50px(top), 100px(right), 50px(bottom), and 100px(right). The inset area has been roughly marked using the same-sized gray-colored background on the div.
+
 #### HTML
 
 ```html
@@ -349,7 +351,7 @@ div {
 
 {{EmbedLiveSample('Sticky_positioning', '', '300px')}}
 
-In the above example, both the light bulbs have been made sticky, and inset boundaries have been specified as 50px(top), 100px(right), 50px(bottom), and 100px(right). The inset area has been roughly marked using the same-sized gray-colored background on the div. After you put both the bulbs in their right place, you'll notice that the bulbs act as relatively positioned inside the inset area. But as soon as they get moved out of the inset area they get fixed(stick) to the inset boundary in that direction.
+After you put both the bulbs in their right place, you'll notice that the bulbs act as relatively positioned inside the inset area. But as soon as they get moved out of the inset area they get fixed(stick) to the inset boundary in that direction.
 
 ## Specifications