Part of Site dissappears in IE6

I am having issues getting this site to render the call to action buttons on the top of this page in IE6.

The site works fine in IE8, 9, 10, Firefox, Chrome, Safari and Opera but for some reason it doesnt work in IE6.

Now I normally wouldn’t worry about IE6 due to the fact that is nearly died out completely but it is still quite a popular browser for locked down corporate networks using legacy software.

The page linked below and every other page on the website except the home page has this problem, you can see what I am talking about by clicking here.

If anyone can help it would be much appreciated.

See the below list of issues i have found:

  1. Your calls-to-action class has an absolute position which is causing it to fall behind other elements in the DOM, simply remove this property and it will appear again
  2. You text-content class has a top offset of 250px which is pushing the content way down, it doesn’t need this property

Once you do that it should look relatively the same in IE6 but i wouldn’t even bother with it due to the fact you stated which is it’s old and unsupported.

Thanks Chris, if you don’t mind me asking how did you go about troubleshooting this, did you just look for rules that looked like they didnt belong or did you use a special tool for IE6?

Yeah your right, I did forget to mention my reason for support though, and that is quite a few of their daytime visitors will be visiting from a corporate environment and unfortunately these guys may be forced to use IE6.

In general the page is filled with issues and broken methodologies – not just in terms of layout but in terms of accessibility like the illegible grey text on white, px metric fonts on content paragraphs at a uselessly small size…

But under the hood? nonsensical/broken heading orders, endless redundant CSS, comment placements that could be tripping renderign bugs in specific versions of IE and FF, (yes, I said COMMENTS!)… in fact… hah, your comments could be tripping the ‘disappearing content’ bug in IE! Putting comments where they could end up between sibling level elements can make large sections of a page in IE and some versions of FF just ‘disappear’ – or worse, render twice slightly offset on top of itself (the ‘double render’ bug).

So step one, move all those comments INSIDE the tag being closed instead of after.
</div>
<!–end header wrapper div–>
<div class=“content-wrapper”>

It’s between them… comments like that could be your problem. There’s a reason I usually write my comments thus:

<!-- #header –></div>

Notice I don’t say end… really? </div> is the end of something? :smiley:

In general though the markup is gibberish – multiple H1’s, h2 preceeding the h1, endless wrapping DIV for christmas only knows what… Static CSS inlined in the markup, validation errors (admittedly nothing that would effect rendering, but still), the use of empty anchors with both name and ID to do what an ID on the parent wrapper could handle all by itself…

That it even has to resort to this:
<meta http-equiv=“X-UA-Compatible” content=“IE=EmulateIE8” >

To tell IE9 to pretend to be it’s sweetly retarded little brother… means the entire page is built with flawed methodologies… ESPECIALLY if you want it to work in IE6.

I’d say about… a fifth of your code belongs on the cutting room floor, maybe more. If I was writing that same page the HTML would probably go something like this:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html
	xmlns="http://www.w3.org/1999/xhtml"
	lang="en"
	xml:lang="en"
><head>

<meta
	http-equiv="Content-Type"
	content="text/html; charset=utf-8"
/>

<meta
	name="viewport"
	content="width=device-width; initial-scale=1.0;"
/>
	
<link
	type="text/css"
	rel="stylesheet"
	href="/theme/screen.css"
	media="screen,projection,tv"
/>

<title>
	Financial Lifestyle Solutions
</title>

</head><body>

<div id="pageWrapper">

	<h1>
		Financial Lifestyle <span>Solutions <span>-</span></span>
		<small>
			Specialising in disability &amp; injury claims and financial &amp; business planning
		</small>
	</h1>
	
	<div id="phone">08 8100 3303</div>
	
	<ul id="mainMenu">
		<li><a href="../index-a.html" >home</a></li>
		<li><a href="injuries-and-disability.html">injuries &amp; disability</a></li>
		<li><a href="centrelink.html">centrelink</a></li>
		<li><a href="financial-planning.html">financial &amp; business planning</a></li>
		<li><a href="strategic-partners.html">strategic partners</a></li>
		<li><a href="about-us.html" class="current">about us</a></li>
		<li><a href="book-an-appointment.html">book an appointment</a></li>
		<li><a href="contact-us.html" class="quote">Contact Us</a></li>
	</ul>
	
	<hr />
	
	<ul id="callsToAction">
		<li>
			<a href="#AboutUs">
				<strong>About Our Team <span>-</span></strong>
				Find out more about our Staff, see their Individual Profiles here!
			</a>
		</li><li>
			<a href="#Compliance">
				<strong>Compliance (FSG &amp; AFSL) <span>-</span></strong>
				We are a fully compliant Financial Organisation, read more.
			</a>
		</li><li>
			<a href="#CaseStudies">
				<strong>Case Studies <span>-</span></strong>
				Find out how we have helped others just like you!
			</a>
		</li>
	</ul>
	
	<div id="AboutUs" class="subSecton">
			
		<h2>About Our Team</h2>
		
		<h3>
			<img
				src="../images/staff-photos/Ken-Field.png"
				width="123" height="123"
				alt="Photograph of Ken Field"
				class="leadingPlate"
			/>
			Ken Field - Adv. Dip. FS (FP) <span>-</span>
			<small>
				Owner and Founder of Financial Lifestyle Solutions
			</small>
		</h3>
		<p>
			With a financial Services career that has spanned over 3 decades, Ken Field has realised through his client&#8217;s experiences that therecwas a need within the Financial Services Industry for Compensation and Forensic financial expert planning.
		</p><p>
			With this goal in mind he established FLS in 2004 and his firm is now renowned as a highly specialised  practice that works with clients who require assistance with compensation	payouts, reinvestment strategy, forensic detection of superannuation and	insurance policies with the view of creating expert long term financial strategies.
		</p><p>
			Along with Ken, FLS have two other specialist advisers,	Helen Arthur (Ad Dip FS FP), and Catherine Calikes (Ad Dip FS FP) who together	with Ken offer over 50 years	experience within the Australian Financial Services Industry.
		</p><p>
			This unique offering gives their valued clients, along with	their families, peace of mind knowing that FLS is looking after their future	financial independence.
		</p><p>
			FLS also work closely with their clients to assist them with	 all their other financial and wealth protection requirements through their	 close business associations with like minded firms specialising in accounting,	 law and finance brokering.
		</p>
		
		<h3>
			<img
				src="../images/staff-photos/Helen-Arthur.png"
				width="123" height="123"
				alt="Photograph of Helen Arthur"
				class="leadingPlate"
			/>
			Helen Arthur - Adv. Dip. FS (FP) <span>-</span>
			<small>
				Specialising in Claims Management, Income and Retirement Planning
			</small>
		</h3>
		<p>
			Helen commenced working with Financial Lifestyle	 Solutions in 2007 and assists Ken in all aspects of the business and practice	management.* Helen is an authorized	 representative of Millennium3 Financial Services Pty Ltd # 335658.* Helen offers over 20 years experience in the	 banking and financial services industry.
		</p><p>
			Helen has an Advanced Diploma in Financial services	(Financial Planning) and specializes in Claims Management, Centrelink, Disability	 Income Streams and Retirement planning.
		</p>
		
		<h3>
			<img
				src="../images/staff-photos/Catherine-Calikes.png"
				width="123" height="123"
				alt="Photograph of Catherine Calikes"
				class="leadingPlate"
			/>
			Catherine Calikes - Adv. Dip. FS (FP) <span>-</span>
			<small>
				Specialising in Risk Management and wealth protection for Individuals, Families, and Businesses.
			</small>
		</h3>
		<p>
			Catherine commenced working as an adviser with	 Financial Lifestyle Solutions in 2011 and is an authorized representative of	 Millennium3 Financial Services Pty Ltd #303184. *Catherine offers over 10 years experience in	the financial services industry.
		</p><p>
			Catherine has an Advanced Diploma in Financial	 services (Financial Planning) and is currently studying the Fellow Chartered	 Financial Planner (FChFP).* Catherine	specializes in personal &amp; business wealth protection and Self Managed Super	 funds.
		</p>
		
		<h3>
			<img
				src="../images/staff-photos/Tahlea-Stephenson.png"
				width="123" height="123"
				alt="Photograph of Tahlea Stephenson"
				class="leadingPlate"
			/>
			Tahlea Stephenson - Claims Officer <span>-</span>
			<small>
				Specialsing in Claims and Office Administration
			</small>
		</h3>
		<p>
			Tahlea commenced working with Financial Lifestyle	Solutions in 2010 as a trainee receptionist and is now the claims officer and	 administration assistant.
		</p><p>
			Tahlea is currently studying the Diploma in Financial	services (Financial Planning).
		</p>
		
	<!-- #aboutUs--></div>
	
	<div id="compliance" class="subSection">
	
		<h2>Compliance (FSG &amp; AFSL)</h2>
		
		<h3>
			Financial Services Guide <span>-</span>
			<small>Brief Description of what this guide is for.</small>
		</h3>
		<a href="#" class="downloadLink">
			<img
				src="../images/pdf.png"
				width="56" height="45"
				alt="Adobe Acrobat Icon"
			/>
			Download our Financial Services Guide
		</a>
		<p>
			If you have any queries about compliance issues please contact us.
		</p>
		
		<h3>
			Millennium3 privacy policy <span>-</span>
			<small>
				As professional advisers, we are committed to ensuring the confidentiality and security of your personal information. Our privacy policy, which details how your personal information is managed and protected.
			</small>
		</h3>
		<a href="source%20text/M3%20Privacy%20Policy%20July%202011.pdf" class="downloadLink">
			<img
				src="../images/pdf.png"
				width="56" height="45"
				alt="Adobe Acrobat Icon"
			/>
			Downlaod Millennium3's Privacy Policy
		</a>
		<p>
			If you have any queries about compliance issues please contact us.
		</p>
		
	<!-- #compliance --></div>
	
	<div id="caseStudies">
	
		<h2>Case Studies</h2>
			
		<h3>
			Hidden Claim Case Study <span>-</span>
			<small>
				This Case Study will focus on how FLS has managed to find Claims people did not know existed.
			</small>
		</h3>
		<p>
			Toni was a 40 year old female who previously worked in	 the hospitality industry referred by her solicitor.* She was suffering severe post traumatic	 stress and had not worked for 4 years.* After	extensive research we were able to locate some insurance and subsequently	 lodged 3 claims which were all subsequently approved for the combined sum of $267,000.* Toni was not eligible for Centrelink benefits	for approximately 2 ½ years and we were able to commence an income stream for	 her to receive a regular income.* Toni is	now recovering and is attempting to return to the workforce on a part-time	basis.
		</p>
		
		<h3>
			Client Testimonial <span>-</span>
			<small>
				Toni's Testimonial
			</small>
		</h3>
		<blockquote>
			<p>
				"Financial Lifestyle Solutions is very much like a	financial family to me. They have ensured a financial stability that has	enabled me to be free to commit to other aspects of my life without being	 troubled about money. Their support, guidance and attention to detail in	 regards to what financial package would be best for my particular situation has	changed my life and I&rsquo;m extremely thankful to have them as my financial support	 base."
			</p>
		</blockquote>
			
		<h3>
			Centrelink Case Study <span>-</span>
			<small>
				Maximising benefits for our Clients and taking the hassle out of dealing with Centrelink.
			</small>
		</h3>
		<p>
			Ever get the runaround from Centrelink? Have you called them on several occassions and each time they have given you a completely different answer to the same question?
		</p><p>
			Ken Field is fully experienced and knowledgable on Centrelink's Policies and Regulations and has been able to prevent Centrelink from giving clients the runaround on several occassions with just one call.
		</p><p>
			Ken and other staff members	can help you with any issues you may have with Centrelink including the option of acting on your behalf as a Centrelink appointed nominee. By having Financial Lifestyle Solutions act on your behalf the hassle of dealing with Centrelink is removed.
		</p><p>
			<a href="centrelink.html#CentreLinkNominee">If you wish to find out more about how we can act on your behalf as a Centrelink Appoiinted Nominee click here.</a>
		</p>
		
	<!-- #caseStudies --></div>
	
	<hr />
	
	<div id="footer">
		<ul>
			<li>
				<a
					href="injuries-and-disability.html#Claim"
					title="Financial Lifestyle Solutions"
				>
					can I make a	claim?
				</a>
			</li><li>
				<a href="book-an-appointment.html">
					book an appointment
				</a></li>
			<li>
				<a href="financial-planning.html">
					financial &amp; business planning
				</a>
			</li>
		</ul>
		
		<p>
			Ken Field &amp; Associates Pty Ltd trading as Financial Lifestyle Solutions is a corporate Authorised representative and Ken Field, Helen Arthur and Catherine Calikes are Authorised Representatives of Millennium 3 Financial Services.
		</p><p>
			ABN 61 094 529 987 ASFL No. 244252, Unit 7, 50 Borthwick Ave Murarrie Qld 4172
		</p><p>
			This website contains information for australian residents only &copy; financial lifestyle solutions - all rights reserved
		</p>
	<!-- #footer --></div>
	
<!-- #pageWrapper --></div>

</body></html>

Though much of the page is filled with “not viable for web deployment” concepts like the menu, which forces you into a fixed width layout (and is hard to tell where anything begins or ends), etc, etc… I’d seriously be looking at a total redesign before even thinking about the CSS (or more specifically, while writing the CSS) to open it up semi-fluid and to make it possible to target mobile with media queries.

If I have time later when I’m at my workstation I’ll toss together the CSS I’d use to recreate what you have; though what you have is filled with issues and isn’t something I’d be putting online as a website.

Here’s that rewrite:
http://www.cutcodedown.com/for_others/WavyDavy/template.html

As with all my examples the directory:
http://www.cutcodedown.com/for_others/WavyDavy

…is open for access to the bits and pieces. Works all the way back to IE 5.5. Did the little corner cuts using CSS3 instead of images - oh noes, legacy IE gets square corners, not that! :smiley:

Basically threw out your existing CSS to do it, just as I redid the markup. If you want we can go through that piece by piece to explain the how/why/where of it.

Design wise I darkened the fonts to meet accessibility minimums, changed the important stuff to %/em so the fonts automatically enlarge, changed the layout itself to elastic so it too enlarges for users who want that – though again to be frank, the menu and those internal links are not what I consider ‘viable’ design elements. I’d probably move the ‘contact us’ out of the menu and below the phone number if you really want that styled different, then center the menu items and increase their padding, possibly letting them go to multiple lines… the internal links? Waste of bandwidth, I’d axe that entirely… then the layout could be ‘opened up’ to fluid so it actually adjusts to different size screens.

