difference IE an Mozilla

[Knut Krueger]

Hi to all,

http://s013w22.srv13.mw-internet.net/test

does anybody knows the why Firefox and IE are showing the page different?
Mozilla has an unwanted space between the blue banner and the text
containers.
In IE is the background image behind the repeated background image from
the right text.
There are no HTML or CSS errors in the validation.

Thank's in advance
Knut

 

[Beauregard T. Shagnasty]

http://s013w22.srv13.mw-internet.net/test

does anybody knows the why Firefox and IE are showing the page
different? Mozilla has an unwanted space between the blue banner and
the text containers.

There is a space in IE as well, but only above the "The Mozilla Company"
box.

In IE is the background image behind the repeated background image
from the right text.

Sorry, can't translate that sentence.

I will guess that your problem is some combination of all those px's
throughout your style sheet. Since both browsers show it incorrect, it
must be a design flaw.

Oh, points are for printing. Use percentages or em units instead.
"font: 9pt/17pt georgia; "

http://k75s.home.att.net/fontsize.html

There are no HTML or CSS errors in the validation.

That helps...

 

[John Hosking]

http://s013w22.srv13.mw-internet.net/test

does anybody knows the why Firefox and IE are showing the page different?
Mozilla has an unwanted space between the blue banner and the text
containers.

Try margin-top:0; for your h3 rule?

In IE is the background image behind the repeated background image from
the right text.
There are no HTML or CSS errors in the validation.

Maybe not in the validation. But where you have:

#introduction p {
font: italic 12pt/22pt thahoma;
margin: 10px 10px 10px 10px;
text-align:center;
}

I think you might be happier with something like:

#introduction p {
font: italic 1em/1.9 Tahoma, sans-serif;
margin: 10px;
text-align:center;
}

Note that I have used em instead of pt, and 1.9 instead of the roughly
equivalent 22pt, which in either case is a relatively large value. This
is all beside the point, though: the correct font name is more
important, and the generic fall-back font-family helps when Tahoma (or
thahoma ;-) ) is not available to the user. (And: you can also use a
shorthand notation for the four margin values since they are identical.)

HTH

 

[Ben C]

Hi to all,

http://s013w22.srv13.mw-internet.net/test

does anybody knows the why Firefox and IE are showing the page different?
Mozilla has an unwanted space between the blue banner and the text
containers.

Put margin-top: 0 on the h3 as John Hosking suggested, or put
padding-top: 1px on <div id="sunshineheadline"> to keep the h3's margin
inside the div by preventing it from collapsing upwards against the
div's top margin.

 

[Knut Krueger]

Put margin-top: 0 on the h3 as John Hosking suggested, or put
padding-top: 1px on <div id="sunshineheadline"> to keep the h3's margin
inside the div by preventing it from collapsing upwards against the
div's top margin.

Hi Ben, Hi John,
thx just wondering why padding: 0px 0px 0px 0px; does not work.

but the most problem is the difference of the background image.
http://localhost/sunshine/test.jpg
the left sied is Mozilla the right side is IE.
Normally Mozilla is correcting type mismatches, IE does not.
So I think soumting is wrong but I do not find out

Regards Knut

 

[John Hosking]

Hi Ben, Hi John,
thx just wondering why padding: 0px 0px 0px 0px; does not work.

Do you mean, you tried padding: 0px 0px 0px 0px; on #sunshineheadline
and it didn't help? (As I understand Ben's suggestion, we're trying to
move the <h3> back down a bit, away from the top of the div. 0px [which
you've already got] wouldn't do that.) Or are you talking about
something else?

but the most problem is the difference of the background image.
http://localhost/sunshine/test.jpg

Not a useful link for us... ;-)

the left sied is Mozilla the right side is IE.
Normally Mozilla is correcting type mismatches, IE does not.

Without seeing the image, I can't be sure what you are talking about.
But I would say it's usually IE that comes up with some lenient
allowance (ein bisschen Kulanz) when faced with invalid code (which was
probably produced by FrontPage or other MS "product").

 

[Knut Krueger]

Not a useful link for us... ;-)

just for testing your logical skills ;-)
http://s013w22.srv13.mw-internet.net/test/test.jpg

 

[Knut Krueger]

Hi Ben, Hi John

your hint about the H3 headline was helpful in another way:

I disabled all from the top to the container
(means #container is the first declaration)
and IE is now displaying the background fine.
I was looking at the wrong end of the code.

Now I could findout the wrong part of code.

Do you mean, you tried padding: 0px 0px 0px 0px; on #sunshineheadline
and it didn't help?

yes i was a little bit confused about that ...
(As I understand Ben's suggestion, we're trying to

move the <h3> back down a bit, away from the top of the div. 0px [which
you've already got] wouldn't do that.) Or are you talking about
something else?

working:
#sunshineheadline{

background: url(body2.jpg) repeat-x top left;
background-repeat:repeat-x;
clear:right;
padding-top: 1px

}
not working:

#sunshineheadline{

background: url(body2.jpg) repeat-x top left;
background-repeat:repeat-x;
clear:right;
padding: 0px 0px 0px 0px;

}


#sunshineheadline{

background: url(body2.jpg) repeat-x top left;
background-repeat:repeat-x;
clear:right;
padding: 0px;

}

 

[Knut Krueger]

Hi Ben, Hi John

your hint about the H3 headline was helpful in another way:

I disabled all from the top to the container
(means #container is the first declaration)
and IE is now displaying the background fine.
I was looking at the wrong end of the code.

Now I could findout the wrong part of code.

found it but do not understand why ...
it is the 12pt command of:

h3 {
font: italic normal 12pt georgia;
letter-spacing: 1px;/
margin-bottom: 0px; */
color: #7D775C;
}

Whats wrong with that?
Regards Knut

 

[Knut Krueger]

Hi again ...
another question and a problem.
The problem are my tired eys;-)
The basic layout works fine in IE, but now there is a question for Firefox.
The background is appearing instead the blue colour if the window is
very small so that the red letters will switch under the flags.
This works fine in IE.
- no HTML and CSS validation errors -

REgards Knut

 

[Knut Krueger]

Hi again ...
another question and a problem.
The problem are my tired eys;-)
The basic layout works fine in IE, but now there is a question for Firefox.
The background is appearing instead the blue colour if the window is
very small so that the red letters will switch under the flags.
This works fine in IE.
-

Did not found this solution, but a better one - overflow:hidden;

Knut