Re: how to cure FF problem

On 2008-04-22, richard wrote:
> http://roadtrip08.1littleworld.com/Page001.html

First, fix the errors:



And use 4.01 strict, not transitional, for new pages.

> How do you get FF to show the image correctly within the division
> bprders as desired?
> IE has no problem.

IE doesn't do it correctly.

> http://roadtrip08.1littleworld.com/
>
> Works fine here.

This is "working fine"?


> I just don't like the coding webdwarf generates.

I haven't seen any code generator do a decent job (apart from
special purposes ones written by people who know how to code HTML
and CSS).

--
Chris F.A. Johnson, webmaster
============================================================ =======
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

how to cure FF problem

http://roadtrip08.1littleworld.com/Page001.html

How do you get FF to show the image correctly within the division
bprders as desired?
IE has no problem.

http://roadtrip08.1littleworld.com/

Works fine here.
I just don't like the coding webdwarf generates.

Re: how to cure FF problem

On Tue, 22 Apr 2008 03:31:13 +0000, "Chris F.A. Johnson"
wrote:

>On 2008-04-22, richard wrote:
>> http://roadtrip08.1littleworld.com/Page001.html
>
> First, fix the errors:
>
>
>
> And use 4.01 strict, not transitional, for new pages.
>
>> How do you get FF to show the image correctly within the division
>> bprders as desired?
>> IE has no problem.
>
> IE doesn't do it correctly.
>
>> http://roadtrip08.1littleworld.com/
>>
>> Works fine here.
>
> This is "working fine"?
>
>
>> I just don't like the coding webdwarf generates.
>
> I haven't seen any code generator do a decent job (apart from
> special purposes ones written by people who know how to code HTML
> and CSS).


Errors fixed. Problem still remains.

Re: how to cure FF problem

On Mon, 21 Apr 2008 20:35:44 -0700, richard wrote:

>http://roadtrip08.1littleworld.com/Page001.html
>
>How do you get FF to show the image correctly within the division
>bprders as desired?
>IE has no problem.
>
>http://roadtrip08.1littleworld.com/
>
>Works fine here.
>I just don't like the coding webdwarf generates.


The problem appears to be that "auto" in FF does not account for
images. Only text. Giving the division a height to include the image
works fine.

Re: how to cure FF problem

richard wrote:
> http://roadtrip08.1littleworld.com/Page001.html
>
> How do you get FF to show the image correctly within the division
> bprders as desired?
> IE has no problem.
>
> http://roadtrip08.1littleworld.com/

First of all, make it work first in FF "Strict" and IE will probably be
OK most of the time.
Secondly, do use "Strict" as included below.
Thirdly, do _not_ use deprecated elements.
The key is the clearing div in the markup.
Here are your changes:

..ccell {width:32%; float:left; }
h2 {text-align:center;}


"http://www.w3.org/TR/html4/strict.dtd">

Wisconsin

2

3

Re: how to cure FF problem

On 2008-04-22, richard wrote:
> On Tue, 22 Apr 2008 03:31:13 +0000, "Chris F.A. Johnson"
> wrote:
>
>>On 2008-04-22, richard wrote:
>>> http://roadtrip08.1littleworld.com/Page001.html
>>
>> First, fix the errors:
>>
>>
>>
>> And use 4.01 strict, not transitional, for new pages.
>>
>>> How do you get FF to show the image correctly within the division
>>> bprders as desired?
>>> IE has no problem.
>>
>> IE doesn't do it correctly.
>>
>>> http://roadtrip08.1littleworld.com/
>>>
>>> Works fine here.
>>
>> This is "working fine"?
>>
>>
>>> I just don't like the coding webdwarf generates.
>>
>> I haven't seen any code generator do a decent job (apart from
>> special purposes ones written by people who know how to code HTML
>> and CSS).
>
>
> Errors fixed. Problem still remains.



--
Chris F.A. Johnson, webmaster
============================================================ =======
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Re: how to cure FF problem

richard wrote:
> how to cure FF problem

Forgot to mention that there is _NO_ FF problem, but an IE problem.
FF rendered according to the specs and IE didn't.

The image was floated.
A floated item is taken out of the normal flow,
therefore it presents no height to the container div.
The clearing div basically tells the container div where its bottom is.

--
Gus

Re: how to cure FF problem

On Tue, 22 Apr 2008 01:15:41 -0400, Gus Richter writ:

> A floated item is taken out of the normal flow, therefore it presents no
> height to the container div. The clearing div basically tells the
> container div where its bottom is.

This just solved a problem for me. :-)

