JSFiddle - React, Tailwind, and code Playground

HTML

<div id="image"></div>
<div id="container">
    <p>I like nutella and croissants</p>
    <input id="message" placeholder="type...." required="required" autofocus>
    <button type="button" id="send">Send</button>
    <button type="button" id="close">Close</button>
</div>
<div>
<h2>
fdfgdgfd
</h2>
</div>

CSS

div#image {
    background: url(http://i.imgur.com/PF2qPYL.png) no-repeat;
    height: 36px;
    /*height needed to actually show the div (default width is 100%)*/
}

#container {
    white-space: nowrap;
    overflow: hidden;
}
}

JavaScript

$(document).ready(function () {
        $("#image").click(function () {
            $("#container").animate({height: 'toggle'});
        });
    });