Tutorial :Google Custom Search Engine with IE6


I am trying to use Google Custom Search (Business Edition) on my site. I am not using the iFrame but I am using the Custom Element. I selected a theme and everything looks fine in all the browsers except IE6. All the search results are taking the Promotion CSS.

Update - Posted Code

<div id="cse-search-form" style="width: 100%;">Loading</div>  <script src="http://www.google.com/jsapi" type="text/javascript"></script>  <script type="text/javascript">    google.load('search', '1');    google.setOnLoadCallback(function() {      var customSearchControl = new google.search.CustomSearchControl('XXXXXXXX');      customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);      var options = new google.search.DrawOptions();      options.setSearchFormRoot('cse-search-form');        options.setAutoComplete(true);      customSearchControl.draw('cse', options);    }, true);  </script>  <link rel="stylesheet" href="http://www.google.com/cse/style/look/minimalist.css" type="text/css" />      <div id="cse" style="width:100%;"></div>  


I have solved the issue. The issue was with CSS that Google provides. They no longer support IE6 and infact do not have the browser installed anywhere to test (or so I've been told).

The issue is with IE6 and its inability to support multiple classes. Have a look at Ryan Brill's post for more information. To get the Google Custom Search CSS to work with IE6, the CSS selectors have to be tweaked a bit.

Ex: div.gs-promotion{ } instead of .cse .gs-promotion.gs-result, .gs-promotion.gs-result{ }

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »