O conteúdo exibido na página JQuery escrita não tem margens e está próximo da borda do navegador, o que é particularmente feio (como mostrado abaixo)
O código é o seguinte:
Copie o código do código da seguinte forma:
<corpo>
<form id="form1" runat="servidor">
<div data-role="página" id="página">
<div data-role="header" data-theme="b">
<h2>Conteúdo de notícias</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="Imagem de notícias" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>Consulta de catering</h4>
</div>
</div>
</form>
</body>
Na verdade, o motivo é muito simples, ou seja, o conteúdo exibido não é colocado dentro do conteúdo, basta adicionar um data-role="content" ao div. O código modificado é o seguinte:
Copie o código do código da seguinte forma:
<corpo>
<form id="form1" runat="servidor">
<div data-role="página" id="página">
<div data-role="header" data-theme="b">
<h2>Conteúdo de notícias</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="Imagem de notícias" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>Consulta de catering</h4>
</div>
</div>
</form>
</body>