Centering

[BootNic]

[email protected]
BootNic wrote: [snip]

http://home.earthlink.net/~bootnic/JavascriptCenterFloat.html

Looked nice, seemed to work in IE, but while I was testing scaling the
window did hang IE on my Win2K box... Not sure what happened.

I did not round to whole numbers, I would guess that IE, and maybe
other browsers, may get stuck in a loop trying to render that.

The other example is similar, but I did remember to round the numbers,
does it hang as well.

 

[BootNic]

news: (e-mail address removed)
http://home.earthlink.net/~bootnic/JavascriptCenterFloatII.html

[/QUOTE]

Added a display toggle at the end of the function, that use to work
on some of the older mozilla browsers. I have no clue if it will do
anything for iCab.[/QUOTE]

Still no go in Safari.[/QUOTE]

Does this mean that iCab is now happy with it?

I will try one more time, try to add a check that tries to calculate the
possible width similar to what I think Jonathan was doing.

I think I must be going insane, I am going to try to write a script for a
browser I don't have access to, and know nothing about.

It may be a short trip.

--
BootNic Saturday, April 07, 2007 10:15 PM

Our earth is degenerate in these latter days; bribery and corruption
are common; children no longer obey their parents; and the end of the
world is evidently approaching.
*Assyrian clay tablet 2800 B.C.*

 

[BootNic]

Added a display toggle at the end of the function, that use to work
on some of the older mozilla browsers. I have no clue if it will do
anything for iCab.

Still no go in Safari.[/QUOTE]

Does this mean that iCab is now happy with it?

I will try one more time, try to add a check that tries to calculate
the possible width similar to what I think Jonathan was doing.

I think I must be going insane, I am going to try to write a script
for a browser I don't have access to, and know nothing about.

It may be a short trip.[/QUOTE]

http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html

 

[dorayme]

Added a display toggle at the end of the function, that use to work
on some of the older mozilla browsers. I have no clue if it will do
anything for iCab.

Still no go in Safari.[/QUOTE]

Does this mean that iCab is now happy with it?
[/QUOTE]

It does not work on either Safari or iCab. The details:

Required:

(1) The floated divs wrap when room to fit them runs out.

(2) The the mass of divs are centered


In iCab on anything much less than a 20" at 1600 x 1200 it fails
on both (1) and (2).

In Safari, it fails in (2) on any screen at any width.

I will try one more time, try to add a check that tries to calculate the
possible width similar to what I think Jonathan was doing.

I think I must be going insane, I am going to try to write a script for a
browser I don't have access to, and know nothing about.

It may be a short trip.

You should really stay there and work it out till you have
revolutionalised this sad little corner of html/css! (grin>

Otherwise I am left with JL's nice js which I have fully adapted
to a website already, to landscape divs of 200 wide, to portaits
of 150 wide and to "movie strip" divs of over 350 wide and all
working beautifully on browsers available to Mac (and very
impressive browsers too).

 

[dorayme]

http://home.earthlink.net/~bootnic/JavascriptCenterFloatIII.html

Hey, now this works in Safari! And, if one waits a sec for a bit
of a reorganization as the script bites, in iCab too (with a
reservation). The reservation: in iCab, it is as if a min width
to the wrapper or whole body has been set at 800. At just about
800, the horiz bar comes on. It is not my browser setting, the
url I gave at the start has no tendency to this in iCab.

Now, does it work in Windows IE? This is an important question,
more important than fun and games in iCab.

Just for now, I cannot test it on Windows. But surely JL will
report back. I will be able to look later today or tomorrow.

 

[BootNic]

news: (e-mail address removed) [snip]
You should really stay there and work it out till you have
revolutionalised this sad little corner of html/css! (grin>

Vacation is over, resolution achieved all that's left is to empty the
trash. ;-)

 

[BootNic]

news: (e-mail address removed)


Hey, now this works in Safari! And, if one waits a sec for a bit
of a reorganization as the script bites, in iCab too (with a
reservation). The reservation: in iCab, it is as if a min width
to the wrapper or whole body has been set at 800. At just about
800, the horiz bar comes on. It is not my browser setting, the
url I gave at the start has no tendency to this in iCab.

Now, does it work in Windows IE? This is an important question,
more important than fun and games in iCab.

Just for now, I cannot test it on Windows. But surely JL will
report back. I will be able to look later today or tomorrow.

Good thing I checked to see if my last message made it to the group,
was just about to take out the trash, but, for the moment I put it back
on the curb.

Pages deleted and restored never got too close to the shredder lol.

--
BootNic Sunday, April 08, 2007 12:20 AM

"No man's life, liberty, or property is safe while the legislature is
in session."
*Judge Gideon J. Tucker, 1866.*

 

[dorayme]

Vacation is over, resolution achieved all that's left is to empty the
trash. ;-)

