Subject:
Textboxes do not render correctly in simulator/html
To Reproduce:
Simply add a basic textbox into your grid like so:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="25"/>
</Grid.RowDefinitions>
<Textbox Grid.Row="0" Name="chkObject"/>
</Grid>
Investigation:
In the XAML preview pane, the textbox is rendered correctly. You will see the textbox filling the space as defined (height no more than 25px, width equals the grid width). When running the simulator (or using the generated HTML), you instead see that the textbox is now two lines high, only about 100 or so pixels wide, and has a resizable anchor on the bottle right corner.
This is likely related to how textareas are defined in HTML. Unless you use CSS, there isn't a way to directly manipulate height outside of the TextArea rows attribute. This defaults to 2 rows. The same goes for the width, which is manipulated with either CSS, or indirectly with the cols attribute. The resize handle needs to be explicitly disabled using CSS:
textarea {
resize: none;
}
I'd personally rather css be auto generated (rather than messing with cols/rows), but that does reduce the number of compatible browser versions this could target. Is there any way we could attach css to our textboxes in the xaml if we so chose?