Forum Moderators: not2easy

Message Too Old, No Replies

IE 6.0 CSS Issue, overlapping instead of adjacent

         

ccorsell

5:29 am on May 20, 2008 (gmt 0)

10+ Year Member



I am new to programming. I have gotten this page to load very well in FF , IE 7.0 but can't get it to load correctly. Right column 2 goes under column one instead of being adjacent. How do I fix what info do you need? In other words, what is happening is col_2 is going under column co_1. Please let me know if you can help.

This box seems to be problem and here is code but don't know how to fix work with IE 6.0

<div align="center">
<div align="center">
<p align="left"><img src="images/arrow blue.jpg" alt="" width="64" height="62" border="10" align="left" class="img_indent" /><span class="wrapper"><img src="images/border.jpg" alt="" width="9" height="90" border="10" align="left" class="img_indent" /></span><span class="l">Unsecured Loans</span><span class="l">EZ Loans</span>
<div class="clear"></div>
</div>
</div>

SuzyUK

8:40 am on May 20, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi ccorsell, and welcome to WebmasterWorld

>>what do you need?
it would help if we had the CSS to go with that HTML ;)

it looks to me like you're trying to get an image on the left, list of links/terms on the right with a border separating them?

[edited by: SuzyUK at 8:40 am (utc) on May 20, 2008]

shytalk

10:35 am on May 20, 2008 (gmt 0)

10+ Year Member



Hi Folks:

I too am new to this forum and found it seeking a solution to what appears to be exactly the same issue as ccorsell. I have tested my new website in 46 different browsers and the *only* one that breaks it is IE6 - surprise, surprise!

If you enter <> into the render box at <snip> with the setting at IE6 the problem is very apparent - the right column falls below. Entering <snip> and rendering with any other version shows what is the required result.

Any help gratefully appreciated. Happy to post the CSS and HTML if needed [just shout what you need].

Best wishes to all - and thanks for the forum - Jack

[edited by: SuzyUK at 9:30 pm (utc) on May 20, 2008]
[edit reason] No urls, please post code, thanks [/edit]

shytalk

11:26 am on May 20, 2008 (gmt 0)

10+ Year Member



Whoops - sorry, didn't know we shouldn't post full URLs - that <snip> should read ipinfo dot info forward-slash netrenderer
BTW: This is an excellent [and free] facility for testing IE browsers.

ccorsell

12:47 pm on May 20, 2008 (gmt 0)

10+ Year Member



hey Suzy,

Thanks for responding. Yes. I am trying to have two columns side by side pretty much. If you look at this site in IE 6.0 you will see that column 2 goes under column 1. As for the css here is the code. Let me know if you need other info.

#site_center {text-align:center;}
#main {width:950px; margin:0 auto; text-align:left;}

#header {height:400px;}

.col_1, .col_2, .col_3 { float:left;}

/*======= index.html =======*/
#page1 #content .wrapper { background:url(images/line1.gif) 390px 0 repeat-y; width:975px;}
#page1 #content .col_1 {width:390px;}
#page1 #content .col_2 { width:560px;}

/*======= index-1.html =======*/
#page2 #content .wrapper { background:url(images/line1.gif) 315px 0 repeat-y; width:780px;}
#page2 #content .col_1 {width:339px;}
#page2 #content .col_2 { width:414px;}

/*======= index-2.html =======*/
#page3 #content .col_1 { width:780px;}

/*======= index-3.html =======*/
#page4 #content .wrapper { background:url(images/line1.gif) 315px 0 repeat-y; width:780px;}
#page4 #content .col_1 {width:339px;}
#page4 #content .col_2 { width:414px;}

/*======= index-4.html =======*/
#page5 #content .wrapper { background:url(images/line1.gif) 315px 0 repeat-y; width:780px;}
#page5 #content .col_1 {width:316px;}
#page5 #content .col_2 { width:464px;}

/*=========================*/

#footer {height:90px;}