[prev in list] [next in list] [prev in thread] [next in thread]
List: kfm-devel
Subject: Re: text-align : right ignored for <input
From: Vadim Plessky <vplessky () faringosept ! ru>
Date: 2003-03-17 20:01:39
[Download RAW message or body]
On Sunday 16 March 2003 22:46, Dan Sylveste wrote:
| *.ee102 { font-size : 10.00pt; font-family : "Arial", Sans-serif;
| text-align : right }
|
|
| <input name="p1B2" type="text" value="10,000.00"
| onblur="this.value=eedisplayFloatNDTh(eeparseFloatTh(this.value),2);recalc_
|o nclick('p1B2')" tabindex="1"
| style='border:1px solid #000000;width:75pt' size="14"
| class=ee102 >
|
| right aligns the contents of the form field both in IE and Mozilla, but
| not in Konqueror 3.0.3
That's what I wrote yesterday :-)
Question: do you want fix exactly for <input> filed, or work-around for your
particular solution?
Or even better solution than yours? :-))
Check attached HTML example, I did several modifications.
First, note that 'name' is depreciated, you should use 'id' instead.
I replaced 'name' with 'id' and used getElementById DOM method to get access
to element (recommended usage, instead of NN4-like, or MS IE4-like
"collections")
I also replaced <input> with <div>, and than applied element.innerHTML method
to change content (you can use something more simple, but innerHTML is pretty
well known and Konqueror supports it)
Modified code in question is:
<td align=right class="ee103">
<div id="p1B5"
style='border: 0px solid #000000;width:75pt;height:14pt' class="ee103" >
</div>
</td>
After this redesign: everything works as expected. :-)
(and there is no border around last element)
BTW: I would recommend you do not use legacy elements at all.
CSS (<div>) methods are much, much better for the purpose of presentations,
comparing to other elements (button, input fields, etc.)
Instead of creating button and "theming" it later, you can use <div> from the
beginning and modify it via CSS.
|
| This is also from
| http://www.xleverywhere.com/samples/interest_calculator.htm
|
|
| Cheers,
|
| Darren
Greetings,
Vadim
--
Best Regards,
Vadim Plessky
SVG Icons * BlueSphere Icons 0.3.0 released
http://svgicons.sourceforge.net
["interest_calculator4.htm" (text/html)]
<html><!-- Parts of this page Copyright (C) 2002 Framtidsforum I&M AB, Sweden -->
<head><meta name="generator" content="ExcelEverywhere for HTML version 1.9.2" \
/><style>/* Styles needed by ExcelEverywhere */
*.ee104 { text-decoration : underline; font-size : 10.000000pt;
color : #0000ff; font-family : "Arial", Sans-serif }
*.ee103 { font-size : 10.000000pt; font-style : italic;
font-family : "Arial", Sans-serif; text-align : right }
*.ee102 { font-size : 10.000000pt; font-family : "Arial", Sans-serif;
text-align : right }
*.ee101 { font-size : 10.000000pt; font-weight : bold;
font-family : "Arial", Sans-serif }
*.ee100 { font-size : 10.000000pt; font-family : "Arial", Sans-serif }
</style>
<script language="javascript">
var co = new Object;
function recalc_onclick(ctl) {
if (true) {
co.p1B2=eeparseFloatTh(document.formc.p1B2.value);
co.p1B3=eeparsePercent(document.formc.p1B3.value);
co.p1B4=eeparseFloat(document.formc.p1B4.value);
calc(co);
/* document.formc.p1B5.value=eedisplayFloatNDTh(co.p1B5,2)
*/
el = document.getElementById("p1B5");
// would return [Object DIV] in Konqueror
// alert("el="+el);
el.innerHTML = eedisplayFloatNDTh(co.p1B5,2);
};};
</script>
<noscript>The browser does not support JavaScript. The calculations create using <a \
href="http://exceleverywhere.com">ExcelEverywhere</a> will not work. Please access \
the web page using another browser.<p></noscript>
<script language="javascript">
var eeisus=0;
function calc(data)
{var c1B2=data.p1B2;var c1B3=data.p1B3;var c1B4=data.p1B4;
var c1B5=(((c1B2)*(Math.pow((((1)+(c1B3))),(c1B4)))));
data.p1B5=c1B5;};
</script>
<script language="javascript">
function round(n,nd)
{
if(isFinite(n)&&isFinite(nd))
{var sign_n=(n<0)?-1:1;
var abs_n=Math.abs(n);
var factor=Math.pow(10,nd);return sign_n*Math.round(abs_n*factor)/factor;
}
else{return NaN;}};
function eeparseFloat(str)
{var res=parseFloat(str);
if(isNaN(res)){return 0;}
else{return res;};};
function eeparsePercent(str)
{var parts=String(str).split('%');
var res=parseFloat(parts[0])/100;if(isNaN(res)){return 0;}else{return res;};};
function eedisplayFloatND(x,nd){if(isNaN(x)){return Number.NaN;}
else{var res=round(x,nd);
if(nd>0)
{var parts=String(res).split('.');
if(parts.length<2){var \
decimals=('00000000000000').substring(0,nd);return(parts[0]).toString()+'.'+decimals;}else{var \
decimals=((parts[1]).toString()+'00000000000000').substring(0,nd);return(parts[0]).toString()+'.'+decimals;}}else{return \
res;};};};function eedisplayPercentND(x,nd){if(isNaN(x)){return \
Number.NaN;}else{return eedisplayFloatND(x*100,nd)+'%';};}function \
eeparseFloatTh(str){str=String(str).replace(/,/g,"");var \
res=parseFloat(str);if(isNaN(res)){return 0;}else{return res;};};function \
eedisplayFloatNDTh(x,nd){if(isNaN(x)){return Number.NaN;}else{var \
res=round(x,nd);if(nd>0){var parts=String(res).split('.');var \
res2=eeinsertThousand(parts[0].toString());if(parts.length<2){var \
decimals=('00000000000000').substring(0,nd);return(res2+'.'+decimals);}else{var \
decimals=((parts[1]).toString()+'00000000000000').substring(0,nd);return(res2+'.'+decimals);}}else{return(eeinsertThousand(res.toString()));};};};function \
eeinsertThousand(whole){if(whole==""||whole.indexOf("e")>=0){return whole;}else{var \
minus_sign="";if(whole.charAt(0)=="-"){minus_sign="-";whole=whole.substring(1);};var \
res=""; var str_length=whole.length-1;
for(ii=0;ii<=str_length;ii++)
{if(ii>0&&ii%3==0){res=","+res;};
res=whole.charAt(str_length-ii)+res;};return minus_sign+res;}};
</script>
</head><body>
<form name="formc" method="post" action="">
<table width="159" \
style='border-collapse:collapse;table-layout:fixed;width:120pt' border="0" \
cellspacing="0" cellpadding="2" bgcolor="#FFFFFF"> <tr>
<td width="64" style='width:48pt;' class=ee100 >
</td>
<td width="100" style='width:75pt;' >
</td>
</tr>
<!-- row -->
<tr>
<td class=ee101 >
Amount
</td>
<td align=right class=ee102 >
<input name="p1B2" type="text" value="10,000.00"
onblur="this.value=eedisplayFloatNDTh(eeparseFloatTh(this.value),2);recalc_onclick('p1B2')" \
tabindex="1" style='width:75pt' size="14"
align=right class=ee102 >
</td>
</tr>
<!-- row -->
<tr>
<td class=ee101 >
Rate
</td>
<td align=right class=ee102 >
<input name="p1B3" type="text" value="7%"
onblur="this.value=eedisplayPercentND(eeparsePercent(this.value),0);recalc_onclick('p1B3')" \
tabindex="2" style='width:75pt' size="14"
align=right class=ee102 >
</td>
</tr>
<!-- row -->
<tr>
<td class=ee101 >
Years
</td>
<td align=right class=ee102 >
<input id="p1B4" type="text" value="10"
onblur="this.value=eedisplayFloatND(eeparseFloat(this.value),0);recalc_onclick('p1B4')" \
tabindex="3" style='width:75pt' size="14"
align=right class=ee102 >
</td>
</tr>
<!-- row -->
<tr>
<td class=ee101 >
Result
</td>
<td align=right class="ee103">
<div id="p1B5"
style='border: 0px solid #000000;width:75pt;height:14pt' class="ee103" >
</div>
</td>
</tr>
<!-- row -->
<tr>
<td class=ee100 >
</td>
<td >
</td>
</tr>
<!-- row -->
<tr>
<td class=ee104 colspan=2 >
<a href="http://www.xleverywhere.com/samples/interest_calculator.xls" \
target="_blank" class=ee104> Click here to open the original spreadsheet
</a>
</td>
</tr>
<!-- row -->
</table>
<p>
</form>
<script language="javascript">
recalc_onclick('');
</script>
</body>
</html>
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic