Weird rendering in Mozilla/Firefox

"Els" <els.aNOSPAM RemoveThis @tiscali.nl> wrote in message
news:Xns950F703D5BA77Els@130.133.1.4...
 > SpaceGirl wrote:
 >
<font color=green>  > > <a style='text-decoration: underline;' href="http://www.subhuman.net/temp/test.htm</font" target="_blank">http://www.subhuman.net/temp/test.htm</font</a>>
  > >
  > > This page is fully validating XHTML. In IE this page
  > > renders perfectly (there's a first! ), but under Mozilla
  > > & Firefox the DIVs sometimes expand deeper than they
  > > should, and for the life of me I cant work out why. You can
  > > see the effect at the bottom edges of the two main boxes.
  > > Oddly, if you keep hitting refresh, eventually Moz will
  > > display it correctly. Hit refresh one more time and it gets
  > > it wrong again. Grrr. It might be missing something really
  > > obvious, but a fresh set of of eyes wouldn't do any harm.
 >
 > I get a log in page, in which I can't see much difference
 > between IE and Firefox. The only thing being that Firefox lets
 > go of the none found images.

The bottom edges of the document in Moz have a weird double tile (at least
on this machine). Not sure what you mean about 'none found images'?

 > <quote>
 > Please wait
 > vOpen is loging you in...
 >
 > log in
 > Username
 > Password
 > </quote>
 >
 > In the code I noticed there is quite some white space before
 > the doctype. Maybe that does some harm?

I thought that too, but doesn't make much difference. Like I said this code
is generated, and for some really stupid reason, Apache Tomcat echos blank
lines whenever blocks of JSP are parsed, which is why there are massive
spaces in the markup. I'm not writing the code behind this site, just the
front end. I did ask if they could kill the spaces and they looked at me as
if I was daft.

 > (and logging is with two g's )

My bad

 >
 > --
 > Els
<font color=purple> > <a style='text-decoration: underline;' href="http://locusmeus.com/</font" target="_blank">http://locusmeus.com/</font</a>>
 > Sonhos vem. Sonhos vão. O resto é imperfeito.
 > - Renato Russo -

Thanks!<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

SpaceGirl wrote:

 > "Els" <els.aNOSPAM.RemoveThis@tiscali.nl> wrote in message
 > news:Xns950F703D5BA77Els@130.133.1.4...
  >> SpaceGirl wrote:
  >>
<font color=brown>   >> > <a style='text-decoration: underline;' href="http://www.subhuman.net/temp/test.htm</font" target="_blank">http://www.subhuman.net/temp/test.htm</font</a>>
   >> >
   >> > This page is fully validating XHTML. In IE this page
   >> > renders perfectly (there's a first! ), but under
   >> > Mozilla & Firefox the DIVs sometimes expand deeper than
   >> > they should, and for the life of me I cant work out why.
   >> > You can see the effect at the bottom edges of the two
   >> > main boxes. Oddly, if you keep hitting refresh,
   >> > eventually Moz will display it correctly. Hit refresh
   >> > one more time and it gets it wrong again. Grrr. It might
   >> > be missing something really obvious, but a fresh set of
   >> > of eyes wouldn't do any harm.
  >>
  >> I get a log in page, in which I can't see much difference
  >> between IE and Firefox. The only thing being that Firefox
  >> lets go of the none found images.
 >
 > The bottom edges of the document in Moz have a weird double
 > tile (at least on this machine).

That's because you wrote this in the code:
<base href="http://localhost:8080/vopen/" />

And this:

   <style type="text/css" media="screen">
@import url(css/vopen.css);
</style>

I don't get your stylesheet
(my localhost only holds my own stuff )

 > Not sure what you mean
 > about 'none found images'?

There are a couple of images, which in IE get the regular
space left open, with a red little cross in it.
Firefox starts of showing the same (space, with red cross),
but then displays plain blank space, no border, no cross,
nothing to indicate there should have been an image there.

  >> <quote>
  >> Please wait
  >> vOpen is loging you in...
  >>
  >> log in
  >> Username
  >> Password
  >> </quote>
  >>
  >> In the code I noticed there is quite some white space
  >> before the doctype. Maybe that does some harm?
 >
 > I thought that too, but doesn't make much difference. Like
 > I said this code is generated, and for some really stupid
 > reason, Apache Tomcat echos blank lines whenever blocks of
 > JSP are parsed, which is why there are massive spaces in
 > the markup. I'm not writing the code behind this site, just
 > the front end. I did ask if they could kill the spaces and
 > they looked at me as if I was daft.

Just look back at them. They're the daft ones.
Upload a stylesheet, and I'll have another look

--
Els
<a style='text-decoration: underline;' href="http://locusmeus.com/" target="_blank">http://locusmeus.com/</a>
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"Els" <els.aNOSPAM.RemoveThis@tiscali.nl> wrote in message
news:Xns950F703D5BA77Els@130.133.1.4...
 > SpaceGirl wrote:
 >
<font color=green>  > > <a style='text-decoration: underline;' href="http://www.subhuman.net/temp/test.htm</font" target="_blank">http://www.subhuman.net/temp/test.htm</font</a>>
  > >
  > > This page is fully validating XHTML. In IE this page
  > > renders perfectly (there's a first! ), but under Mozilla
  > > & Firefox the DIVs sometimes expand deeper than they
  > > should, and for the life of me I cant work out why. You can
  > > see the effect at the bottom edges of the two main boxes.
  > > Oddly, if you keep hitting refresh, eventually Moz will
  > > display it correctly. Hit refresh one more time and it gets
  > > it wrong again. Grrr. It might be missing something really
  > > obvious, but a fresh set of of eyes wouldn't do any harm.
 >
 > I get a log in page, in which I can't see much difference
 > between IE and Firefox. The only thing being that Firefox lets
 > go of the none found images.
 >
 > <quote>
 > Please wait
 > vOpen is loging you in...
 >
 > log in
 > Username
 > Password
 > </quote>
 >
 > In the code I noticed there is quite some white space before
 > the doctype. Maybe that does some harm?
 >
 > (and logging is with two g's )
 >
 > --
 > Els
<font color=purple> > <a style='text-decoration: underline;' href="http://locusmeus.com/</font" target="_blank">http://locusmeus.com/</font</a>>
 > Sonhos vem. Sonhos vão. O resto é imperfeito.
 > - Renato Russo -

Oh my @import was broken; that was tripping the browsers up too. Could you
have a look again?<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

 > Just look back at them. They're the daft ones.



 > Upload a stylesheet, and I'll have another look

Done! Thanks...<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

SpaceGirl wrote:

  >> Just look back at them. They're the daft ones.
 >
 >
 >
  >> Upload a stylesheet, and I'll have another look
 >
 > Done! Thanks...

Steve got there before me, I just have to add one thing:
the same happens on the bottom of the login.bottom.gif, and I
suppose it happens on vopen.top.gif too, although invisible, I'd
add img{display:block;} and fix all instances at the same time.

--
Els
<a style='text-decoration: underline;' href="http://locusmeus.com/" target="_blank">http://locusmeus.com/</a>
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"SpaceGirl" <NOspaceSPAMgirl.RemoveThis@subhuman.net> wrote:

 >http://www.subhuman.net/temp/test.htm
 >
 >This page is fully validating XHTML. In IE this page renders perfectly
 >(there's a first! ), but under Mozilla & Firefox the DIVs sometimes expand
 >deeper than they should, and for the life of me I cant work out why. You can
 >see the effect at the bottom edges of the two main boxes. Oddly, if you keep
 >hitting refresh, eventually Moz will display it correctly. Hit refresh one
 >more time and it gets it wrong again. Grrr. It might be missing something
 >really obvious, but a fresh set of of eyes wouldn't do any harm.

There seem to be two problems.

IE6 is getting the margin-top:100px; wrong on DIV#login and hence is
placing the login box far to high on the page.

Opera and Mozilla are adding some extra space under the image in the
footer and thus the background image shows through, creating the extra
blue line. This can be fixed by adding
div#foot img {display: block;}
to your styles.

Images are inline elements and thus sit on the text baseline. The text
baseline must be above bottom border of the containing div (to allow
room for letters with descenders). By changing the image to a block
the whole issue of baselines and line boxes goes out of the window.
Google for more a in-depth explanation - I gave one in April of this
year.

Oh and the page is usable but messed up in IE5, but you probably
expected that.

  Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve.RemoveThis@pugh.net> <http://steve.pugh.net/><!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"Steve Pugh" <steve.RemoveThis@pugh.net> wrote in message
news:04add0hnestpoetelgbqmk6iitpgqadavq@4ax.com...
 > "SpaceGirl" <NOspaceSPAMgirl.RemoveThis@subhuman.net> wrote:
 >
  > >http://www.subhuman.net/temp/test.htm
  > >
  > >This page is fully validating XHTML. In IE this page renders perfectly
  > >(there's a first! ), but under Mozilla & Firefox the DIVs sometimes
expand
  > >deeper than they should, and for the life of me I cant work out why. You
can
  > >see the effect at the bottom edges of the two main boxes. Oddly, if you
keep
  > >hitting refresh, eventually Moz will display it correctly. Hit refresh
one
  > >more time and it gets it wrong again. Grrr. It might be missing something
  > >really obvious, but a fresh set of of eyes wouldn't do any harm.
 >
 > There seem to be two problems.
 >
 > IE6 is getting the margin-top:100px; wrong on DIV#login and hence is
 > placing the login box far to high on the page.

Yes tryign to work that one out!

 > Opera and Mozilla are adding some extra space under the image in the
 > footer and thus the background image shows through, creating the extra
 > blue line. This can be fixed by adding
 > div#foot img {display: block;}
 > to your styles.

*sighs* I should know better...

 >
 > Images are inline elements and thus sit on the text baseline. The text
 > baseline must be above bottom border of the containing div (to allow
 > room for letters with descenders). By changing the image to a block
 > the whole issue of baselines and line boxes goes out of the window.
 > Google for more a in-depth explanation - I gave one in April of this
 > year.

Your fix work perfectly, of course... I wasn't thinking. Like I said, it'd
be something obvious Thank you so much! I appreciate the time take to
look.

 > Oh and the page is usable but messed up in IE5, but you probably
 > expected that.
 >
 > Steve

Not sure what to do about IE5 users yet... I'll probably use an alternate
CSS file. But of course I dont have access to IE5 any more since I upgraded
my laptop a few weeks ago. Grrr.

Thanks again!

M.<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

SpaceGirl wrote:

 > "Steve Pugh" <steve DeleteThis @pugh.net> wrote in message
 > news:04add0hnestpoetelgbqmk6iitpgqadavq@4ax.com...
  >> "SpaceGirl" <NOspaceSPAMgirl DeleteThis @subhuman.net> wrote:
  >>
   >> >http://www.subhuman.net/temp/test.htm
  >>
  >> Oh and the page is usable but messed up in IE5, but you
  >> probably expected that.
 >
 > Not sure what to do about IE5 users yet... I'll probably
 > use an alternate CSS file. But of course I dont have access
 > to IE5 any more since I upgraded my laptop a few weeks ago.

IE 5 displays just fine if you add body{text-align:center;min-
width:705px} to the stylesheet.
(min-width being added to prevent losing your content on
narrow windowed gecko's)

--
Els
<a style='text-decoration: underline;' href="http://locusmeus.com/" target="_blank">http://locusmeus.com/</a>
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"SpaceGirl" <NOspaceSPAMgirl DeleteThis @subhuman.net> wrote in message
news:2jnp70F143fq6U1@uni-berlin.de...
 >
Not sure what to do about IE5 users yet... I'll probably use an alternate
 > CSS file. But of course I dont have access to IE5 any more since I
upgraded
 > my laptop a few weeks ago. Grrr.

It's quite posible to run more than one version of IE on the same computer.

Google for multiple internet explorer versions. It's the first hit.

--
Cheers
Richard.<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"rf" <rf.RemoveThis@example.com> wrote in message
news:9eyBc.47712$sj4.29678@news-server.bigpond.net.au...
 >
 > "SpaceGirl" <NOspaceSPAMgirl.RemoveThis@subhuman.net> wrote in message
 > news:2jnp70F143fq6U1@uni-berlin.de...
  > >
 > Not sure what to do about IE5 users yet... I'll probably use an alternate
  > > CSS file. But of course I dont have access to IE5 any more since I
 > upgraded
  > > my laptop a few weeks ago. Grrr.
 >
 > It's quite posible to run more than one version of IE on the same
computer.
 >
 > Google for multiple internet explorer versions. It's the first hit.
 >
 > --
 > Cheers
 > Richard.


What can I say, you guys rock!

I have IE 5 and 5.5 running on here prefectly... the site works on both,
Mozilla displays correctly too!

Thanks all!<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox 

"Els" <els.aNOSPAM RemoveThis @tiscali.nl> wrote in message
news:Xns950F78B721077Els@130.133.1.4...
 > SpaceGirl wrote:
 >
  > > "Steve Pugh" <steve RemoveThis @pugh.net> wrote in message
  > > news:04add0hnestpoetelgbqmk6iitpgqadavq@4ax.com...
   > >> "SpaceGirl" <NOspaceSPAMgirl RemoveThis @subhuman.net> wrote:
   > >>
   > >> >http://www.subhuman.net/temp/test.htm
   > >>
   > >> Oh and the page is usable but messed up in IE5, but you
   > >> probably expected that.
  > >
  > > Not sure what to do about IE5 users yet... I'll probably
  > > use an alternate CSS file. But of course I dont have access
  > > to IE5 any more since I upgraded my laptop a few weeks ago.
 >
 > IE 5 displays just fine if you add body{text-align:center;min-
 > width:705px} to the stylesheet.
 > (min-width being added to prevent losing your content on
 > narrow windowed gecko's)
 >
 > --
 > Els
<font color=purple> > <a style='text-decoration: underline;' href="http://locusmeus.com/</font" target="_blank">http://locusmeus.com/</font</a>>
 > Sonhos vem. Sonhos vão. O resto é imperfeito.
 > - Renato Russo -

Perfect! Thanks again Els!<!-- ~MESSAGE_AFTER~ -->
 >> Stay informed about: Weird rendering in Mozilla/Firefox