Tap highlight sizes

by rbyers

HTML

<div id='c' draggable>
    <pre>
<div id='l' >    
    Press me inner foo foo foo foo foo foo
    foo foo foo foo foo foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo 
    foo foo foo foo foo 
    foo foo foo foo foo foo foo foo foo foo 
    foo foo foo foo foo 
    </div>

outer 2
</pre>
</div>

CSS

div {
 margin: 10px;
 background-color: lightgrey;
 overflow: none;
}

#s {
 width: 50px;
 height: 20px;    
}

#m {
 width: 100px;
 height: 50px;    
}

#l {
 -webkit-user-drag:element;
 width: 800px;
 height: 500px;    
 overflow: scroll;
}

JavaScript

document.getElementById('c').addEventListener('click', function(e) {
    document.getElementById('l').innerHTML += 'test ';
});