JSFiddle - React, Tailwind, and code Playground

by Guilherme Lopes

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-3.4.0/resources/css/ext-all.css">
<script src="http://dev.sencha.com/deploy/ext-3.4.0/adapter/ext/ext-base.js"></script>
<script src="http://dev.sencha.com/deploy/ext-3.4.0/ext-all-debug.js"></script>

JavaScript

Ext.onReady(function () {

   var tip = new Ext.Tip({
	    header: true,
	    collapsible: true,
	    autoHeight: false,
	    width: 350,
	    height: 50,
    	autoScroll: true
	});

    var contentPanel = new Ext.Panel({
        border: false,
        plain: true,
        autoLoad: {
            url: '/echo/js/?js=BLAH'
        }
    });

    var store = new Ext.Panel({
        html: "this text should only have a height of 50, therefore an automatic scrollbar should appear, but it doesn't!.<br/><br/>blah<br/>BLAH<br/>blah<br/>BLAH<br/>blah<br/>BLAH<br/>blah<br/>BLAH",
        border: false
    });

    new Ext.Panel({
        items: [
        contentPanel,
        new Ext.Button({
            text: 'click',
            handler: function () {
                tip.add(store);
                tip.show();
                tip.doLayout();
                alignTip();
            }
        })],
        renderTo: Ext.getBody()
    });
});