Layout Testing for Dynamic Content

15
Jun
0

cookpad_home

A few days ago, a test against the home page for cookpad.com revealed a float drop error in Firefox 3, in their main promotion of a user recipe.  Since then, the recipe featured has changed, and thus the bug does not occur any longer.

But, this demonstrates an important point:  if your site features user-generated content, you must be very strict with your presentation layout, because users may contribute content in shapes and sizes you never considered.

We believe this is one of Browsera’s core strengths, its ability to quickly validate hundreds of web pages and automatically detect problems.  Performing a test like this manually against a large number of web pages takes too long and is too error prone.

Float Drop Issue in IE6 - Bing Travel

10
Jun
1

Bing Travel IE6 Float Drop Bug

Microsoft’s new Bing brand, which is basically rebranded Live, which used to be MSN Search, launched a couple weeks ago.  You’d think that MS would have been very diligent to cross-browser test their pages, however, Browsera detected some unsightly layout issues occuring in IE6.

The first is on the Bing Travel page.  You can see that the “search hotels too” radio button is misplaced in IE6.  Here is Browsera’s detection on the float drop on the Bing Travel page.

This problem appears to be caused in Internet Explorer 6 by the <div class=”clearAll”> inside the <div class=’submitButton’> not having an explicit width and thus expanding to 100%.  Applying style

width: ‘1px’

to that clear div fixes the problem and pulls the radio button into the right spot in IE6.

Tagged as: , , ,