Quite a few misc fixes plus rephrasing 2 paragraphs to streamline

the text.

Author: Adenilson

css-round-display/Overview.bs

@@ -148,7 +148,7 @@ Using 'device-radius' with just a single value (e.g. device-radius: 50%) is enou
 <h2 id="aligning-content">Aligning content along the display border</h2>
 <h3 id="shape-inside-property">The 'shape-inside' property</h3>
 <p>
-CSS Shapes [[CSS-SHAPES]] define the 'shape-inside' property that aligns contents along the edge of a possibly non-rectangular wrapping area. Web authors may use this feature to fit contents inside a round display. However, it could sometimes be hard to specify the wrapping area identical to the shape of a display. Thus, we add a new value '<code>display</code>' to the 'shape-inside' property to facilitate it. When the 'shape-inside' property on an element is set to '<code>display</code>', its content (or contained element) is aligned along the display border automatically.
+CSS Shapes [[CSS-SHAPES]] define the 'shape-inside' property that aligns contents along the edge of a possibly non-rectangular wrapping area. Web authors may use this feature to fit contents inside a round display. However, it can be challenging to specify the wrapping area to be identical to the shape of a display. To address such cases, 'shape-inside' is extended with a new value named '<code>display</code>', such an element having this value will have its content (or contained elements) aligned along the display border automatically.
 </p>
 <pre class='link-defaults'>
 spec:css21; type:type; text:<uri>
@@ -202,14 +202,14 @@ The example below shows how the 'shape-inside' property works when it is set to
 </div>
 </div>
 <p>
-Even though the shape of the rounded display could be described by circle() or ellipse() as <<basic-shape>>, 'shape-inside: display' is useful that authors make contents to be aligned within the display edge conveniently. In case of complicated shaped displays like curved, stelliform, or polygonal shape, the availability of 'shape-inside: display' is more increased in comparison with a simple shaped display (e.g. regular rounded display).
+This property is specially useful for complex shapes (e.g. curved, stelliform, polygonal), that wouldn't be covered by <<basic-shape>> (i.e. circle() or ellipse()), allowing web authors to conveniently align contents with the display edge.
 </p>
 <p>
 When a containing block is placed on one end of the display and the containing block has 'shape-inside: display', the descendant blocks of the containing block are basically put on the overlapping region between the containing block and the display area. The overlapping region's shape is mostly complicated shape, so it's difficult to define the shape using previous method like basic-shape. The figure 4 describes these circumstances as follows.
 </p>
 <div style="width: 500px;">
     <img alt="An image of two examples to show the principle of shape-inside: display" style="width: 500px" src="images/shape_inside_a.png">
-    <p class="caption">Align a part of the content along the display border</p>
+    <p class="caption">Align part of the content along the display border</p>
 </div>
 <p class="issue">
 What if content overflows? Clipping or scrolling?