html / CSS (SOLVED)

[electrifire]

Hi

Sorry to bring this thread up again but I just looked at the site in IE 7 and the layout is completely messed up, it looks ok in chrome what is causing the template to be all over the place in IE?

www.electrifire.co.uk/test

thanks

[Peciura]

Remove outermost "". And use conditional comments for IE7 style.

[electrifire]

Hi

thanks for the continued response, could your give me an example of conditional comments for IE7 style,?

Thanks

[Russ]

See the following link for more information on IE conditional comments:

http://msdn.microsoft.com/en-us/library/ms537512%28VS.85%29.aspx

Or perhaps more simply
http://www.quirksmode.org/css/condcom.html

Hope this helps?

[electrifire]

Such simple things make a world of difference, in the menu manager I had div id menu as well as having it in the template which caused the content to be all over the place.  This now looks right but the right hand side boxes are being displayed at the bottom of the page (only in IE) In my current website I have this code for IE:

-->
 
 


Which I missed off when porting the template to cmsms so I added it into the template but the right hand side boxes remain down the bottom?

Also the dotted line is baffling me, I thought I could sort this but struggling here as well.

Any advice is appreciated

[Peciura]

"Div#containRight" should be inside of "div#container"

Have you inspected your page with "Developer Tools" ?
If not here is a list of tools you might be interested in :
http://www.klauskomenda.com/archives/20 ... r-browser/

[electrifire]

Hi thanks for the image and help, I didnt know about the developer tools website so thank you.  With regards to:

"Div#containRight" should be inside of "div#container"

Doesnt you picture show it is inside the div#container or have I missed something?

[Peciura]

I made picture after i edited page source. At least it works under IE7 mode.

[electrifire]

Yes Im just looking at the IE developer tool and it shows the div right outside so let me see if I can sort that

[electrifire]

I've tried moving the but I cant get it to come under the



{content}

{global_content name='Special Offer'}



{content}

{global_content name='Special Offer'}

Im not sure where else I can put it?

[Russ]

Lets get the page to validate first. It is practically impossible to find errors otherwise

Empty DIV's
Line 158, Column 10: ID "footer" already defined
And other coding errors and a few errors in your CSS.

Fixing these may help. It may also be that you are not leaving enough space for the right div when viewed in IE and so it is being pushed underneath.

Hope this helps,
Russ

p.s. Also the construction in the '' section, lots of DIV's, seem way to many IMHO, consider a list for your 'div class="lists"'?
p.p.s. I'm not sure this layout and CSS is the best way to achieve what you are trying to do? It seems overly complex?

[electrifire]

Ok I'll find a code validater and see where that gets me, I must be leaving enough space as the site is fine in the original code www.electrifire.co.uk its just where Im trying to port it over to cmsms, this is why its confusing the site is fine in IE, Chrome and FF www.electrifire.co.uk I only develop issues when trying to port it to cmsms.

Peciura did you have the page looking correct in IE once you moved the div id?

[Peciura]

Peciura did you have the page looking correct in IE once you moved the div id ?

I think it looks ok in picture "div#containRight.png"

[electrifire]

Ok could you tell me where you placed the containright div? I started the whole port again and it looks completely wrong again, I'll have to go back to your code you posted on here.

[Peciura]

Importing site to CMSms is not so complicated as it might look.

1. Take decent text editor like Notepad++ . It can fold/unfold code and reindent (TextFX > TextFX HTML Tidy > Tidy: Reindent XML)
2. Paste page source ( from FF or IE) to text editor
3. Create empty  template, style and page. Set relation ship among them
4. Replace blocks with "Smarty" tags one by one in text editor. After editing paste all html code to template content fileld and look if everything looks ok.

You can start with template. You will have to create:
{metadata}
{stylesheet}
{menu}
{global_content name='containRight'}
{content}