Skip navigation

Dreamweaver

Freecey Calculating status...

Currently Being Moderated

Problem with display of pages in IE

Aug 5, 2012 11:23 AM

Tags: #problem #cs5 #design #internet #html #dreamweaver #display #explorer #css #chrome #shifted

I'll keep this short and simple, I'm not after criticism of my work but if it is a mess then I understand, I've re-coded a website designed by a friend who has joined the army & is currently serving so I cannot get in touch with him for help, I'm a novice website designer but I'm stumped as to why my pages are behaving the way they are

I've made a website for a friend's pub and it all looked brilliant in DreamWeaver CS5's Design View so I went ahead and used ftp program FileZilla to send it live on my domain and basically it shifted my pictures and it displays differently in IE to what it does in Chrome e.g. My "Find Us" page has a large white bar at the bottom in IE which shouldn't be there and I can't get rid of it, but it doesn't show in chrome?

Any help or code I may be able to implement would be greatly appreciated, thanks Freecey.

Edit: Forgot to add the link to my site - www.thelightdragoon.co.uk

Also I am aware of the problems with the Home Page & the Menu Page but I am yet to attempt to fix those yet.

591 Views 4 Replies Latest reply: Freecey, Aug 12, 2012 11:12 AM

Replies

Currently Being Moderated

1. MurraySummers,

Aug 5, 2012 11:38 AM in reply to Freecey

Report

Your suspicions are confirmed. It's pretty messy.

The page has no doctype, so it will be rendered in quirks mode, making your display in any given browser unpredictable.
The page has an <object> tag above <head> which is an invalid placement.
Your code needs to be carefully checked for errors - validator finds some that must be fixed. Once the code validates then you can begin to troubleshoot your layout....

http://validator.w3.org/unicorn/check?ucn_uri=http://www.thelightdrago on.co.uk/&ucn_task=conformance
(the errors that you need to pay attention to begin about line 30)

|
Mark as:
Currently Being Moderated

2. Freecey,

Aug 6, 2012 5:08 AM in reply to MurraySummers

Report

All sorted thanks very much for your help, feel free to have a browse around and let me know if everything displays correctly, thanks again for your help.

|
Mark as:
Currently Being Moderated

3. MurraySummers,

Aug 6, 2012 5:31 AM in reply to Freecey

Report

You still have a problem on that page.

<head>
<meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" /><object type="{0C55C096-0F1D-4F28-AAA2-85EF591126E7}" id="cosymantecbfw" class="c1"></object>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Note that you STILL have an <object> tag within the head region. That's invalid.

Also, you are using absolute positioning to place elements within your header region - that's definitely suboptimal and unnecessary since it precludes centering the page in various width viewports. However, if you make the following changes you can muddle by -

1. Change the CSS for #outerShadow to set the left/right margins to "auto". Make it position:relative.
2. Change the left values for the absolutely positioned elements to whatever you need for them to be correctly located within #outerShadow.
3. Twiddle the remaining out of place element margins to locate them correctly within #outerShadow.

That should do it. But the real way to build this page is without using absolute positioning at all. It's not necessary and will always make your maintenance more complicated as long as you have it.

|
Mark as:
Currently Being Moderated

4. Freecey,

Aug 12, 2012 11:12 AM in reply to MurraySummers

Report

I'm trying changing alot of things to relative positions and just hitting problems, I may wipe the page and rebuild, what do you suggest?

|
Mark as:

Forum guidelines

Answers + Points = Status

10 points awarded for Correct Answers
5 points awarded for Helpful Answers
10,000+ points
1,001-10,000 points
501-1,000 points
5-500 points