Comment 1 Thomas Kratz 2011-03-29 03:50:05 EDT

Is it normal that I see some padding at my side with UI Forms or does this come from the Form? I don't see the padding in the IDE, that's what confuses me.

Comment 2 Bogdan Gheorghe 2011-03-30 11:20:51 EDT

Using an e4 SDK build, if you open up a plugin.xml and go to the Overview page, you will see that there is padding there.

Using the e4 CTabRenderer, you will automatically get 8 pixels of space on either side as that is the calculated value that will give an equal margin around the CTabItem control (your Form in this case). The value is calculated to allow the control to fit properly at the bottom, given the corner radius (i.e. if it's set flush to the bottom, part of the control will be outside of the corners).

The plan is to add some padding support to the renderer, which will allow you to control the amount of padding on all sides.

Comment 3 Bogdan Gheorghe 2011-04-01 13:01:19 EDT

Created attachment 192370 [details]
Patch

Patch adds padding support to the e4 CTabFolder renderer as well as the property handlers needed to hook it in the CSS engine.

Comment 4 Bogdan Gheorghe 2011-04-01 16:02:22 EDT

Added support for padding in CTabFolder when used with the e4 rendering.

Valid CSS is:

padding: 10px 20px 30px 40px; /*sets top, right, bottom, left padding*/
padding: 10px 20px 30px; /*sets top,(right and left share 2nd value), bottom*/
padding: 10px 20px; /*(top and bottom from v1), (left and right from v2)*/
padding: 8px; /*assigned to all padding*/

In addition to grouping all padding in one line, you can also use individual padding:

padding-bottom: 10px;
padding-top: 5px;
padding-left: 20px;
padding-right: 12px;

Fixed in HEAD > 20110401

Comment 5 Thomas Kratz 2011-04-02 04:26:20 EDT

Created attachment 192414 [details]
Screenshot

Hi I tried with ui.widgets from head today and my css doesn't seem to have any effect, I tried different settings including

CTabFolder {
	padding-bottom: 10px;
	padding-top: 0px;
	padding-left: 8px;
	padding-right: 8px;	
	
}
and it always results in the attached screenshot. I have the renderers and widgets bundle from head running against the M6 build.

Comment 6 Thomas Kratz 2011-04-02 04:35:56 EDT

OK I found that I need the patched css bundles. but Still I have to set the left and right padding to a minimum of 3px otherwise I get the overlapping effect you see in the screenshot.