Perfect in IE but not in FF 1

[aspvbnetnerd]

The site is exacly what I want it to be with Internet Explorer, but when I view it with firefox. It looks ugly as hell.

The site

http://george.hostingbolaget.se/

I have tried to fix as much as I can, but it doesn't get better then this.

Could anyone please try to help me?

George

 

[cLFlaVA]

start here and let us know when those errors are fixed.



*cLFlaVA
----------------------------
[tt]mr. pibb + red vines = crazy delicious![/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[Vragabond]

And begin by adding a complete and valid doctype to your site:

http://www.w3.org/QA/2002/04/valid-dtd-list.html

 

[aspvbnetnerd]

okey, I will come back the errors are fixed

 

[aspvbnetnerd]

Every time I ask a question I get the same answer.
Fix the validation and come back later .

Now all the error are fixed.

Could you please help me now?

George

 

[Vragabond]

First, IE still renders your page in quirks mode, because IE cannot have anything above the doctype. Your xml declaration throws IE off but does nothing else.

Next, your container cannot be 100% because a percentage container must need to have a parent with a defined height. According to standards, the canvas is html element, so giving html and body 100% height would help your container be 100% in standards compliant browsers.

Finally, in CSS you need to provide units for every value. This [tt]margin:110 0 0 5px[/tt] says there should be 5px margin on the right, but all the other margin units are omitted and as such the browser is confused. With 0 values omitting is ok, but 110 of what is your top margin? The final pixel applies only to the final value, not to the all line.

That should help a bit.

 

[gmmastros]

Take a look at this thread: thread215-1164402

After installing the Developer toolbar for IE, validate your CSS. When I checked, there were a ton of problems.

http://jigsaw.w3.org/css-validator/...arning=2&uri=http://george.hostingbolaget.se/

-George

Strong and bitter words indicate a weak cause. - Fortune cookie wisdom

 

[aspvbnetnerd]

Vragabond, thanks for explanation.
I changed it to position:absolute; and now it all my divs looks the same in FF and IE.

One problem remains if you could help me with it. I would be very thankful.

Why isn't my <div class="test"> White?
This is my class test in style.css
.test
{
height:100%;
width:775px;
background-color: #FFFFFF;
border-right:1px solid #cccccc;
}

gmmastros, to be honest I have never thought about validating the CSS and thanks for the nice link?
I will install that later after the last problem is solved?

Any ideas?


George

 

[Vragabond]

One of the worst things to do is not to read the suggestions people give you. Please check my 'Next' paragraph -- it deals with exactly that.

 

[aspvbnetnerd]

I'm sorry vragabond. I read your post and so changed it to height:600px; in the test class and then it worked.

Thanks for the help.