Only Title is Displayed.

Dear All,

Today I was designing a Split App app using xml views, and I faced a very peculiar problem

I just created a new project "for mobile" and I added a sample button to the initial view. I used a component container

Below the sample code:

Index Html:

varcompContainer = new sap.ui.core.ComponentContainer(

                     'rootComponentContainer', {

                           name : "ss.testsplitN"

                     });

       compContainer.placeAt("content");

</script>

1. Component.js

var oView = sap.ui.view({

            id: "idViewRoot",

            viewName: "ss.app.sublimesplitapp.testView",

            type: sap.ui.core.mvc.ViewType.XML

<core:Viewxmlns:core="sap.ui.core"xmlns:mvc="sap.ui.core.mvc"xmlns="sap.m"

              controllerName="ss.app.sublimesplitapp.testView"xmlns:html="http://www.w3.org/1999/xhtml">

       <Pagetitle="Title">

              <content>

       <Buttontext="PRESS"/>

When I run this app on my local server only the page with TITLE is shown. No button is visible.

SO I debugged and inspected the html result code and figured out that i need to add an additional css style sheet.

Added :

<!-- <style type="text/css">

.sapMPage>section {

height: 100%;

}

and it works just fine

So I'm not able to understand this behavior. What mistake did I make? why isnt this the default property?

Thanks & Regards,

Dipankar