U++ forum: Welcome to the forum

Search on this site

Search in forums

Home » Developing U++ » U++ Developers corner » Trouble with SizePos...

Show: Today's Messages :: Show Polls :: Message Navigator
E-mail to friend

Trouble with SizePos... [message #34517]

Sat, 26 November 2011 17:13

mirek
Messages: 13975
Registered: November 2005

Ultimate Member

One of expected features of U++ web framework (I guess, we need a name for it, W++ is stupid, but will do for now) is possibility to design forms in Layout designer.

There, I can do LeftPos / RightPos (and Top,Bottom) equivalents easily:

<input type="text" style="width:40em;position:absolute;left:20em;top:20em" name="firstname" />
<input type="text" style="width:40em;position:absolute;right:20em;top:20em" name="firstname" />

but it is not possible to do SizePos this way (it can be either left or right, not both).

I have tried doing this with margins, but problem there is that in that case, html layout engine does not allow me to "overlap" widgets (so I cannot e.g. place label in the margin area).

Do I have to do this in JavaScript (and how?), or there is some other possiblity?

Note that the result should be compatible with U++ layouts...

Mirek

Report message to a moderator

Re: Trouble with SizePos... [message #34520 is a reply to message #34517]

Sat, 26 November 2011 18:37

dolik.rce
Messages: 1789
Registered: August 2008
Location: Czech Republic

Ultimate Contributor

This works fine for me (in chromium 17):

<span style="position:absolute;">label</span>
<input type="text" style="position:absolute;margin-left:10em;left:0;right:0;" name="firstname" />

If it causes some problems in other browsers, possible workaround might be to use layers ("z-index" in CSS), butit should not be necessary.

Honza

PS: Actually, specifying both left and right seems to work too:

<span style="position:absolute;">label</span>
<input type="text" style="position:absolute;left:10em;right:0;" name="firstname" />

[Updated on: Sat, 26 November 2011 18:44]

Report message to a moderator

Re: Trouble with SizePos... [message #34522 is a reply to message #34520]

Sat, 26 November 2011 19:46

mirek
Messages: 13975
Registered: November 2005

Ultimate Member

Well, does not work with Firefox, but I have found alternate solution + I have identified one problem that confused me before:

In firefox, 'em' units for elements are in font size of that element. And input element has different than 'default' font... Means placing labels was using different units...

Anyway, this appears to work, at least for horizontal size:

<div style="width:30em;position:absolute;right:20em;top:30em">30</div>

<div style="height:100%;margin-left:4em;margin-right:4em;margin-top:4em;margin-bottom:4em">
<input type="text" style="width:100%;height:100%" name="firstname" />
</div>

<div style="width:30em;position:absolute;right:15em;top:30em">
<input type="button" />
</div>

(note that we have to put positions to 'div' to have consistent units)

Report message to a moderator

Previous Topic:	Little experiment compiling to function pointer calls...
Next Topic:	Development ToDo finalized

Goto Forum:

-=] Back to Top [=-

[ Syndicate this forum (XML) ] [

] [

]

Current Time: Wed Apr 24 23:20:15 CEST 2024

Total time taken to generate the page: 0.02846 seconds