I have created a small widget using jQuery UI and drag-drop plugins. Now, I am finding some issues with IE.
This widget can be accessed at - http://widget.adipa.com. At this URL, widget works well with IE7/8.
But when I embed this widget inside the iframe, as done here, it starts giving misaligning tiles. In the image show below, it can be seen that tiles are placed with little white spaces in between -
As seen here, between A and E, it has the white space.
You can check the widget in iframe here and without iframe here.
Steps to reproduce the error -
On first page widget - type 'Adipa' on first text box and click 'Next Step'.
On Second page, in design which is shown in middle, double click on any alphabet to remove it.
Just drag any alphabet from list of alphabets on left side. Drop this alphabet tile to empty space in design.
Above steps works well with IE without iframe and doesn't with IE iframe widget.
Is this because IE renders things differently with iframe and without iframe or is it issue with jQuery. Seems jQuery is doing quite a bit of hacks therein to support IE.
Thanks.