views:

820

answers:

1

I have created an iframe code that I want people to use as a widget on their website. This iframe will load a webpage which has a button and a counter. In the accessed page I've got a graphic.

But the iframe is rendered in the browser with a white empty area around it. Why is this happening? Here's my code: -

At the client side:

<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>

The page that should be displayed

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

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<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>

Note: I am using inline css. Margin and padding are set to 0, yet the images are being displayed a little offset from top and left.

Any ideas?

+4  A: 

You probably need to remove padding and margins from the <body>.

Greg
This seems like the most likely issue. html, body { padding:0; margin:0; } should take care of it.
Zack Mulgrew
make sure that this is done in the page displayed inside the iframe as well
Paige Watson
body{padding:0;margin:0;} did it. Thanks Zack.
Cyril Gupta