«

http://larryludwick.com/menu1.php

with larryludwick.com/menu1.css and menu.js

Three questions please.
1. I have specified box widths in px and I am happy with how it works in
FF, but IE6 seems to throw in 2 phantom pixels which makes the float right
box wrap. Adding two pixels to the width of the wrapper box makes it look
correct in IE6, but it causes FF to leave a little gutter between the float
left and float right boxes. Why is that.

2. The javascript for the clock works ok in IE6, but not in FF. Howcome???
(I copied from a website -- I am learning JS, but slowly. PHP is much
easier.)

3. The Dilbert flash app is in a <div> and it works ok. I added another
<div> inside the Dilbertbox to put a link to my email. It works just fine
in IE6, but the email div shows up outside the dilbertbox div when viewed in
Firefox. What gives here?

Thanks for any help you are willing to provide.

Larry

P.S. The Dilbert thingy has grown old already and will go away soon.
Having that thing on my homepage when it's only useful once a day no longer
makes sense to me. It seemed like a good idea at the time, but . . .

In alt.html on Sat, 9 Aug 2008 19:10:12 -0400, Phonedude
<> wrote:

> http://larryludwick.com/menu1.php
>
> with larryludwick.com/menu1.css and menu.js
>
> Three questions please.
> 1. I have specified box widths in px

This is a bad idea.

> and I am happy with how it works in
> FF, but IE6 seems to throw in 2 phantom pixels which makes the float right
> box wrap.

This is one of the reasons why specifying dimensions in pixels is a bad idea.

> Adding two pixels to the width of the wrapper box makes it look
> correct in IE6, but it causes FF to leave a little gutter between the float
> left and float right boxes. Why is that.

It's because you're using pixels instead of non-deprecated units.

> 2. The javascript for the clock works ok in IE6, but not in FF. Howcome???
> (I copied from a website -- I am learning JS, but slowly. PHP is much
> easier.)

Dunno. What clock? In Konqueror 3.5.9 I see no clock.

> 3. The Dilbert flash app is in a <div> and it works ok.

Yes it does, even in Konqueror.

> I added another
> <div> inside the Dilbertbox to put a link to my email. It works just fine
> in IE6, but the email div shows up outside the dilbertbox div when viewed in
> Firefox. What gives here?

On my screen, the email link overlaps the W3C images.

> Thanks for any help you are willing to provide.

I think you should aim to simplify. E.g., do you really need Javascript to
display a clock? Some of your visitors may own clocks of their own.


--
PJR

,http://slrn-doc.sourceforge.net/>
<http://pjr.lasnobberia.net/>

In article <g7l84n$3gu$>, "Phonedude" <>
wrote:

> http://larryludwick.com/menu1.php
>
> with larryludwick.com/menu1.css and menu.js
>
> Three questions please.
> 1. I have specified box widths in px and I am happy with how it works in
> FF, but IE6 seems to throw in 2 phantom pixels which makes the float right
> box wrap. Adding two pixels to the width of the wrapper box makes it look
> correct in IE6, but it causes FF to leave a little gutter between the float
> left and float right boxes. Why is that.

It sounds like you are running into what is often called the 3px float
bug that IE6. Google it up to see all the ways to cope with it.

Here is one way: in your CSS you have

..infobox {
...
margin:0 0 0 5px;
}

But, presumably you want less. Lets suppose for a moment that you want
no margin at all (everything tightly up to everything else). You would
then remove the 3px that IE6 adds by telling IE6 (but no other browser)
to give that right margin minus 3px.

You would be wanting IE6 to see:

..infobox {
...
margin: -3px;
}

