Webmaster Forum / HTML, CSS, Scripts / CSS / January 2007

My CSS hack displays well in all browser but IE 7. What is different in IE 7
that it displays boxes in overflow? Here is the CSS script:
@media all

{

.clearfix { display: inline-block; }

* html .clearfix { height: 1%; }

.clearfix { display: block; }

* html .floatbox { width:100%; }

* html #col1 { position:relative; }

* html #col2 { position:relative; }

#col3 { position:relative; }

* html .hold_floats { height: 1%; }

* html ul { position: relative }

* html ol { position: relative }

* html dl { position: relative }

* html blockquote { zoom:1 }

#page_margins, #page, #header, #nav, #main, #footer { zoom: 1; }

* html #col1 { display: inline; }

* html #col2 { display: inline; }

* html #col1_content { overflow: visible; }

* html #col2_content { overflow: visible; }

* html #col3_content { overflow: visible; }

#ie_clearing {

display:block;

\clear:both;

margin-bottom:-1em;

width: 102%;

font-size:0;

}

* html #ie_clearing { width: 100%; }

#col3_content {margin-bottom:-2px; }

.c50l { display:inline; }

.c50r { display:inline; }

.subc, .subcl, .subcr { width:auto; zoom: 1; }

.subc, .subcl, .subcr { \width:100%; w\idth: auto; }

#head1 {

margin-left:98px;

}

#head2 {

margin-left:112px;

}

#head3 {

margin-left:140px;

}

#col1_content ul li {

padding:0;

margin:0;

}

#col1_content ul a {

line-height:1em;

padding:0 0 0 10px;

margin:0;

}

#searchform h4, #undermenu h4, #quickcontact h4 {

height:30px;

}

}

@media screen

{

* html #col1_content { word-wrap: break-word; }

* html #col2_content { word-wrap: break-word; }

* html #col3_content { word-wrap: break-word; }

a, a:hover { background-color: transparent; }

#footer a, #footer a:hover { background-color: transparent; }

}