<!DOCTYPE html>
<html>
  <head><title>Test dir=rtl</title></head>
  <body style="background: white;">

    <!-- menclose notation=radical -->

    <div style="position: absolute;
                top: 5px; left: 5px; width: 100px; height: 100px;
                text-align: center; background: black;">
      <math dir="rtl">
        <mstyle mathcolor="yellow">
          <!-- left and right notation make the menclose symmetric -->
          <menclose notation="radical left right">
            <mspace width="20px" height="20px"/>
          </menclose>
        </mstyle>
      </math>
    </div>

    <div style="position: absolute;
                top: 5px; left: 5px; width: 100px; height: 100px;">
      <!-- hide the left part of the menclose. A 5px band is not covered, where
           the radical may be seen if it is wrongly placed on the left instead.
        -->
      <div style="position: absolute;
                  width: 35px; height: 100px; background: red;"></div>
      <!-- hide the middle part of the menclose -->
      <div style="position: absolute; left: 40px;
                  width: 20px; height: 100px; background: blue;"></div>
      <!-- hide the right part of the menclose -->
      <div style="position: absolute; left: 60px; width: 40px; height: 100px;
                  background: green;"></div>
    </div>

  </body>
</html>