A “hunter shoots a bear” ad by Tipex (developed by Grouek ) shows how you can build viral branding campaigns on Youtube. The video takes interactivity to a new level by letting the viewer finish the ad. In addition they embrace the freedom of of the internet by dealing with humor with typos (with a nice 404 video) or if you decide to use the word “fuck”.

However the most interesting thing is the “white labeling” effect where the viewer always gets the feeling that is in Youtube. And guess what? This will not have been possible with other technology then flash. The use of CSS3 based animations might become more popular as the web changes, still it will take very long  time (maybe 5 years) for other technology to push the boundaries of the web as it was done in this campaign by Tipex.

I had a window, which contained two form panels. One of the panels was collapsible (similar to this) and after some upgrades it top working: the collapsible button will disappear after collapsing the panel. After Googling and not finding nothing I decided to do a detail trace of the problem using firebug. While observing the HTML tab in firebug, I saw that the problem was in the margins of the form-panel after it collapsed. For some reason the margin was set to 0. So, to fixed the problem I did the following:

Added in the the application CSS file. What this does is sets the width of the collapsed panel to 15px (or 17px in the case of IE), instead of 0.

.x-layout-collapsed{
    width:15px !important;
}

.ext-ie .x-layout-collapsed{
    width:17px !important;
}

So, if you have a similar problem, check with firebug what is the width of the margin of the container i.e <div>. If it’s 0 then just overwrite the default CSS of Ext.