Блог

Главная - Вопросы по программированию - Как удалить пробел между фреймом карты

Как удалить пробел между фреймом карты

#html #css #iframe

#HTML #css #iframe

Вопрос:

Я пытаюсь создать сайт с некоторыми стилями начальной загрузки и некоторыми сетками.

Я хотел бы иметь в правой части карту Google Maps, а в левой — простой текст.

Проблема, с которой я сталкиваюсь, заключается в том, что на мобильных устройствах у меня есть пробел между iframe Google и сеткой. Я дал ему синий цвет, чтобы я мог видеть, где какая сеткаб но как я могу это исправить, чтобы карта Google занимала всю ширину сетки, без пространства вокруг нее, которое вы можете видеть на мобильных устройствах? вот демонстрационный сайт

             <div class="col-xs-6 col-md-6 gmap" style="background-color:blue">
            <iframe src="   https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2369.3387871906875!2d9.987669999999998!3d53.56956999999999!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47b18f10c1641aa5:0x9e2e0a1e8cac2d78!2sT&M Limousinen Service GmbH!5e0!3m2!1sde!2sde!4v1403018648499" width="100%" height="50%" frameborder="0" style="border:0"></iframe>  

            <a class="right carousel-control" href="#myCarousel" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right"></span>
            </a>
        </div>


.gmap{ padding: 0; height:15%;}

Комментарии:

1. Пожалуйста, укажите соответствующий код в вашем вопросе. Как только ваша проблема будет решена, ваша ссылка станет бесполезной, поскольку проблема больше не будет существовать для будущих читателей

Ответ №1:

ну, попробуйте заказать с тегом table.

 <table>
    <tr>
        <td colspan="3">
            asdasdasd asdasdasd asdasdasd asdasdasd asdasdasd asdasdasd
        </td>
    </tr>
    <tr>

        <td>
            a la derecha
        </td>
        <td style = "background-color:blue">

        </td>
        <td>
            <div class="col-xs-6 col-md-6 gmap" style="background-color:blue">
                <iframe src="   https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2369.3387871906875!2d9.987669999999998!3d53.56956999999999!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47b18f10c1641aa5:0x9e2e0a1e8cac2d78!2sT&M Limousinen Service GmbH!5e0!3m2!1sde!2sde!4v1403018648499" width="100%" height="50%" frameborder="0" style="border:0"></iframe>  

            <a class="right carousel-control" href="#myCarousel" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right"></span>
            </a>
        </div>
        </td>
    </tr>
</table>

я пытался это сделать, и это простое решение, вы можете добавить некоторые стили в свою таблицу, а другие внутренние теги, надеюсь, помогли вам.