I am frustrated with the IDE in Web 2.0 It is almost impossible to produce a consistent, clean layout. The spacing and size of the controls are only approximate. Here is a picture of the layout in the IDE (top), and how it places itself in Chrome/Mac. Note the spacing between items. Xojo seems to only have approximate control.
How can one precisely and predictably layout controls on a dialog?
I’ve also been struggling through Web 2.0 for the past few weeks.It’s slowly getting better. For me it’s a mix of learning and workarounds.
I had similar problems. In my case it was due to the locking setting of the controls.
A 100% WYSIWYG solution will never exist for web development, unfortunately. Only an approximation. There was also a thread here in the last few weeks, but I haven’t found it currently.
The reason I ask is that the buttons, label and combo control height are the same but the bounds are not at runtime. My experience is that they should be 1 to 1 (or nearly thus) unless there’s some other layout tweaking going on.
Now, if it’s a container… make sure you didn’t inadvertently make it smaller than the original when placing it on the view.
In xojo web the result alway uses btn-small, btn-large etc. sizes instead of the actual width and height given in xojo. Xojo does NOT overwrite these values 9/10 times which makes it like the above.
In the layout editor it does seem to honor the width/height but in the result it always reverts back to the bootstrap style default (btn-small or btn-large) css classes.
The above seems to be applying only on WebDialogs…
The reason I asked is that in your screenshot, the “dialog” is definitely smaller than what was in the layout editor and that’s unexpected. In my tests, they are usually very close to 1:1 in terms of size on all current browsers. It’s one of the reasons we chose to go this route.
Now in terms of WebContainers, the size that you see when you are designing can be altered if you were to place it on another view and then change its size, which is what I thought had been done here.
As I mentioned, I’m going to need to see a sample project to track this down because if that truly is a dialog, your screenshot doesn’t make any sense.