...

View Full Version : My website doesn't show correctly in IE6



Danaldinho
11-01-2009, 06:05 PM
Hey,

My website (http://www.lilwaynehq.com) works correctly in Firefox, IE7, and IE8, but in IE6 the sidebar displays under the main content.

This is something to do with the very first block of the main content post because if you look in IE6, the box is a tiny bit bigger than the rest underneath it.

I can't figure out how to fix it and what is causing it.

So if anyone knows how I can fix this, I would appreciate it if you could help me.

Thanks, appreciate it

Excavator
11-01-2009, 06:26 PM
Hello Danaldinho,
There are several errors that could be easily fixed, I don't know that will cure what you're seeing in IE6 but it can't hurt.

Check the validator. It finds id's used more than once, syntax errors like <Br /> and missing end tags.

Excavator
11-01-2009, 06:33 PM
It may be what's causing your #sidebar to drop is the margin:0; it gets from .grid_6.

What happens if you change #sidebar to something like this:
.container_16 .grid_6{
margin: 0 0 0 590px;
}
That does away with the width and margins it over the width of your #centercol

Danaldinho
11-01-2009, 09:23 PM
It may be what's causing your #sidebar to drop is the margin:0; it gets from .grid_6.

What happens if you change #sidebar to something like this:
.container_16 .grid_6{
margin: 0 0 0 590px;
}
That does away with the width and margins it over the width of your #centercol

I tried that mate, and it makes the sidebar go the bottom but the right side. :(

Excavator
11-01-2009, 09:53 PM
change #sidebar to something like this:
.container_16 .grid_6{
margin: 0 0 0 590px;
}

And remove the float:left; you apply here (.grid_6 deleted)
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,
.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,
.grid_16{display:inline;float:left;margin-left:0px;margin-right:10px}

Danaldinho
11-01-2009, 10:07 PM
And remove the float:left; you apply here (.grid_6 deleted)
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,
.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,
.grid_16{display:inline;float:left;margin-left:0px;margin-right:10px}

That makes the main content box go full width.

And it still displays the sidebar under all the content.

Excavator
11-01-2009, 11:23 PM
Go back to your original code that you have published on the web.
Replace your entire 960.css with this -
.container_12,.container_16{margin-left:auto;margin-right:auto;width:930px}
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13, .grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:0px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{margin: 0 0 0 590px;}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}html body * span.clear,html body * div.clear,html body * li.clear,html body * dd.clear{background:none;border:0;clear:both;display:block;float:none;font-size:0;list-style:none;margin:0;padding:0;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{cle ar:both;content:'.';display:block;visibility:hidden;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}

Nothing is changing your main content. If it goes full width, your editing the wrong css.

Danaldinho
11-06-2009, 06:14 PM
Go back to your original code that you have published on the web.
Replace your entire 960.css with this -
.container_12,.container_16{margin-left:auto;margin-right:auto;width:930px}
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13, .grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:0px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{margin: 0 0 0 590px;}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}html body * span.clear,html body * div.clear,html body * li.clear,html body * dd.clear{background:none;border:0;clear:both;display:block;float:none;font-size:0;list-style:none;margin:0;padding:0;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{cle ar:both;content:'.';display:block;visibility:hidden;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}

Nothing is changing your main content. If it goes full width, your editing the wrong css.

Hey sorry for the late reply, but when I did that, it made a really big gap underneath the 'Latest, Popular, Last Comments & Tags' box.

I'll show you a screenshot:

http://img410.imageshack.us/img410/9155/screenerror.jpg

Anymore ideas or how to fix that problem?

Thanks, appreciate it.

Danaldinho
11-07-2009, 10:45 PM
Anyone got any ideas? :(

Danaldinho
11-09-2009, 11:42 PM
Can someone please help me with this, I'm struggling with it.

abduraooft
11-10-2009, 07:51 AM
Have you taken any action regarding the first reply of this thread?

# Line 306, Column 10: ID "mpu_banner" already defined

<div id="mpu_banner">



An "id" is a unique identifier. Each time this attribute is used in a document it must have a different value. If you are using this attribute as a hook for style sheets it may be more appropriate to use classes (which group elements) than id (which are used to identify exactly one element).
# Info Line 299, Column 27: ID "mpu_banner" first defined here

<div class="box2"><div id="mpu_banner">

# Error Line 308, Column 6: end tag for "a" omitted, but OMITTAG NO was specified

</div>



You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

Trouble shooting issues in IE6 is not so easy and the presence of invalid markup will make it even hard. Help us to help you.

tema2
11-10-2009, 04:46 PM
Use firefox :D (http://www.esecentrooriente.gov.co/hco/cont_hco2009/archivos/phen375review.htm)

Danaldinho
11-13-2009, 01:00 PM
Have you taken any action regarding the first reply of this thread?

Trouble shooting issues in IE6 is not so easy and the presence of invalid markup will make it even hard. Help us to help you.

Thanks mate, I changed the "ID" to a "CLASS" and it is now working :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum