I want to see the full screen of the images referenced from the list in the template Train Catalog.

Asked 5 months ago, Updated 5 months ago, 12 views

Monaca In the "Train Catalog" template, which you can choose from a new project, the train images referenced from the list have margins, up, down, left, right, and right.

image margins

Is it possible to remove this margin and display the image?

<div data-role="page"id="tokaido-page">
    <div data-role="header" data-position="fixed" class="jqm-header-custom" data-theme="c">
        <h1> Train Catalog</h1>
    <div data-role="content">
        <ul data-role="listview">
            <li data-role="list-divider">Tokaido Shinkansen Trains</li>
            <li><a href="#"onclick="showDetail('0kei', 'Series 0')">Series 0</a></li>

The CSS is as follows:

width: 100%;
height —100%;

monaca css

2022-09-30 13:53

1 Answers

Since the page itself has padding:15, and the image has margin:0505, set these values to 0px.

<div data-role="page"id="detail-page">

<div data-role="page" id="detail-page" class="train-page">

Change to style.css and add the following:



    width: 100%;
    height —100%;

2022-09-30 13:53

If you have any answers or tips

© 2023 OneMinuteCode. All rights reserved.