--
"Because all you of Earth are idiots!"
¯`·.¸¸.·´¯`·-> freemont© <-·´¯`·.¸¸.·´¯

Re: how to cure FF problem

On Tue, 22 Apr 2008 01:09:07 -0400, Gus Richter
wrote:

>richard wrote:
>> http://roadtrip08.1littleworld.com/Page001.html
>>
>> How do you get FF to show the image correctly within the division
>> bprders as desired?
>> IE has no problem.
>>
>> http://roadtrip08.1littleworld.com/
>
>First of all, make it work first in FF "Strict" and IE will probably be
>OK most of the time.
>Secondly, do use "Strict" as included below.
>Thirdly, do _not_ use deprecated elements.
>The key is the clearing div in the markup.
>Here are your changes:
>
>.ccell {width:32%; float:left; }
>h2 {text-align:center;}
>
>
> > "http://www.w3.org/TR/html4/strict.dtd">
>
>

>

Wisconsin

>

>
>

>

2

>

3

>

>

Re: how to cure FF problem

richard wrote:
>
> Taking a clue from you, I simply applied the clear:left to an HR.
> Which helps to act as a seperator for the "rows".

No problem if HR works for you. Some people use BR while others an empty
P. Any will probably do. I prefer to use the generic DIV.

> But I still need that empty division.

Because you (apparently/seemingly) cannot apply a margin-top to the HR?
In which case simply add a margin-bottom to your IMG.

--
Gus

Re: how to cure FF problem

On Tue, 22 Apr 2008 11:35:44 -0400, Gus Richter
wrote:

>richard wrote:
>>
>> Taking a clue from you, I simply applied the clear:left to an HR.
>> Which helps to act as a seperator for the "rows".
>
>No problem if HR works for you. Some people use BR while others an empty
>P. Any will probably do. I prefer to use the generic DIV.
>
>> But I still need that empty division.
>
>Because you (apparently/seemingly) cannot apply a margin-top to the HR?
>In which case simply add a margin-bottom to your IMG.

Hadn't really considered that option but I will now. Thanks.

Re: how to cure FF problem

In article ,
Gus Richter wrote:

> richard wrote:
> >
> > Taking a clue from you, I simply applied the clear:left to an HR.
> > Which helps to act as a seperator for the "rows".
>
> No problem if HR works for you. Some people use BR while others an empty
> P. Any will probably do. I prefer to use the generic DIV.

Not any will do. Some empty divs do not work for Internet Explorer in
some situations. To be sure of IE, at least a   inside if you take
the clearing div route.

--
dorayme

Re: how to cure FF problem

dorayme wrote:
> In article ,
> Gus Richter wrote:
>
>> richard wrote:
>>> Taking a clue from you, I simply applied the clear:left to an HR.
>>> Which helps to act as a seperator for the "rows".
>> No problem if HR works for you. Some people use BR while others an empty
>> P. Any will probably do. I prefer to use the generic DIV.
>
> Not any will do. Some empty divs do not work for Internet Explorer in
> some situations. To be sure of IE, at least a   inside if you take
> the clearing div route.

I seriously question using   in a clearing div since it will
present a possibly undesired height to the div. In what situation does
IE choke here? Can you give an example?

Some times a clear or clearing div will not be enough.
That's when "clearing space" methods are needed.
See (search for: how to contain a floated element):


--
Gus

Re: how to cure FF problem

In article ,
Gus Richter wrote:

> dorayme wrote:
> > In article ,
> > Gus Richter wrote:
> >
> >> richard wrote:
> >>> Taking a clue from you, I simply applied the clear:left to an HR.
> >>> Which helps to act as a seperator for the "rows".
> >> No problem if HR works for you. Some people use BR while others an empty
> >> P. Any will probably do. I prefer to use the generic DIV.
> >
> > Not any will do. Some empty divs do not work for Internet Explorer in
> > some situations. To be sure of IE, at least a   inside if you take
> > the clearing div route.
>
> I seriously question using   in a clearing div since it will
> present a possibly undesired height to the div. In what situation does
> IE choke here? Can you give an example?

I thought you would ask for an example. I will have to dig one up. I
made this discovery the hard way. It still annoys me the time I spent on
it when trying to complete a first draft of a website, all I needed to
was the right thing to put in a conditional for IE 6 eyes only!

It was a case where I used overflow: hidden to make a container grow
height to cover a float for all good browsers. Unfortunately, it was
also a case where IE6 did not grow height naturally (as it often does
without needing any special coaxing.)

Since it does not understand overflow: hidden for this purpose, I tried
an empty clearing div, and it still did not work. This led to a wild
goose chase until I thought to stick some content in. Being lazy, I used
a fullstop, (it was perfect because it got lost in a special speckled
background!).

I will be back, I am firing up my winbox especially for you Gus! But it
is also breakfast time. When I return, I will see what cases are on the
windows machine.

--
dorayme

Re: how to cure FF problem

On 2008-04-22, dorayme wrote:
> In article ,
> Gus Richter wrote:
>
>> richard wrote:
>> >
>> > Taking a clue from you, I simply applied the clear:left to an HR.
>> > Which helps to act as a seperator for the "rows".
>>
>> No problem if HR works for you. Some people use BR while others an empty
>> P. Any will probably do. I prefer to use the generic DIV.
>
> Not any will do. Some empty divs do not work for Internet Explorer in
> some situations. To be sure of IE, at least a   inside if you take
> the clearing div route.

However, in this situation, IE doesn't need the