frame alignment issue / text not fitting in the frame

[nd_sencha]

When I run the following code, at first the html text overwrites on the image and then later when I hit refresh, the html text cuts on the page, it does not display the whole text, please check images (screenshot)

{layout : 'hbox',
			defaults : {style : 'margin : 1em;'},
			items : [
			{html : '<img src=http://localhost/img.jpg>'},
			{layout : {type : 'vbox',
			align : 'left'},
			items : [
			{html : '<a href=>check this link</a>'},
			{html : '<font size=2px>something here something here something here something here something here something here something here something here 1234567890 something here something here something here something here 9876543210 something here something here something here something here abcdefghijklmnopqrstuvwxyz</font>',			
			style : 'margin-right : 1em;'},
			{html : '<b>End Date : On-Going</b>'},
			]},
			]
			},

error1.jpgerror2.jpg

[mitchellsimoens]

The component with the image, give it a width, the other give flex : 1

[nd_sencha]

So is there any solution to this? Please not I have not specified flex or width to this piece of code.