...

View Full Version : IE6 problem



Snitz
02-13-2009, 04:26 PM
Hello everybody,

I just finished my new website [LINK (http://bocti.seomena.com/)]
It's working fine on firefox 2 and firefox 3. However, I'm facing a very weird problem when viewing the site on IE6.

I believe it's something to do with the div clearfix.


/* Clearfix */
.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
zoom: 1;
visibility: hidden;
}

* html > body .clearfix {
display: block;
width: 100%;
}

* html .clearfix {
height: 1%;
}

can you give me a help here please.

itsallkizza
02-13-2009, 04:27 PM
can you show the html you are having trouble with?

Snitz
02-13-2009, 04:30 PM
This is the html code where the problem persists.


<div id="el-containerwrap<?php echo $divid; ?>">

<div id="el-container">
<div id="el-container-inner" class="clearfix">
<?php if ($el_left) { ?>
<div id="el-col1">
<div class="el-innerpad">

<?php if ($hasSubnav) { ?>
<div id="el-subnav" class="moduletable_menu">
<h3>On this page</h3>
<?php $jamenu->genMenu (1,1); ?>
</div>
<?php } ?>

<jdoc:include type="modules" name="left" style="xhtml" />
</div>
</div>
<?php } ?>
<!-- BEGIN: CONTENT -->
<div id="el-content">
<jdoc:include type="message" />

<div id="el-current-content">
<jdoc:include type="component" />
</div>

<?php
$spotlight = array ('user1','user2','user6');
$botsl1 = $tmpTools->calSpotlight ($spotlight,$tmpTools->isOP()?100:99.9);
if( $botsl1 ) {
?>
<!-- BEGIN: BOTTOM SPOTLIGHT 1 -->
<div id="el-botsl1" class="clearfix">

<?php if( $this->countModules('user1') ) {?>
<div class="el-box<?php echo $botsl1['user1']['class']; ?>" style="width: <?php echo $botsl1['user1']['width']; ?>;">
<jdoc:include type="modules" name="user1" style="xhtml" />
</div>
<?php } ?>

<?php if( $this->countModules('user2') ) {?>
<div class="el-box<?php echo $botsl1['user2']['class']; ?>" style="width: <?php echo $botsl1['user2']['width']; ?>;">
<jdoc:include type="modules" name="user2" style="xhtml" />
</div>
<?php } ?>

<?php if( $this->countModules('user6') ) {?>
<div class="el-box<?php echo $botsl1['user6']['class']; ?>" style="width: <?php echo $botsl1['user6']['width']; ?>;">
<jdoc:include type="modules" name="user6" style="xhtml" />
</div>
<?php } ?>

</div>
<!-- END: BOTTOM SPOTLIGHT 1 -->
<?php } ?>

<?php if( $this->countModules('user7') ) {?>
<!-- BEGIN: BOTTOM SPOTLIGHT 2 -->
<div id="el-botsl2" class="clearfix" <?php if( $botsl1 ) { ?>style="margin-top: 20px;"<?php } ?>>
<div class="el-box" style="width: 100%;">
<jdoc:include type="modules" name="user7" style="xhtml" />
</div>
</div>

And this is the css code for those divs


#el-wrapper {
}

#el-header,
#el-mainnav,
#el-hp,
#el-container,
#el-topsl,
#el-footer {
width: 950px;
margin: 0 auto;
clear: both;
}

.narrow #el-header,
.narrow #el-mainnav,
.narrow #el-hp,
.narrow #el-container,
.narrow #el-topsl,
.narrow #el-footer {
width: 750px;
}

#el-container {
background: url(../images/vdot2.gif) repeat-y 78% 0;
}

#el-container-inner {
background: url(../images/vdot2.gif) repeat-y 20% 0;
}

/* PRIMARY COLUMN
--------------------------------------------------------- */
#el-content {
clear: none;
display: block;
float: left;
width: 500px;
padding-left: 20px;

}

/* COLUMNS
--------------------------------------------------------- */
#el-colwrap {
float: right;
overflow: hidden;
width: 44%;
}

/*columns*/
#el-col1 {
float: left;
width: 200px;
}

#el-col2 {
float: right;
width: 400px;
}

* html #el-col2 {
width: 49.2%;
}

#el-col1 div.el-innerpad,
#el-col2 div.el-innerpad {
padding: 2px 20px 0;
}

/*common style for column*/
#el-colwrap table {
border-collapse: collapse;
border-spacing: 0;
}

#el-colwrap .article_separator {
display: none;
}

#el-colwrap ul {
list-style: none;
}

/* COLLAPSIBLE LAYOUT
--------------------------------------------------------- */
#el-containerwrap,
#el-containerwrap-f,
#el-containerwrap-c {
padding: 40px 0 20px;
margin: 0;
clear: both;
background: url(../images/grad1.gif) repeat-x top;
}

/* full */
#el-containerwrap-f #el-container {
background: none;
}

#el-containerwrap-f #el-container-inner {
background: none;
}

#el-containerwrap-f #el-content {
width: 100%;
}

/* content + 1 col */
#el-containerwrap-c #el-container {
background: none;
}

#el-containerwrap-c #el-container-inner {
background: url(../images/vdot2.gif) repeat-y 78% 0;
}

#el-containerwrap-c #el-content {
width: 75%;
}

#el-containerwrap-c #el-colwrap {
width: 22%;
}

#el-containerwrap-c #el-col1,
#el-containerwrap-c #el-col2 {
width: 100%;
}

jerry62704
02-13-2009, 04:50 PM
It looks kind of weird from {Divisions} "el-col2" which is a float right. Is that were the problem is?

abduraooft
02-13-2009, 05:05 PM
This is the html code where the problem persists. That's not pure html. It contains a lot of PHP code, and we can't execute it to generate its corresponding html. We need to see either a link to your page or the parsed html, taken from browsers' view source option.

Snitz
02-14-2009, 09:17 AM
That's not pure html. It contains a lot of PHP code, and we can't execute it to generate its corresponding html. We need to see either a link to your page or the parsed html, taken from browsers' view source option.
I already gave the link of the site in the first post

LINK (http://bocti.seomena.com/?)


It looks kind of weird from {Divisions} "el-col2" which is a float right. Is that were the problem is?

Col2 is the column on the right, yes maybe this is where the problem is, I honestly don't know.

abduraooft
02-14-2009, 09:31 AM
I already gave the link of the site in the first post

LINK (http://bocti.seomena.com/?)

Oh.. sorry, I didn't see that :o


Col2 is the column on the right, yes maybe this is where the problem is, I honestly don't know.


I'm facing a very weird problem when viewing the site on IE6.
Could you define the issue that you are facing?

Snitz
02-14-2009, 09:40 AM
The problem is, if you visit the link on firefox, everything works just great but if visited using IE6, the right column is pushed under the articles, it's not fitting on the right... I don't know what's causing that error

abduraooft
02-14-2009, 10:00 AM
Umm.. try

#el-col2 {
float: right;
/*width: 400px;*/

}

* html #el-col2 {
/*width: 49.2%;*/
}

Snitz
02-14-2009, 10:42 AM
Umm.. try

#el-col2 {
float: right;
/*width: 400px;*/

}

* html #el-col2 {
/*width: 49.2%;*/
}

It worked, I just changed the html #el-col2 to 23%



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum