Results 1 to 8 of 8

Thread: Remove Top Margin in FireFox not working

  1. #1
    Join Date
    Jul 2007
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Remove Top Margin in FireFox not working

    OK so I'm trying to make it so there is no margin or no space between the top rendering area of the browser and my content. It is working in IE 7 but not FF.

    I have my content in a div wrapper that has the top-margin set to 0px. I am also including the the top-margin 0px in the main body html tag. The div wrapper is inside the body tags. Its working fine in IE but there is a space in FF. My wrapper is set to relative, it I switch it to absolute it removes the space in FF. Any ideas. I need to use relative in the wrapper.

    http://www.sparticusgoods.com/testing2/

    Code:
    <html>
    <head>
    <title>Sparticus Goods</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    
    
    <style type="text/css">
    
    #wrapper {
    	position:relative;
    	background-color:#FFFFFF;
    	width:1076px;
    	height:auto;
    	margin-top:0px;
    	margin-left:auto;
    	margin-right:auto;
    }
    
    #topbar {
    	position:absolute;
    	width:1076px;
    	height:169px;
    	top:0px;
    	left:0px;
    }
    
    body {
    	background-color: #666666;
    }
    </style>
    
    </head>
    
    <body" style="text-align:center; background-color:#666666; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
    <div id="wrapper">
    	<div id="topbar"> 
    		<img src="images/Top Bar.gif" width="1076" height="169" alt="" />	</div>
    	<div style="text-align:center">
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>&nbsp;</p>
    	  <p>TESTING</p>
    	</div>
    </div>
    </body>
    </html>
    Last edited by ddadmin; 01-12-2012 at 11:13 AM.

  2. #2
    Join Date
    Jul 2007
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Fixed it.

    Just needed to set the top-margin in the paragraph as well.

    p {
    top-margin:0px;
    }

  3. #3
    Join Date
    May 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I have the same problem; where do you put the:

    p {
    top-margin:0px;
    }

    ???

  4. #4
    Join Date
    Mar 2007
    Location
    Currently: New York/Philadelphia
    Posts
    2,735
    Thanks
    3
    Thanked 519 Times in 507 Posts

    Default

    There is some default padding/margin on the html and body tag. The amount varies by browser. To get rid of it:

    Code:
    <style type="text/css">
    html,body {
       margin:0;
       padding:0;
    }
    </style>
    You need to clear the padding and the margin on the body and html tags. Usually one of those aspects is forgtten.

    felipopulus,
    CSS styles go between the <head></head> tags of your HTML document. All CSS styles must also be contianed within <style></style> tags.

    Using the style you provide above, you would add this to your head section:
    Code:
    <style type="text/css">
    p {
       top-margin:0px;
    }
    </style>

  5. #5
    Join Date
    Sep 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default same here

    This is my source code I did everything mentioned below but I can't do anything

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <link REL="SHORTCUT ICON" HREF="favi.bmp">
    <title>Insane Angel studio</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    
    
    <style type="text/css">
    
    #wrapper {
    position:relative;
    background-color:#FFFFFF;
    width:1076px;
    height:auto;
    margin-top:0px;
    margin-left:auto;
    margin-right:auto;
    }
    
    #topbar {
    position:absolute;
    width:1076px;
    height:169px;
    top:0px;
    left:0px;
    }
    html,body {
       margin:0;
       padding:0;
    }
    
    body {
    background-color: #666666;
    }
    p {
       top-margin:0px;
    }
    
    </style>
    
    </head>
    <body" style="text-align:center; background-color:#666666; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
    <p align="center">
      <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="900" height="850" id="website" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="website.swf" /><param name="menu" value="false" /><param name="quality" value="high" /><param name="bgcolor" value="#FFFFFF" /><embed src="website.swf" menu="false" quality="high" bgcolor="#FFFFFF" width="900" height="850" name="website" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
    </p>
    </body>
    </html></body>
    </html>
    edit: My website is www.insaneangelstudio.com
    Last edited by iastudio; 09-04-2008 at 04:19 PM. Reason: forgot

  6. #6
    Join Date
    Oct 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Try this, it works for me:
    <p align="center" style="margin-top:0;">

  7. #7
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    why are you declaring your body tag twice? You have it declared in the head and then with different style in the body tag of the page. Move the stuff in the <body" style"<--everything after this up into the body { tag in your head... also get rid of that quote at body so should be <body> also why not just say margin:0 instead of left right top and bottom
    Last edited by bluewalrus; 10-08-2008 at 04:15 PM.

  8. #8
    Join Date
    Nov 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    aquaglia - that worked for me. Many Thanx!!!!!!!!!!!

    That's a very important thing. It controls the placement of where your content goes. In my case a flash object. I changed "center" to "top" and it went flush to the top. It must have been just hanging there loosely before, and that TOLD it to put it at the top of the page.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •