...

View Full Version : Annoying height error!



Crispy
12-03-2009, 03:28 PM
I'm having a height error in google chrome, and I really can't figure it out it works fine in FF.

Here is the live version (test):
http://fier.co.uk/test/index.php

I'm trying to fix the (our services) on the left. It looks fine in FF but it's messed up in Chrome, I'm not sure how to fix it? Any ideas?

Alternatively does anyone know how I can write an IF Chrome css hack?
(don't worry about the right hand side, it's not done yet)

Thanks!

Crispy
12-03-2009, 03:28 PM
I know this is probably a very simple error I'm missing! - I'm going to validate after I fix this bug by the way. Thanks

abduraooft
12-03-2009, 03:34 PM
Fix the errors in your markup first, see http://validator.w3.org/check?uri=http%3A%2F%2Ffier.co.uk%2Ftest%2Findex.php&charset=%28detect+automatically%29&doctype=Inline&group=0

Crispy
12-03-2009, 04:36 PM
it's all verified, the only errors are coming from the twitter script (java) which I have no idea how to fix :(. But i still have the wierd height error?

Crispy
12-03-2009, 05:06 PM
Validates 100% now, woo. Anyone got any ideas on my height error? still can't find the problem source

Excavator
12-03-2009, 05:16 PM
Hello Crispy,

Good job on the valid code!

I can't see the error in FF, IE8 or IE7 but I do notice that your not clearing your floats in #services. Add a color to that div and you'll see what I mean, like this:
#services {width:380px; margin-top:54px; line-height:1;background: #f00;}

Clear the floats by adding overflow: auto; to the CSS for #services. Here's a site (http://www.quirksmode.org/css/clearing.html) that explains how that works.

Not sure that fixes the issue though.

Crispy
12-03-2009, 05:26 PM
Hello Crispy,

Good job on the valid code!

I can't see the error in FF, IE8 or IE7 but I do notice that your not clearing your floats in #services. Add a color to that div and you'll see what I mean, like this:
#services {width:380px; margin-top:54px; line-height:1;background: #f00;}

Clear the floats by adding overflow: auto; to the CSS for #services. Here's a site (http://www.quirksmode.org/css/clearing.html) that explains how that works.

Not sure that fixes the issue though.

Thanks for the advice, unfortunately It didn't fix the problem :(. I kind of don't understand clearing floats though, that website seems to be based around adding a border to a div? I added the background but it kind of works how I want it too? Sorry If I don't make sense lol

Crispy
12-03-2009, 05:29 PM
Oh, I understand what you mean, didn't fix it though, damn.!

Crispy
12-03-2009, 08:17 PM
anyone?

drhowarddrfine
12-03-2009, 08:30 PM
Crispy, stay on this forum not the other one. Mostly deadheads there but for two or three...and then there's me but I'm only there to make fun of people.

Look at Safari if you can to see if it's the same. Opera looks like Chrome so I'm wondering if this is a Firefox issue but Excavator said it looks the same in IE7/8. I was doing some hunting around on this but I'm just not used to where to find issues with Chrome yet. This is a strange one.

drhowarddrfine
12-03-2009, 08:32 PM
btw, looking at the source using Chrome's developer tool, it shows the doctype as the HTML5 doctype. Interesting and I'm wondering how that affects things though it's not supposed to.

drhowarddrfine
12-03-2009, 09:59 PM
So it looks the same in Safari and Chrome but correctly in FF, Opera and IE



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum