javascript

Resolved that the JQeury display content has no margins the content is next to the browser edge

The content displayed in the JQuery page has no margins and is next to the browser edge, which is extremely ugly (as shown below).   The code is as follows:


<body>
<form id="form1" runat="server">
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h2> News content </h2>
</div>

<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText=" News pictures " />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>

<div data-role="footer" data-theme="d">
<h4> Food and beverage consultancy </h4>
</div>
</div>
</form>
</body>

In fact, the reason is very simple, that is, the content displayed is not placed in the content, so add a data-role=“content” in div, the modified code is as follows: The same code at the page code block index 0