There are different ways of telling IE6 to do this. One way is make a
separate external style sheet for IE6 and link it in your head via a
conditional comment (ask if you don't know what this means). In that
sheet, you would have the corrective for IE6.

Another way is to simply put

..infobox {
...
margin:0;
}

in your normal stylesheet and then just after, something that only IE6
can read (it thinks there is an element higher than the root html)

* html .infobox {margin:-3px;}

You might adapt the figures but the principle is simple, you tell IE6 to
take back the 3px it added. In other words: Thanks, but no thanks! <g>

(Although many people think it is a bug, I have been going along with
the theory that we have here an annoying case of MS being deliberately
motivated by a desire to give a bit of padding (in case the author
forgets!). One of the most common uses of floats has been for inserting
pictures into text. A bit of grace is nice. But modern day layouts often
depend on floats and this is a pesky thing to have to cope with MS's
shortsighted but good intentions.)

--
dorayme

In article <g7l84n$3gu$>, "Phonedude" <>
wrote:

> http://larryludwick.com/menu1.php
>
> 3. The Dilbert flash app is in a <div> and it works ok. I added another
> <div> inside the Dilbertbox to put a link to my email. It works just fine
> in IE6, but the email div shows up outside the dilbertbox div when viewed in
> Firefox. What gives here?
>
> Thanks for any help you are willing to provide.


As for this, give your dilbertbox a greater height, 440px would be more
like it than 340px.

(btw, your layout looks a bit crowded in FF, the material under the
three boxes butting up so close to the above boxes. Easy to fix)

--
dorayme

Peter J Ross wrote:
>
> you're using pixels instead of non-deprecated units.

When were px deprecated?

--
Berg

> 3. The Dilbert flash app is in a <div> and it works ok. I added another
> <div> inside the Dilbertbox to put a link to my email. It works just fine
> in IE6, but the email div shows up outside the dilbertbox div when viewed in
> Firefox. What gives here?

It's not a div, it's a paragraph. Delete its height, margin, padding and
width attributes, and it looks better.

I dont' see a clock either, it's an empty div.

Google image is distorted, delete the img properties from the css, at
least the width if you want to keep the height.

--
Ari

"Peter J Ross" <> wrote in message
news:...
> In alt.html on Sat, 9 Aug 2008 19:10:12 -0400, Phonedude
> <> wrote:
>
>> http://larryludwick.com/menu1.php
>>
>> with larryludwick.com/menu1.css and menu.js
>>
>> Three questions please.
>> 1. I have specified box widths in px
>
> This is a bad idea.
>
>> and I am happy with how it works in
>> FF, but IE6 seems to throw in 2 phantom pixels which makes the float
>> right
>> box wrap.
>
> This is one of the reasons why specifying dimensions in pixels is a bad
> idea.
>
>> Adding two pixels to the width of the wrapper box makes it look
>> correct in IE6, but it causes FF to leave a little gutter between the
>> float
>> left and float right boxes. Why is that.
>
> It's because you're using pixels instead of non-deprecated units.
>
>> 2. The javascript for the clock works ok in IE6, but not in FF.
>> Howcome???
>> (I copied from a website -- I am learning JS, but slowly. PHP is much
>> easier.)
>
> Dunno. What clock? In Konqueror 3.5.9 I see no clock.
>
>> 3. The Dilbert flash app is in a <div> and it works ok.
>
> Yes it does, even in Konqueror.
>
>> I added another
>> <div> inside the Dilbertbox to put a link to my email. It works just
>> fine
>> in IE6, but the email div shows up outside the dilbertbox div when viewed
>> in
>> Firefox. What gives here?
>
> On my screen, the email link overlaps the W3C images.
>
>> Thanks for any help you are willing to provide.
>
> I think you should aim to simplify. E.g., do you really need Javascript to
> display a clock? Some of your visitors may own clocks of their own.
>
>
> --
> PJR
>
> ,http://slrn-doc.sourceforge.net/>
> <http://pjr.lasnobberia.net/>

Thanks for the input. I was suprised to see that length is pixels is
deprecated, as this will require me to readdress my entire philosophy for my
website. You see this particular website is simply my personal links page,
which other people use as a matter of convenience. It's primary target
audience is me. When I started my page many years ago it was a simple table
that I created in notepad. Then I got lazy and started using MS Word to
edit it which produced HTML so complex and convoluted that I stopped looking
at it and just used the page. Wanting to become more proficient I decided
to redo my page using CSS and not tables for layout purposes. But: I want
my page to look the way I want it. I want it to be a set width on my screen
and I want the boxs to blend together nicely with no wrapping. Having said
that, I do want to learn how to make it work with different browsers.
Especially Firefox which seems to, along with IE, make up most of the
market. I don't think anyone using Konquerer would be interested in using
my page, but it would be nice if it were at least usable, if not perfect in
presentation.

But, back to pixels. I am an anal type and if I specify my wrapper <div> to
have, say, 880 pixels, then I want to be able to put in 880 pixels of stuff.
Not 798. Make sense? Firefox works perfectly when I do this, but IE seems
to have a bug. At least IE6. I guess I will have to learn how to
distinguish between browsers and use separate style sheets.

The clock seems only to work in IE. It doesn't work in FF and now you tell
me it doesn't work in Konquerer. More study required, I guess. As to the
necessity of a clock on my page, I am rethinking that as well. I use
Windows so it's easy to simply look at the Windows clock at bottom right.
What I really need is a simple calendar on my page so I can see what date
and day it is (I often lose track) because Windows does not always show this
without actually opening the clock app. A calendar I could do in php
because it would only need to work each time the page is opened or
refreshed. Like the quotes do.

Again, thanks for the input.

Larry

"dorayme" <> wrote in message
news:doraymeRidThis-...
> In article <g7l84n$3gu$>, "Phonedude" <>
> wrote:
>
>> http://larryludwick.com/menu1.php
>>
>> with larryludwick.com/menu1.css and menu.js
>>
>> Three questions please.
>> 1. I have specified box widths in px and I am happy with how it works in
>> FF, but IE6 seems to throw in 2 phantom pixels which makes the float
>> right
>> box wrap. Adding two pixels to the width of the wrapper box makes it
>> look
>> correct in IE6, but it causes FF to leave a little gutter between the
>> float
>> left and float right boxes. Why is that.
>
> It sounds like you are running into what is often called the 3px float
> bug that IE6. Google it up to see all the ways to cope with it.
>
> Here is one way: in your CSS you have
>
> .infobox {
> ...
> margin:0 0 0 5px;
> }
>
> But, presumably you want less. Lets suppose for a moment that you want
> no margin at all (everything tightly up to everything else). You would
> then remove the 3px that IE6 adds by telling IE6 (but no other browser)
> to give that right margin minus 3px.
>
> You would be wanting IE6 to see:
>
> .infobox {
> ...
> margin: -3px;
> }
>
> There are different ways of telling IE6 to do this. One way is make a
> separate external style sheet for IE6 and link it in your head via a
> conditional comment (ask if you don't know what this means). In that
> sheet, you would have the corrective for IE6.
>
> Another way is to simply put
>
> .infobox {
> ...
> margin:0;
> }
>
> in your normal stylesheet and then just after, something that only IE6
> can read (it thinks there is an element higher than the root html)
>
> * html .infobox {margin:-3px;}
>
> You might adapt the figures but the principle is simple, you tell IE6 to
> take back the 3px it added. In other words: Thanks, but no thanks! <g>
>
> (Although many people think it is a bug, I have been going along with
> the theory that we have here an annoying case of MS being deliberately
> motivated by a desire to give a bit of padding (in case the author
> forgets!). One of the most common uses of floats has been for inserting
> pictures into text. A bit of grace is nice. But modern day layouts often
> depend on floats and this is a pesky thing to have to cope with MS's
> shortsighted but good intentions.)
>
> --
> dorayme

Dorayme:

As always, you are most helpful and truly nice about it. I guess I will
have to learn about conditional statements and use different ones for FF and
IE6. Your comments about the margin were something I tried, but the results
were unsatisfactory. I do want 5px margin to the left of my infobox and
that 5px was accounted for in my widths, along with any padding or other
margins or borders that add width to an element. The elements add up to 880
which is the width of the wrapper. It works perfectly in FF, but not in
IE6. If I use a negative margin IE6 works fine, but then FF starts wrapping
floating elements because it is two px short of space. I will go Google
conditional expressions in HTML.

By the way, only a truly nice person would believe MS had or has good
intentions about anything. My first thought was that here's another example
of MS trying to make it difficult for people to use multiple browsers --
they do this as a means of keeping their market share. I did disregard this
idea though because I really believe it's simply a matter of imcompetence.
Just more evidence of how nice you are.

Thanks,

Larry

"dorayme" <> wrote in message
news:doraymeRidThis-...
> In article <g7l84n$3gu$>, "Phonedude" <>
> wrote:
>
>> http://larryludwick.com/menu1.php
>>
>> 3. The Dilbert flash app is in a <div> and it works ok. I added another
>> <div> inside the Dilbertbox to put a link to my email. It works just
>> fine
>> in IE6, but the email div shows up outside the dilbertbox div when viewed
>> in
>> Firefox. What gives here?
>>
>> Thanks for any help you are willing to provide.
>
>
> As for this, give your dilbertbox a greater height, 440px would be more
> like it than 340px.
>
> (btw, your layout looks a bit crowded in FF, the material under the
> three boxes butting up so close to the above boxes. Easy to fix)
>
> --
> dorayme

Yes, I will add some padding to seperate those elements. I got caught up in
this two pixel problem first though.

Thanks,

Larry

"Ari Heino" <> wrote in message
news:g7mdmm$20v4$...
>> 3. The Dilbert flash app is in a <div> and it works ok. I added another
>> <div> inside the Dilbertbox to put a link to my email. It works just
>> fine in IE6, but the email div shows up outside the dilbertbox div when
>> viewed in Firefox. What gives here?
>
> It's not a div, it's a paragraph. Delete its height, margin, padding and
> width attributes, and it looks better.
>
> I dont' see a clock either, it's an empty div.
>
> Google image is distorted, delete the img properties from the css, at
> least the width if you want to keep the height.
>
> --
> Ari

I need to go resize that img to the correct size and not use the browser to
do so. I will do this someday, but used the CSS to make it fit for now.

Thanks,

Larry