IE6 pushing down main content

[graphicz]

I have been asked to take a Vs5 site to Vs9. The client did not want his design changed other than to facilitate the upgrade and to 'tidy' it. I made a new page template based on the generic Dreamweaver 3 column header footer fixed layout. I changed container width to 1000. Innerlayout is in main content, nav bars in header, quick search and cart summary in right sidebar 2, top level section list, new products and best sellers left sidebar 1.

It looks fine in Firefox but in IE6 the main content div is pushed down below the level of the left sidebar 1. I know that IE6 is funny like that and will add the odd few pixels here and there. However, only removing both sidebars or increasing the size of container to 1180 lets main content go to the top. I made a generic 3colhdrfooter straight from Dreamweaver that only had innerlayout in main content and it still got pushed down. The innerlayout problem continues whatever Actinic fragment is in the page being displayed, and even if the inner layout is put in a table with 575px width. The width for main area in Actinic is set to 579 and the width of product list is set to 500. Something in Actinic is making the inner layout 180px bigger in IE6 than it is in Firefox!!! I am tearing the proverbial hair out! Please help:
URL: http://www.graphicz.eu.com/jp/
CSS: Attached as text file.
Thanks everyone.
Jonathan

[Duncan Rounding]

Try reducing the Best Sellers' width.

[graphicz]

Thanks drounding. As I said. The problem persists with whatever fragment or page is in view. I have tried removing Best sellers and it makes no difference. I have made a blank brochure page with a blank Text Only fragment and the main conent div is still pushed down. Believe me, I have tried all the obvious things and failed which is why I am asking here! Remember it works fine in Firefox, in IE6 it is not just a few pixels that we are talking about but 180! Cheers! J.

[leehack]

There is no benefit in floating the right hand column to the right before you do the central area, in fact if anything that is a negative. Set the width of your 3 columns and float them all left.

In addition you have the main area defined as 762, it then has 20 padding making 782 plus 200 margin each side making 1182 at least. You try and fit something at least 1182 wide into something just a 1000 wide. You might just have found your 180 if my maths are correct.

[TraceyHand]

There is no benefit in floating the right hand column to the right before you do the central area, in fact if anything that is a negative. Set the width of your 3 columns and float them all left.

In addition you have the main area defined as 762, it then has 20 padding making 782 plus 200 margin each side making 1182 at least. You try and fit something at least 1182 wide into something just a 1000 wide. You might just have found your 180 if my maths are correct.

1182 - 1000 = 180?

[leehack]

it is not just a few pixels that we are talking about but 180! Cheers! J.

I never said the 180, ner ner.

[graphicz]

Thanks Leehack and Tracey. Please can you tell me where I have "the main area defined as 762" as I can't see any reference to that width being specifid in my css or Actinic css. I have tried specifyig the width of the main content but it still makes no difference. Is this '762' defined in Actinic somewhere? The only widths I have specified is container 1000px and the two sidebars, and the table holding innerlayout in an atempt to solve the problem. Cheers!

[leehack]

Get yourself firefox and firebug and you can view your code live and see the various styles doing their job. I suspect it is within actinic you have it defined.

[graphicz]

Get yourself firefox and firebug and you can view your code live and see the various styles doing their job. I suspect it is within actinic you have it defined.

That is sort of where we came in! I know it must be somewhere in Actinic but I don't know where. The floating of sidebars is Dreamweaver's not mine and it is has worked for me before. I do use Firefox, I am not practised in Firebug. Clues would be appreciated.

Thanks!

[Rich Brady]

Open up firebug and select inspect, you can hover over any part of your page. Clicking on the area that interests you will open that code in the firebug pane beneath.

762 is found in the part of your css:


maincontent {
background-color:#FFFFFF;
height:100%;
margin:0 auto;
padding:7px;
voice-family:inherit;
width:762px;
}

[leehack]

Learn firebug would be my best bit of advice, takes about 5 minutes to understand and can save you hours per week. Sizes are defined in site options within actinic, although the container name does not ring a bell with me, so i'm not sure it is actinic, but you deny all knowledge of it too, so someone must have created it. 762px sounds very template kind of sized, is this a template you've bought or one you've designed yourself?

[graphicz]

I did mention that it was a standard Dreamweaver generic template. I found the offending code with Firebug.
OK. I have found the 'maincontent' described by WebD. Firebug says it is in actinic.css in the contemporary section, however this is not editable in Actinic. There are references to the themes at the bottom of the css which I removed to no effect. The full actinic css with the maincontent reference is found in site html folder. I deleted from there to no effect. I deleted it live on the server fro the actinic.css there, again to no effect. I have changed the name of the div in the html and css to rhubarb and agin that has had no effect. I think I will just have to start over with this one. It is interesting that there is a css reference deep in actinic that sharesa name with a Dreamweaver div. It is a pity that identifying it hasn't helped my problem!
Thanks!

[leehack]

The extra stylesheets are available to alter, you can access them from the design library. You can only work with the css from within the application itself as it has been since V8. Don't waste your time mooching around anywhere else, it will not achieve anything.

The sensible thing to me seems to rename the style on the DW template and the DW stylesheet, and the clash should then disappear. I can't understand why that would not work, you must be doing something wrong. Maybe take a fresh look in the morning is a good idea.

[graphicz]

For those who like to know how a story ends:
Although it will probably get me drummed out of the community, as Actinic is already pretty table rich I thought that one more wouldn't hurt so I replaced the left and right sidebars and main content with a three column table width 1000px, cell padding 5px,
#lefthand { width: 160px; vertical-align: top;}
#righthand {width: 160px; vertical-align: top;}
#thirdhand {width: 650px; vertical-align: top;}

All is now well!

Thank you everyone so much.

Jonathan