Thank you very much for your response, Pau, but that is not an option.
Perhaps I should have emphasized my opening statement more strongly. This is
a Web front end to an 11-year-old, IBM AS/400 GREEN SCREEN APP. That is to
say, it is designed to make available to Web access a basic 24 line X 80
character, 5250 terminal-based application. It is not, nor can it
successfully be made, a liquid layout, if we are to succeed in our purpose,
which is to allow access to the application via the Web (versus the
requirement of an active Global Services connection to our network), while
not requiring the thousands of users globally who have learned to use the
~1500-screen application to retrain.
As such, fields must be where users are accustomed to finding them, labeled
as they are accustomed to finding them, with keystroke responses appropriate
to the responses in the 5250 application. In this situation, and given that
the AS/400 has no clue whatsoever about the environment into which it is
sending its labels and field values, being accustomed to working with a 24 X
80 character grid on a green screen 5250 terminal, absolute positioning is a
requirement, not an option. Em or Ex based positioning is completely out of
the question in this application. The application *requires* IE 6+, at 1024
X 768 minimum, and every screen will fit into the 730w X 487h px DIV
provided for it.
I should also note that the script has worked for *every* other one of the
55+ pages to which it has been applied thus far. The container DIV width is
specified in px, the script line "var theWidth = theNode[0].clientWidth;"
returns the width value in px by default, and the math, by definition,
requires the same measurement units to be used throughout the formula for it
to work. Furthermore, the problem is *not* that the DIV is mispositioned; in
fact, it is positioned absolutely dead center, just as the script is
designed to achieve. The problem is that the text wraps *within* the DIV,
which has nothing whatsoever to do with the external measurement units used
in calculating the position of the DIV itself.
Just so this doesn't seem to be an exercise in futility, I will point out
that we are free to (and do) use color, font choice, row striping,
backgrounds, borders, etc. to make the Web version much more attractive than
the 5250 green screen app. Also, where the 5250 app required one to know the
multitudinous line option keystrokes (anybody remember Wordstar's control
key combinations?), or which of the F1 to F24 keys to use for a given
option, we provide popup Select menus for each option, and a dedicated area
(DIV) on the left of the main app area just for displaying the
currently-applicable line options (for those keyboard jockeys who will
prefer to use the keystrokes instead of using popup menus), as well as a
clickable list of all the F-key functions currently available for the screen
being displayed, again providing a choice between keystroke (F-key) and
mouse operation. In other words, besides making the application available
over the Web, we are making it easier for new users to learn and more
flexible in use even for the "old hands."
So, anybody got any idea why the text is wrapping in an absolutely
positioned (therefore outside the page flow) DIV with no width or overflow
attribute? ;-)
Cheers,
Scott
----- Original Message -----
From: "Pau Garcia i Quiles" <[EMAIL PROTECTED]>
To: <[EMAIL PROTECTED]>
Sent: Monday, August 23, 2004 2:50 PM
Subject: [wdvltalk] RE: DIV doesn't auto-size
Your Javascript code is placing the <div> using absolute values in pixels.
Use 'em' or 'ex' units and you are done.
>-- Original Message --
>Reply-To: [EMAIL PROTECTED]
>From: "[EMAIL PROTECTED]" <[EMAIL PROTECTED]>
>To: [EMAIL PROTECTED]
>Subject: [wdvltalk] DIV doesn't auto-size
>Date: Mon, 23 Aug 2004 14:02:07 -0400
>
>
>In our current app (a Web front end to an AS/400 "green screen" app) we
have
>a field representing the screen title for each screen, called, oddly
enough,
>screenTitle. It is contained in an absolutely positioned DIV with no width
>attribute. Due to the nature of the AS/400 app providing the data, some
>(many) items must be styled post-rendering using javascript. The CSS and
>js
>code I've been using has worked fine up until this one screen, which has
>a
>longer than usual title. On this screen the field is wrapping, which it
>shouldn't do, as far as I know. Here's the CSS for the DIV:
>
>.screenTitle {
> position:absolute;
> margin-left: auto;
> margin-right: auto;
> font-family:Verdana, Arial, Helvetica, sans-serif;
> font-weight:bold;
> font-size:12px;
> color:#000000;
> text-align: center;
> z-index: 10;
> }
>
>Here's the HTML for the element:
>
><div id="screenTitle" class="screenTitle"><!-- -->Display Customer Item
>Reference by UPC Code</div>
>
>And here's the javascript used (called in our initPage function) to center
>the DIV on the screen:
>
>function setCompanyScreenCenter()
>{
>var theNode = getLikeElements("div", "id", "screenTitle");
>// alert('This node\'s ID is ' + theNode[0].id);
> if (theNode[0]) {
> var theWidth = theNode[0].clientWidth;
> if (theNode[0].firstChild.nextSibling) {
> if (theNode[0].firstChild.nextSibling.nodeType == 3) { //text
>node
> var workString =
>theNode[0].firstChild.nextSibling.nodeValue;
> workString = trim(workString);
> theNode[0].firstChild.nextSibling.nodeValue = workString;
> theNode[0].style.left = 730/2 - (theWidth/2) + "px";
>//container DIV width is 730px
> theNode[0].style.width = theWidth;
> } //if (theNode[0].first...
> } //if (theNode[0].first...
> } //if (theNode[0])
>} //function
>
>Everything works fine on every other page. My experience has been that
a
>DIV
>with no width or overflow attribute will automatically expand horizontally
>to accommodate its contents, up to the width of its parent container. I
am
>nonplussed as to why this one doesn't seem to be "following the script,"
>so
>to speak. Any ideas?
>
>Cheers,
>Scott
>
>
>____ ? The WDVL Discussion List from WDVL.COM ? ____
>To Join wdvltalk, Send An Email To: mailto:[EMAIL PROTECTED]
> Send Your Posts To: [EMAIL PROTECTED]
>To set a personal password send an email to [EMAIL PROTECTED] with the
>words: "set WDVLTALK pw=yourpassword" in the body of the email.
>To change subscription settings to the wdvltalk digest version:
> http://wdvl.internet.com/WDVL/Forum/#sub
>
>________________ http://www.wdvl.com _______________________
>
>You are currently subscribed to wdvltalk as: [EMAIL PROTECTED]
>To unsubscribe send a blank email to %%email.unsub%%
>
>To unsubscribe via postal mail, please contact us at:
>Jupitermedia Corp.
>Attn: Discussion List Management
>475 Park Avenue South
>New York, NY 10016
>
>Please include the email address which you have been contacted with.
>
--
Pau Garcia i Quiles
MSN Messenger: [EMAIL PROTECTED]
http://www.elpauer.org
____ � The WDVL Discussion List from WDVL.COM � ____
To Join wdvltalk, Send An Email To: mailto:[EMAIL PROTECTED]
Send Your Posts To: [EMAIL PROTECTED]
To set a personal password send an email to [EMAIL PROTECTED] with the
words: "set WDVLTALK pw=yourpassword" in the body of the email.
To change subscription settings to the wdvltalk digest version:
http://wdvl.internet.com/WDVL/Forum/#sub
________________ http://www.wdvl.com _______________________
You are currently subscribed to wdvltalk as: [EMAIL PROTECTED]
To unsubscribe send a blank email to %%email.unsub%%
To unsubscribe via postal mail, please contact us at:
Jupitermedia Corp.
Attn: Discussion List Management
475 Park Avenue South
New York, NY 10016
Please include the email address which you have been contacted with.
____ � The WDVL Discussion List from WDVL.COM � ____
To Join wdvltalk, Send An Email To: mailto:[EMAIL PROTECTED]
Send Your Posts To: [EMAIL PROTECTED]
To set a personal password send an email to [EMAIL PROTECTED] with the words: "set
WDVLTALK pw=yourpassword" in the body of the email.
To change subscription settings to the wdvltalk digest version:
http://wdvl.internet.com/WDVL/Forum/#sub
________________ http://www.wdvl.com _______________________
You are currently subscribed to wdvltalk as: [EMAIL PROTECTED]
To unsubscribe send a blank email to [EMAIL PROTECTED]
To unsubscribe via postal mail, please contact us at:
Jupitermedia Corp.
Attn: Discussion List Management
475 Park Avenue South
New York, NY 10016
Please include the email address which you have been contacted with.
