...

View Full Version : A few silly defects



aclees86
06-10-2012, 09:47 PM
Hello all,

I've finished a site that's due to be uploaded at the end of August, but I have to fix 4 defects that have been found and create a mobile version before this can happen.

I'll leave the mobile thing for another time but I really need some help fixing the following and if anybody can help in any way I would really appreciate it.

http://www.zappdance.co.uk/test/ is the concerned site.

1: Let's start with the most important and most frustrating. IE=<8. Version 8 and below of IE just does not render anything correctly. The site works perfectly in Chrome, Firefox and various other browsers other than IE8 or below. As the code for the website is quite large I will not post it here, but if you could take a look at it and see if you can provide any pointers for me (if you do view the source I apologise in advance as I have not performed any tidying yet - especially CSS). The way it looks in IE8 is that the menu appears to the right scattered around the page, no background images, and a real mess. (slip your IE in to compatibility mode for a preview!). I think I could create another version of the site if there is no way around it but I'd really rather not have to!

2: Menu background. The striped menu background to the left of the page does not extend with the page and stops rather abruptly whenever content exceeds this initial height. Try opening a few of the tabs on the page to see what I mean. I cannot seem to work this one out, again some pointers would be great.

3: I think this one will be really simple and I'm just being stupid! The Contact tab has an email address listed under Contact Details and I cannot seem to get this on the same line as "Email:".

4: IE only. On the News tab there are three images with accompanying mini-articles to the right. For some reason on IE the last image has a larger gap between the image and text than the others. Odd but baffling!


If you happen to find any more defects, do let me know! I really appreciate any help you can provide with any of the above, you'll help save my sanity!

felgall
06-10-2012, 10:28 PM
If it is a new site why are you using a transitional doctype - that doctype is for pages originally written in HTML 3.2 that are still in the process of transitioning to HTML 4.

Also your page contains 58 errors in the HTML - http://validator.w3.org/check?uri=http%3A%2F%2Fwww.zappdance.co.uk%2Ftest%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Internet Explorer is less forgiving of errors than other browsers so fixing those errors might fix your problems - at least it will drastically reduce the possible causes.

Excavator
06-10-2012, 10:30 PM
Hello aclees86,
Floating an element and positioning it are two very different things. Instead of relative, I think absolute positioning for your 4 tabs.

http://www.barelyfitz.com/screencast/html-training/css/positioning/

aclees86
06-10-2012, 10:39 PM
If it is a new site why are you using a transitional doctype - that doctype is for pages originally written in HTML 3.2 that are still in the process of transitioning to HTML 4.

Also your page contains 58 errors in the HTML - http://validator.w3.org/check?uri=http%3A%2F%2Fwww.zappdance.co.uk%2Ftest%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Internet Explorer is less forgiving of errors than other browsers so fixing those errors might fix your problems - at least it will drastically reduce the possible causes.

Thank you for your advice. I shall try and rectify as many of these errors as possible. Not seen this tool before!

Re the doctype - I simply kicked off a new php page from Dreamweaver and didn't even look at doctype. To be honest, I'm not even sure how this affects this - I shall look it up.

Thank you once again.

Candygirl
06-10-2012, 10:41 PM
Hello,

1.- You use html5 tags as "aside" and "menu". It seems to me that those are not supported by IE8 and under.

Excavator
06-10-2012, 10:52 PM
Hello,

1.- You use html5 tags as "aside" and "menu". It seems to me that those are not supported by IE8 and under.

Wrong DocType for the new HTML5 elements. Look at how to get that working in older browsers here (http://nopeople.com/CSS%20tips/HTML5/index.html).

aclees86
06-11-2012, 09:26 PM
Thank you all for helping with the layout problems of this. I have now managed to fix all of the errors on the page within my control, and adding that link Excavator was like magic!

aclees86
06-11-2012, 09:29 PM
Hello aclees86,
Floating an element and positioning it are two very different things. Instead of relative, I think absolute positioning for your 4 tabs.

http://www.barelyfitz.com/screencast/html-training/css/positioning/

Thanks Excavator - is this relating to stopping the menu from having an ugly end when you scroll down? If so, I have tried having a look at the positioning of this and it the content boxes end up overlapping the menu. I may be doing something incorrectly though...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum