| <!DOCTYPE html> |
| <html> |
| <head> |
| <style type='text/css'> |
| #container { |
| position: relative; |
| } |
| .abs { |
| outline: solid 1px skyblue; |
| position: absolute; |
| left: 0; |
| top: 0; |
| right: 0; |
| } |
| </style> |
| <script type='text/javascript'> |
| window.onload=function(){ |
| var span = document.createElement('span'); |
| span.innerHTML = ' moooore'; |
| document.getElementById('container').appendChild(span); |
| }; |
| </script> |
| </head> |
| <body> |
| <p>When you click <button id="more">moooore</button>, the span.abs should expand with the container</p> |
| <p><span id="container"><span class="abs"> </span>Words, words, words</span> |
| </body> |
| </html> |
