html - Alter the order of text selection across elements -

say have this

div {    position:absolute;    top:0;  }    #right {    left:50px;  }    #left {    left:0;  }

<div id="right">world</div>  <div id="left">hello</div>

when go select text left right, behaves in visually unintuitive way. in chrome @ least, order in elements considered selection seems depend on order of elements. there way change order without changing order of elements?

you can using css flexbox. have change values of div id properties css.

code:

#blockcontainer > div {      border: 1px dashed #000;  }    #blockcontainer {      display: -webkit-box;      display: -moz-box;      display: box;            -webkit-box-orient: vertical;      -moz-box-orient: vertical;      box-orient: vertical;  }  #right {      -webkit-box-ordinal-group: 3;      -moz-box-ordinal-group: 3;      box-ordinal-group: 3;  }  #left {      -webkit-box-ordinal-group: 1;      -moz-box-ordinal-group: 1;      box-ordinal-group: 1;  }

<div id="blockcontainer">      <div id="right">world</div>      <div id="left">hello</div>  </div>

jsfiddle - http://jsfiddle.net/hbk05z8n/