Toolbar renders away from div having CSS property overflow set to auto.

[qasid]

Toolbar renders at bottom and away from selection when all text is selected using keyboard command Ctrl+A or select manually using mouse

Steps
1 Create a div with over flow property set to auto.

<div id="container" >
          <div contenteditable="true"  id="description" style="width:100px; height:100px; overflow:auto;">
            <p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p>
                </div>

        </div>
  <script type="text/javascript">
var instance = AlloyEditor.editable('description');
</script>

1. Select all text (using mouse or Ctrl+A).

Expected result
Toolbar renders near selected text.

Actual result
Toolbar renders away from selected text.

[qasid]

Hello @ipeychev,
Any update on this issue?

[ipeychev]

Umm, we put this with very low priority. It is an issue, true, but I couldn't imagine how could it happen in the real life, so we put it into the backlog.

However, let's see if this could be reprioritized:

1. What is the use case here?
2. What is the point of selecting the whole text and applying some style on it? Moreover, why is it useful to have such a small editable area?

Thanks,

[qasid]

Potential use case here is re-sizable text area. User can adjust the size of editable text area on the fly.

In this particular case there can be multiple scenarios where user selects whole text.
e.g:

• User wants to change/apply font size &/or family of selected content
• User wants to re-align selected text
• User wants to change/apply styles formatting

Currently in my opinion, by default toolbar renders where the text selection highlight ends. Therefore in case of overflow since some portion of the selected text is visible to the user, toolbar appears as if it has rendered away from the text area.

[qasid]

@ipeychev Thank You! I just confirmed it.