SOLVED: CSS "columns" reposition when using highlighting

[labman]

Hi everyone

I downloaded the free version of Zoom yesterday night and I am pretty impressed as I had a search page running on my test server within 10-15 minutes. This is for a new site and I will definitely recommend to the client that they buy the software.

After that I started adjusting the preferences, applying CSS etc. It's here that I into a snag: use of the highlight function caused CSS positioning problems. The problem is solved now and I am posting it here to save others some time.

The page has div#content into which are fitted two other divs (columns basically) (based on the excellent book transcending CSS by Andy Clarke):

div#content {
overflow: auto; /* Paul O Brien Fix for IE www.pmob.co.uk*/
width : 770px;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
}
div#content_main {
left : 0;
width : 50%;
padding : 1em 0;
}
div#content_sub {
left : 50%;
width : 50%;
padding : 1em 0;
}

This was followed by the hack (/*\*/* html .clear_children { display: inline;}/**/) for IE5 Win:

/* =si_clear_children */
.pc,.sc { position : absolute; top: 0; left: 0; }
.clear_children,.cc_tallest { position: relative; } /*\*/* html .clear_children { display: inline;}/**/
.cc_tallest:after { content: ''; } /* PREVENTS A REDRAW BUG IN SAFARI */

This all worked fine for Firefox 3, Opera 9.5 and IE7. I may also have tried Safari; I forget. This is all under XP SP3.

The problem happened when activating highlighting. The highlighting part worked fine, but in IE7 the two "columns" were now overlapping at the left part of div#content. The positioning still worked fine in the other browsers. I spent some time (too much!!) looking at the Javascript and the page structure, but it turns out that it is the IE5 hack that caused the problem.

Unhacking the CSS by removing /*\*/* html .clear_children { display: inline;}/**/ solved the problem. I don't know about IE5, but it is not a particular concern.

A search for /*\*/* html .clear_children { display: inline;}/**/ will provide many hits.

Regards

Roger