Not sure if you have read the latest about it all working in
Safari and well enough in iCab except for a small reservation? I
hope you realise I appreciate it. If it works out in Windows, I
will have to look to adopt it.

(btw, about acknowledgement: I trust that a comment on the top of
the linked js file I used so far that JL suggested:

//the original js was written by Jonathan Little, I have just put
in some figures and names to suit my purpose

is enough acknowledgement. Or does JL want more details? And if I
use your idea, you want me to say "Bootnic"?

 

[BootNic]

news: (e-mail address removed)
[snip]

Not sure if you have read the latest about it all working in
Safari and well enough in iCab except for a small reservation? I
hope you realise I appreciate it. If it works out in Windows, I
will have to look to adopt it.

Works on xp home sp2, FireFox 2.0.0.3, SeaMonkey 1.1.1 , Opera 9.10,
IE 6, IE 7.

Maintenance could turn out to be a nightmare depending on the style
changes.

If the one you are using works, and works on the browsers you choose
to support, why change it.

(btw, about acknowledgement: I trust that a comment on the top of
the linked js file I used so far that JL suggested:

//the original js was written by Jonathan Little, I have just put
in some figures and names to suit my purpose

is enough acknowledgement. Or does JL want more details? And if I
use your idea, you want me to say "Bootnic"?

I am not concerned with acknowledgement, this is just a pastime for
me. I would be just as happy to save that tiny little bandwidth and not
download it.

You are completely free to do with it what you will, play with it,
learn from it, use it, modify it, sell it, ignore it or anything you can
think to do with it.
--
BootNic Sunday, April 08, 2007 1:30 AM

Why is it that our memory is good enough to retain the least
triviality that happens to us, and yet not good enough to recollect
how often we have told it to the same person?
*Francois de La Rochefoucauld*

 

[Jonathan N. Little]

is enough acknowledgement. Or does JL want more details? And if I
use your idea, you want me to say "Bootnic"?

<blush> Enough acknowledgment, I was just interested the the puzzle...

 

[dorayme]

news: (e-mail address removed)
[snip]

Not sure if you have read the latest about it all working in
Safari and well enough in iCab except for a small reservation? I
hope you realise I appreciate it. If it works out in Windows, I
will have to look to adopt it.

Works on xp home sp2, FireFox 2.0.0.3, SeaMonkey 1.1.1 , Opera 9.10,
IE 6, IE 7.
[/QUOTE]

Yes, indeed, yesterday evening I saw it worked on IE 6 on SP2.
This is a good thing. I have told you it is good in Safari, and
the odd thing with iCab...

Maintenance could turn out to be a nightmare depending on the style
changes.

I have not actually looked at this, with JL's it was easy to
adapt because it did a simple enough job of calculating and one
can put in ones own figures and adaptations.

If the one you are using works, and works on the browsers you choose
to support, why change it.

For the reason it does not work well in IE. See earlier in thread.

 

[dorayme]

<blush> Enough acknowledgment, I was just interested the the puzzle...

in that case, be thankful that your name did not figure in
flashing lights on the website proper instead of in a comment in
a linked js file which only geeks will see! <g>

I adapted your js for some portait thumbs (150 wide by 200 wide)
and this worked well in IE. So too a page where I have thumbnails
for movies, strips of about 530 wide (yes, looks good and 2 such
thumbs can get onto a big screen and be centered nicely). But not
so good on 200 x 150 landscape thumb page. If you really want to
see, email me, this particular set is a bit private. Otherwise
simply use the bare bones thumb page url I made at beginning of
thread and use 200 x 150.

Bootnic's js code works on Bootnic's url. To adapt I will
consider things. Yours was nice and simple and did not alter my
css so much and so was easier to adapt. I have no idea how much
his depends on his margin and paddings till I try.

Truth is, all this is a bit of an exercise for me too,
considering uncentered is not all that bad. It is just that in
some particular cases (like the wedding pages I have just made)
it looks the right thing to do as a finishing thing.

 

[Jonathan N. Little]

Yours was nice and simple and did not alter my
css so much and so was easier to adapt.

I like code that is nice and simple that does complicated things.
Unfortunately I find IE produces the opposite and is an endless source
of frustration, especially since problems can show up so *unpredictably*

 

[dorayme]

I like code that is nice and simple that does complicated things.
Unfortunately I find IE produces the opposite and is an endless source
of frustration, especially since problems can show up so *unpredictably*

Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE. When I
adapted it to my designs, it played up a bit with scroll bars
mysteriously appearing at the bottom of the window but in
addition to chrome ones in Safari. So I deleted the bits to do
with overflow. I have no idea yet whether this has now mucked up
its big saving grace for me, ie, working in Windows IE. This I
have not tested. But it seems fine to me in all my Mac browsers.
Mac IE is unfazed and ignores the centering js code. That's ok,
at least it floats things right.

But, interestingly enough, at least for me, was that it did not
at all seem difficult to maintain or adapt. If you go to:

http://tinyurl.com/2a434t

you can see the efforts. The actual linked js has not been
changed from page to page (there are three pages to demonstrate
different format thumbnails and can be gotten to by the very
bottom link on the above url).

I would appreciate it to know if these pages look problmatic in
IE on Windows 6 or 7. I can test on 6 later.

 

[BootNic]

news: (e-mail address removed) [snip]
Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE. When I
adapted it to my designs, it played up a bit with scroll bars
mysteriously appearing at the bottom of the window but in
addition to chrome ones in Safari. So I deleted the bits to do
with overflow. I have no idea yet whether this has now mucked up
its big saving grace for me, ie, working in Windows IE. This I
have not tested. But it seems fine to me in all my Mac browsers.
Mac IE is unfazed and ignores the centering js code. That's ok,
at least it floats things right.

Does not work in win IE 5 either, its the margin auto thing.

If you're not using a border the it should be fine without the overflow,
or you could change it to hidden to remove the scroll bars.

But, interestingly enough, at least for me, was that it did not
at all seem difficult to maintain or adapt. If you go to:

http://tinyurl.com/2a434t

you can see the efforts. The actual linked js has not been
changed from page to page (there are three pages to demonstrate
different format thumbnails and can be gotten to by the very
bottom link on the above url).

I would appreciate it to know if these pages look problmatic in
IE on Windows 6 or 7. I can test on 6 later.

You need to give #wrapper a border-width, can be 0, but it has to be
set to a number in px to avoid an error and script failure. With out being
set, IE sends Medium, which returns NaN and mucks up everything.

alert(parseInt('Medium'))

Give #wrapper a small padding, say 3px, without the padding at my
full screen (1280X800) IE 7 gives a horizontal scroll bar and hides just a
bit of it to the right.

With them two items added to the css, it works fine on winxp sp2 IE 6,
IE 7, FireFox, Opera and SeaMonkey.

 

[dorayme]

news: (e-mail address removed) [snip]
Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE. When I
adapted it to my designs, it played up a bit with scroll bars
mysteriously appearing at the bottom of the window but in
addition to chrome ones in Safari. So I deleted the bits to do
with overflow. I have no idea yet whether this has now mucked up
its big saving grace for me, ie, working in Windows IE. This I
have not tested. But it seems fine to me in all my Mac browsers.
Mac IE is unfazed and ignores the centering js code. That's ok,
at least it floats things right.

Does not work in win IE 5 either, its the margin auto thing.

If you're not using a border the it should be fine without the overflow,
or you could change it to hidden to remove the scroll bars.

But, interestingly enough, at least for me, was that it did not
at all seem difficult to maintain or adapt. If you go to:

http://tinyurl.com/2a434t

you can see the efforts. The actual linked js has not been
changed from page to page (there are three pages to demonstrate
different format thumbnails and can be gotten to by the very
bottom link on the above url).

I would appreciate it to know if these pages look problmatic in
IE on Windows 6 or 7. I can test on 6 later.

You need to give #wrapper a border-width, can be 0, but it has to be
set to a number in px to avoid an error and script failure. With out being
set, IE sends Medium, which returns NaN and mucks up everything.

alert(parseInt('Medium'))

Give #wrapper a small padding, say 3px, without the padding at my
full screen (1280X800) IE 7 gives a horizontal scroll bar and hides just a
bit of it to the right.

With them two items added to the css, it works fine on winxp sp2 IE 6,
IE 7, FireFox, Opera and SeaMonkey.

OK, thanks, what about now that I have added:

#wrapper {border: 1px solid #fff; padding:3px;}

to the css? Can the border be simply border:0 or do "px" have to
be mentioned for these popular browsers?

 

[dorayme]

news: (e-mail address removed) [snip]
Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE.

If you're not using a border the it should be fine without the overflow,
or you could change it to hidden to remove the scroll bars.

Just another note to add, I have found that using your original
js, (unaltered by me) with the new wrapper css is also good for
Safari re scrollbars; in other words, longer do I get unwanted
scrollbars with the original js now in Safari.

 

[BootNic]

news: (e-mail address removed)
[snip][snip]

OK, thanks, what about now that I have added:

#wrapper {border: 1px solid #fff; padding:3px;}

to the css? Can the border be simply border:0 or do "px" have to
be mentioned for these popular browsers?

Just border-width:0; would do. Just to change the default that a
browser may have set such as IE has, maybe others as well.

Most browsers only use the part of the script to calculate the width to
compare it to the float width, but if the border is not set then the
script halts at the error and no centering takes place.

In the my example III, I added a visual aid to see which centering
method was being used, named pass and fail. The default text was set
to black, the pass class color was set to blue, and the fail color was set
to red. I use that so it would show up on browserShots for the browsers
I did not have access to.

if(w<=check+10){w=w+'px';wrap.className='pass'}
else {w=check+'px';wrap.className='fail'}

In the above snip of code it would be safe to remove the className
part of the script.

wrap.className='pass'
wrap.className='fail'

The overflow part of the script was used to drag the #wrapper down
to enclose all the floats, If you're not setting a different background color,
background image or a visible border, they can remain omitted.

--
BootNic Monday, April 09, 2007 9:11 AM

All my humor is based upon destruction and despair. If the whole
world was tranquil, without disease and violence, I'd be standing on
the breadline right in back of J. Edgar Hoover.
*Lenny Bruce US comedian, satirist, author*

 

[Jonathan N. Little]

http://tinyurl.com/2a434t

you can see the efforts. The actual linked js has not been
changed from page to page (there are three pages to demonstrate
different format thumbnails and can be gotten to by the very
bottom link on the above url).

I would appreciate it to know if these pages look problmatic in
IE on Windows 6 or 7. I can test on 6 later.

Still seems to hang IE6. Interestingly enough it only seems to crash the
IE component and not the whole shell... but it does hang it if you
change the window size just a couple of times.

It does not hang IE 5.5 or 5.01, but it doesn't work either. IE5x does
work in mine either, the css causes those browsers to stack all the
thumbs in a single column!

 

[BootNic]

news: (e-mail address removed)

news: (e-mail address removed)
[snip] Righto, I have now incorporated Bootnic's js into the design
because it looked promising on Bootnic's url in Window IE.

If you're not using a border the it should be fine without the
overflow, or you could change it to hidden to remove the scroll bars.

Just another note to add, I have found that using your original
js, (unaltered by me) with the new wrapper css is also good for
Safari re scrollbars; in other words, longer do I get unwanted
scrollbars with the original js now in Safari.

Safari has an issue with the float, I have not been successful in
researching it, a float that contains floats, does not seem to shrink. I
do not have access to Safari, so this is just a guess from the little
information I was able to find, and what appeared to be the case from
browserShots.

That is the part of the script that was added to compare a caudated width
with a float with.

Currently the script checks both all the time, the script could be greatly
improved if someone with Safari would be able to create a quick test
for the float width issue and save that in a variable, and then use just one
method or the other to do the centering.

--
BootNic Monday, April 09, 2007 9:23 AM

One must learn by doing the thing, for though you think you know it,
you have no certainty until you try.
*Aristotle*