我在笔记本电脑上创建了一个小项目，以显示一个可以显示定向服务的网站，但是由于手机尺寸太小，该网站只能在笔记本电脑上使用。
在网站上：[https://imgur.com/a/Jio3wSn]
显示操作的右侧面板仅在输入起点和目的地之后出现。但是，在我的手机上，我无法输入起点和终点，因为它不适合我的手机尺寸。
在电话上：[[https://imgur.com/a/O2uVTSA]
我尝试过
<meta name="viewport" content="width=device-width, initial-scale=1.0">
我有什么办法可以调整地图使其适合手机？我只能在手机上看到“右侧面板”，但仍然无用，无法在手机上输入出发地和目的地。
我的html页面是：
<body>
<input id="origin-input" class="controls" type="text"
placeholder="Enter an origin location">
<input id="destination-input" class="controls" type="text"
placeholder="Enter a destination location">
<div id="mode-selector" class="controls">
<input type="radio" name="type" id="changemode-walking"
checked="checked">
<label for="changemode-walking">Walking</label>
<input type="radio" name="type" id="changemode-driving" >
<label for="changemode-driving">Driving</label>
</div>
<div id="right-panel">
<p id="Direction"></p>
<p id="Arrows"></p>
</div>
<div id="map"></div>