How can I remove blank space when using layers?

Discussion in 'CSS' started by coldfire, Jun 28, 2010.

  1. #1
    I messed around with the margins but I just can't seem to figure it out...
    Anyone have an idea on how to make the flash object have a top margin set to 0px?


    <html>
    <head>
    <style>
    
    h4{
    	position: relative;
    	top: 300px;
    	left: 0px;
    	z-index: 2;
    	background-color: #CCCCCC;
    	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    	font-size: 18px;
    	text-align: center;
    	padding: 10;
    	margin-top: 0px;
    }
    
    p {
    	position: relative;
    	z-index: 1;
    	background-color: #000000;
    } 
    
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body leftmargin="0" topmargin="0">
    <h4>Sorry For the Inconvience But We have moved to <a href="http://ChronicDailyHeadache.com">ChronicDailyHeadache.com</a></h4>
    <p><a href="/pic/dsc.html"></a>
    <a href="/pic/DrPerry.pdf"></a>
    <a href="http://www.ropsc.com"></a>
    <a href="/pic/cont.html"></a>
    <a href="http://www.plasticsurgery.org"></a>
    <a href="/pic/DrBlake.pdf"></a>
    <a href="/pic/index.html"></a>
    <a href="mailto:info@migraineheadachesurgery.com"></a>
    <a href="http://www.abms.org"></a>
    <!--text used in the movie-->
    <!-- saved from url=(0013)about:internet -->
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="100%" height="100%" id="index" align="left">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="index.swf" /><param name="loop" value="false" /><param name="quality" value="high" /><param name="salign" value="l" /><param name="bgcolor" value="#ffffff" /><embed src="http://migraineheadachesurgery.com/index.swf" loop="false" quality="high" salign="l" bgcolor="#ffffff" width="100%" height="100%" name="index" align="left" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object></p>
    
    </body>
    </html>
    Code (markup):

     
    coldfire, Jun 28, 2010 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    That's the space the h4 occupies. When you shift a relative position element, only the visual part moves. It is still anchored to its natural place in the flow, and that space is preserved.

    cheers,

    gary
     
    kk5st, Jun 28, 2010 IP
  3. coldfire

    coldfire Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    So what could I do to avoid having that space. I tried to move the h4 area after the object but it doesn't seem to work properly
     
    coldfire, Jun 28, 2010 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    Why?

    • Simply put the heading (an h1, not h4) at the top and leave it there.
    • If you want the heading last (?), code it there.
    • If you just must have it your way (seo? ridiculous), use absolute position, not relative.
    cheers,

    gary
     
    kk5st, Jun 29, 2010 IP