TextItem jumps at focus when setting margin

[phoebe]

Hi,

I have a textitem on a dynamic form, using this code (SmartGwt 2.2):

public void onModuleLoad() {
		DynamicForm form = new DynamicForm();
		TextItem tItem = new TextItem("ID", "Name");
		tItem.setTextBoxStyle("test");
		
		form.setItems(tItem);
		RootPanel.get().add(form);
	}

The css looks like this:

.test {
margin : 10px;
}

Now, when the user clicks on the textbox, the box jumps to the left as if no margin was set.
I think this is due to the fact that I have to set the margin on some other field, but which one?

I tried these fields at no result:
tItem.setCellStyle("test");
tItem.setPrintTextBoxStyle("test");
tItem.setHoverStyle("test");

[davidj6]

Take a look at FormItemBaseStyle and note that a single style does not apply to the textbox but rather a set of styles with various suffixes for the different states the box can be in. You will need to define those additional states in your css.

[phoebe]

Thanks a lot!! That did the trick.

These are all styles on a textitem I found (for other users and future reference).

.textItem,
.textItemFocused,
.textItemDisabled,
.textItemError,
.textItemHint {
	margin: 2px;
	margin-left: 10px;
	color:red;
}

However, if I want to have one specific textitem, which has different margins from all the other textitems, how could I accomplish that?

In the code I can set the style for the textfield and the style for the Title, but I cannot set the style for when a textitem is focused. The item would always jump then? Or can I set the style for when a textitem is focused in the code??

Thanks,
Phoebe