Почему вокруг содержимого iframe есть пустая область?

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

Но iframe отображается в браузере с белой пустой областью вокруг него. Почему это происходит? Вот мой код: -

На стороне клиента:

<script type = "text/javascript">
    window.onload = function() {
        document.all.myframe.src = "blogup.aspx?url = " + window.location.href;
    }
</script>

<iframe id = "myframe" height = "75" width = "235" scrolling = "no" frameborder = "0">
</iframe>

Страница, которая должна отображаться

<%@ Page Language = "C#" AutoEventWireup = "true" CodeFile = "blogup.aspx.cs" Inherits = "blogup" %>

<html xmlns = "http://www.w3.org/1999/xhtml">
<body>
    <form id = "form1" runat = "server">
        <img style = "float: left" src = "images/blogup1.jpg" alt = "Blogvani.com - Indian blogs aggregator" />
        <div style = "font-family: Verdana; font-size: 16px; margin:0;padding:0;font-weight: bold; background: url('images/blogup2.jpg') no-repeat;
            height: 50; width: 44; padding: 22px 5px 5px 5px; text-align: center">
            <a href = "javascript:voteup('<%= PostURL %>')" id = "votecount" style = "text-decoration: none;
                color: #026A88">115</a></div>
    <asp:Label ID = "Label1" runat = "server" Text = "Label"></asp:Label>
    <asp:ScriptManager ID = "ScriptManager1" EnablePageMethods = "true" runat = "server">
        <Services>
            <asp:ServiceReference Path = "~/Services.asmx"             
        </Services>
    </asp:ScriptManager>

    </form>
</body>
</html>

Примечание: я использую встроенный CSS. Margin и padding установлены на 0, но изображения отображаются с небольшим смещением сверху и слева.

Любые идеи?

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
3
0
11 414
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

Вероятно, вам нужно удалить отступы и поля с <body>.

Это кажется наиболее вероятной проблемой. html, body {padding: 0; маржа: 0; } должен позаботиться об этом.

Zack The Human 05.01.2009 21:17

убедитесь, что это сделано на странице, отображаемой внутри iframe.

Paige Watson 05.01.2009 21:50

body {padding: 0; margin: 0;} сделал это. Спасибо, Зак.

Cyril Gupta 06.01.2009 04:13

У меня была аналогичная проблема. Пустая область - это страница в самом iframe. Я удалил его, выполнив margin-left:-10px; margin-top:-10px в таблице стилей страницы, содержащейся в iframe.

Попробуйте этот код стиля, он удалит iframe, окружающий пустое пространство

<style>
    iframe { display:block; }
    html, body {
        border: 0px;
        margin: 0px;
        padding: 0px;
    }
    </style>

Ответы только на код имеют низкое качество и кандидаты на удаление, должно быть как минимум одно или два предложения, объясняющих, что делает этот код и как он отвечает на вопрос.

Eric Leschinski 27.03.2017 03:06

Другие вопросы по теме