小编Md.*_*yan的帖子

我的googlemap api v2中有三个标记.我试图一次显示所有标记标题.但它仅显示最后一个标记(myMarker3)标题.我的代码如下.

Marker myMarker1 = googleMap.addMarker(new MarkerOptions()
                    .position(myLoc1)
                    .title("Marker 1")
                    .icon(BitmapDescriptorFactory
                            .defaultMarker(BitmapDescriptorFactory.HUE_GREEN)));
            myMarker1.showInfoWindow();

Marker myMarker2 = googleMap.addMarker(new MarkerOptions()
                    .position(myLoc2)
                    .title("Marker 2")
                    .icon(BitmapDescriptorFactory
                            .defaultMarker(BitmapDescriptorFactory.HUE_GREEN)));
            myMarker2.showInfoWindow();

Marker myMarker3 = googleMap.addMarker(new MarkerOptions()
                    .position(myLoc3)
                    .title("Marker 3")
                    .icon(BitmapDescriptorFactory
                            .defaultMarker(BitmapDescriptorFactory.HUE_GREEN)));
            myMarker3.showInfoWindow();

在这里myLoc1,myLoc2并myLoc3有LatLng具体的纬度和经度类型变量.

我试图在较大的div中居中较小的div.我的代码看起来像这样:

Codepen链接

    div.box-collective {
    	background-color: grey;
    	width: 100%;
    }
    
    div.box {
    	width: 100px;
    	height: 100px;
    	border: 1px solid black;
    	display: inline-block;
    	margin: 10px;
    }

    <div class="container">
      <h1>My boxes</h1>
    
    	<div class="box-collective">
        <div class="box"></div>
        <div class="box"></div>
        <div class="box"></div>
        <div class="box"></div>
        <div class="box"></div>
    	</div>
    </div>

由于无法解释我想用文字做什么,请查看这些照片以获得更好的想法:

在上述情况下,屏幕宽度很大(桌面).基本上,我的代码看起来像顶级版本.我的结果我想要的是底部的那个,也就是说,盒子组完全居中.

在这种情况下,屏幕很小,并且由于每个框都是内联块,因此在调整屏幕大小时它们会自动转到新行.然而,我再次想要将它们居中,类似于正确的照片.

如何使用纯CSS实现这一目标？任何帮助表示赞赏.