Or at least, that’s what I’d be doing if you care about accessibility and having people able to actually use the page.

Dude the site looks fine in mobile browsers which I am not aiming for anyway, the legal small print in the footer is supposed to be small print, because heck thats what small print is, rounded corners look atrocious for that particular layout, the menu is fine and did not need to be made bold and I have no idea how you managed to make the font look worse on the calls to action, but you did. As for fixed width vs elastic or fluid layouts, that argument has been done to death on the web already so I am not going to get into that argument, plenty of stuff on google for and against but nothing conclusive one way or another.

You might know a fair bit about the technical issues regarding css but you seriously cant design for **** if what you have done to my webpage is any example of your work.

Is my code messy? Yes it is, it could do with a bit of tidying up, sure, it most probably could, but as far as your outrageous comment about all my code being totally useless, I have never heard something so over the top in my entire life.

MY CODE WORKS IN ALL BROWSERS and looks consistently the same in all of them THAT IS ALL YOU NEED!!!

Most of the ridiculous arguments you made against my design could be made against this very page I am posting on.

Perhaps you should have spent your time actually building your own website instead of trying to fix the imaginary problems in my code that just so happens to work in all browsers, I sure as hell dont appreciate it nor did I ask for you to build it.

PLEASE TAKE DOWN YOUR UNAUTHORISED USE OF MY DESIGN FROM YOUR WEBSITE IMMEDIATELY, IF YOU DONT YOUR WEB HOST WILL BE GETTING A DMCA NOTICE POST HASTE!!!

Well talk about getting one’s panties in a twist over someone trying to help --I will take it down, but you should be aware that it was behind a robots.txt so search engines wouldn’t see it. That redo seems much better here as at least it works cross browser – yours does not. Tweaking things like the fonts is up to you; but to say what you have is better is… just wow given what it does here.

Maybe you should take the time to accept help at improving what you have when offered, instead of immediately kneejerking into “Wah, wah, isn’t so”… You have illogical heading orders, mis-use of tags, elements that don’t even exist in your doctype, poor comment placements that can trip rendering errors, and a whole host of other things that explain why I’m seeing four different broken layouts in four different browser engines… any of those could be contributing to your IE problem; and why I’m seeing a broken layout here.

If that’s your idea of works in all browsers – when you came here complaining about it not working in a browser – then you need to step back and take a perspective pill!

You have problems… you posted about having a problem – but you don’t want actual help fixing them… so… why are you here?

Let’s keep the discussion civil, please. Danke.

Off Topic:

WavyDavy, I did see the site deathshadow did and I must say, I did find it was visually more harmonious, and easier on the eyes. I do understand that this wasn’t what you were asking for, obviously, but I think there were some essential points addressed (like contrast) which indeed is a bit lacking on your site. I do have to squeeze my eyes to read the text.

You may not like deathshadow’s design style, but putting emphasis on better contrast is something that should not be ignored. There are even new sites dedicated to just that: http://contrastrebellion.com/

Just a thought. :slight_smile: