...

View Full Version : mystery gap in IE6 (woo)



croatiankid
12-05-2006, 10:39 PM
http://www.croatiankid.com/blog/ is the url. here's the complete css. here's the problem: it concerns the left column. in Firefox, the light(er) green square that the search form is in pretty much hugs the header; I like that. in IE6, there is a significant gap. I can't find what's causing it. if it's a margin, padding, i don't know. I don't even know why it would be caused because all that's there is divs, and they don't have paddings/margins. would another pair of eyes please be so kind as to try to find it? I've sivved through the code a couple of times, and can't find it.


body {
background:url(images/bbg.jpg) left top repeat;
color:#555555;
font-size:14px; /*changed from 11px*/
font-family:Arial, Tahoma; /*changed from Arial, Tahoma*/
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}
h4 {
font-size:16px;
color:#AB4032;
font-family:Tahoma, arial, Times, serif;
font-weight:bold;
padding-left:0px;
}
#single
{
font-size:16px;
color:#AB4032;
font-family:Tahoma, arial, Times, serif;
font-weight:bold;
padding-left:0px;
line-height:normal;
}
h3, h2 {display:inline;font-weight:normal;}
h3
{
font-size:11px;
line-height:14px;
}
h2 {
padding-left:25px;
font-size:11px;
font-family:tahoma, arial, Microsoft Sans Serif;
color:#443F3C;
padding-top:0px;
margin:0px 0px 0px 0px;
}
.content_txt2 {
padding:15px 15px 20px 15px;
line-height:14px;
color:#555555;
}
.content_txt2 h4 {
font-size:16px;
color:#AB4032;
font-family:Tahoma, arial, Times, serif;
font-weight:bold;
padding-left:0px;
}
.content_txt2 a {
color:#AB4032;
text-decoration:underline;
}
.content_txt2 a:hover {
text-decoration:none
}

a {
color:#AB4032;
text-decoration:underline;
}
a:hover {
text-decoration:none
}
.postmetadataalt {
font-size:9px;
}

.table_main {
vertical-align:top;
width:670px;
height:100%;
}
.header {
background:url(images/header.jpg) left top no-repeat;
vertical-align:top;
width:670px;
height:135px;
}
.co_name {
padding:38px 0px 0px 25px;
margin:0px;
}
.co_name a {
font-size:42px;
color:#ffffff;
text-decoration:none;
font-family:times new roman, arial, tahoma;
font-weight:bold;
}

.main {
vertical-align:top;
width:670px;
height:100%;
background:url(images/main_bg.jpg) left top repeat;
}
.table {
width:670px;
height:100%;
display:table;
}
.table_row {
height:100%;
display:table-row;
width:670px;
}
.left {
height:100%;
vertical-align:top;
display:table-cell;
width:185px;
}
.left_main {
vertical-align:top;
width:173px;
height:100%;
margin:0px 2px 0px 1px;/*0507*/
padding:0px 0px 0px 0px;
}
.left_2 {
width:173px;
vertical-align:top;
background-color:#3B4741;
}
.search {
padding:13px 5px 22px 15px;
color:#ffffff;
font-size:11px;
font-family:Tahoma, arial, verdana, courier;
}
.search strong {
color:#ffffff;
}
.form {
font-size:11px;
color:#555555;
font-family:Tahoma, arial, verdana, courier;
width:106px;
height:18px;
padding:0px 0px 0px 5px;
margin:0px 6px 0px 0px;
vertical-align:top;
}
.left_3 {
width:173px;
vertical-align:top;
}
.sub_left {
padding:18px 5px 15px 15px;
}
.left_header {
color:#ffffff;
font-size:11px;
font-family:Tahoma, arial, verdana, courier;
}
.left_header strong {
color:#ffffff;
}
.sub_left ul {
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}
.sub_left li {
list-style:none;
padding:0px 0px 0px 21px;
margin:0px 0px 0px 0px;
background:url(images/li_bg.jpg) left bottom no-repeat;
vertical-align:top;
width:131px;
height:15px;
line-height:15px;
}
.sub_left ul li a {
text-decoration:none;
font-size:11px;
color:#B9D0C2;
font-family:tahoma, arial, times new roman;
padding:0px 0px 0px 0px;
}
.sub_left li a:hover {
text-decoration:underline;
}
.right {
height:100%;
vertical-align:top;
display:table-cell;
width:485px;
}
.right_main {
vertical-align:top;
width:463px;
height:100%;
margin:0px 12px 0px 10px;
padding:0px 0px 0px 0px;
min-height:1500px;
}
.right_2 {
width:463px;
vertical-align:top;
background-color:#EFEFEF;
}
.content_head {
width:463px;
height:100%;
display:table;
}
.content_headrow {
height:100%;
display:table-row;
width:463px;
}
.content_author {
height:100%;
vertical-align:top;
display:table-cell;
width:373px;
}
.head_txt {
padding:9px 5px 7px 15px;
color:#757373;
font-size:11px;
line-height:14px;
font-family:tahoma, arial, Microsoft Sans Serif;
}
.head_txt a {
color:#AB4032;
font-size:11px;
font-family:tahoma, arial, Microsoft Sans Serif;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
}
.head_txt a:hover {
text-decoration:underline;
}
.content_date {
height:100%;
vertical-align:top;
display:table-cell;
width:90px;
}
.date_txt {
padding:9px 11px 5px 5px;
color:#240417;
font-size:9px;
font-family:tahoma, arial, Microsoft Sans Serif;
text-align:right;
}
*html .content_author {
float:left;
}
*html .content_date {
float:left;
}
.right_3 {
width:463px;
vertical-align:top;
}
.content_txt {
padding:15px 15px 20px 15px;
line-height:14px;
font-size:14px; /*changed from 11px*/
font-family:Arial, Tahoma; /*changed from Arial, Tahoma*/
vertical-align:top;
line-height:20px; /*changed from 14px*/
}
.content_txt strong {
color:#555555;
}
.content_txt a {
font-size:14px;
text-decoration:underline;
color:#555555;
font-family:Tahoma, arial, serif;
}
.content_txt a:hover {
text-decoration:none;
}
.content_more {
padding:0px 10px 20px 20px;
text-align:right;
color:#4F4F4F;
font-size:11px;
font-family:Tahoma, arial, serif;
}
.content_more b {
color:#4F4F4F;
}
.content_more b a {
text-decoration:underline;
color:#4F4F4F;
}
.content_more b a:hover {
text-decoration:none;
}
.content {
width:463px;
height:100%;
display:table;
}
.content_row {
height:100%;
display:table-row;
width:463px;
}
.content_pict {
height:100%;
vertical-align:top;
display:table-cell;
width:150px;
}
.content_pictsub {
padding:0px 0px 0px 15px;
}
.content_menu {
height:100%;
vertical-align:top;
display:table-cell;
width:313px;
}
.content_menusub {
padding:5px 20px 5px 8px;
}
*html .content_pict {
float:left;
}
*html .content_menu {
float:left;
}
.content_menu ul {
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}
.content_menu li {
list-style:none;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
background:url(images/q1.jpg) left center no-repeat;
vertical-align:top;
line-height:20px;
}
.content_menu ul li a {
text-decoration:underline;
font-size:11px;
color:#AB4032;
font-family:tahoma, arial, times new roman;
padding:0px 0px 0px 16px;
}
.content_menu li a:hover {
text-decoration:none;
}
*html .left {
float:left;
}
*html .right {
float:left;
}
.footer {
background:url(images/footer.jpg) left top no-repeat;
vertical-align:top;
width:670px;
height:50px;
}
.footer_txt {
padding:12px 3px 0px 0px;
color:#ffffff;
font-size:11px;
font-family:tahoma, Arial;
text-align:right;
}
.footer_txt a {
color:#ffffff;
text-decoration:underline;
}
.footer_txt a:hover {
text-decoration:none;
}
ul {
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}
li {
list-style:none;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
background:url(images/q1.jpg) left center no-repeat;
vertical-align:top;
line-height:20px;
}
ul li a {
text-decoration:underline;
font-size:11px;
color:#AB4032;
font-family:tahoma, arial, times new roman;
padding:0px 0px 0px 16px;
}
li a:hover {
text-decoration:none;
}
ps I know that most of the markup is a mess, you don't need to mention it. when I have more time, perhaps over the winter, I will re-code the whole thing from scratch, because it seems to me a few divs are unneccessary, and need to work on headings (that's what I was doing when I noticed this gap).

Excavator
12-05-2006, 11:39 PM
Hello croatiankid,
It seems a little unecessarily complicated... just for an example, to get to the Right column that is dropping in IE7 I had to goto
body/table_main/main/table/table_row/right/right_main and then when I got there I find that right_main is the same as it's container div right except for one selector.
Seems like everything is enclosed by at least 3 divs.

Makes debugging very difficult to say the least...

I only have IE6 on my wifes machine so I have to walk over to her office to see how the search box drops... I *think* that it's caused by the line
<br style="line-height:15px "/> somewhere in div search...
line height could cause that for sure.
I could be wrong though.

croatiankid
12-06-2006, 11:35 AM
nah it's not that. lol it's okay to say it's a lot unneccessarily complicated, I know it is. but like I said, i'll recode most of it from scratch over the winter breaks

croatiankid
12-06-2006, 11:45 AM
Forget it it's not that big of a deal. Now I realize I don't want anybody to have to go through all of this (partially unneccessary) code.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum