Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Mar 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    SWF margins and table cells background

    Hi,
    Im trying to place a swf file inside of a table cells but i keep getting a margin on the bottom even though i canceled the margins and padding on the css file.
    I get this margin in FireFox and IE but Opera and Safari seems to look ok.
    Another problem that i have is that im alson creating a shadow effect and in order to do it i need to place a background image inside of a table cell but when i do it i cant see it in Safari?? works on good on every other browser..

    Does any1 know why is it happening and how can i fix it ?
    Should i upload the original files that im working on ?

    Thanks

  • #2
    hkp
    hkp is offline
    New Coder
    Join Date
    May 2009
    Posts
    11
    Thanks
    0
    Thanked 1 Time in 1 Post
    Can you put your source code. I think after that I might be able to help you...

  • #3
    New Coder
    Join Date
    Mar 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    html file:

    Code:
    <head>
    		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    		<title>Eli Print - Home</title>
            <link rel="stylesheet" type="text/css" href="stylesheet/style.css" />
        <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
    </head>
    
    	<body>
        	<table width="810" border="0" align="center" cellpadding="0" cellspacing="0" id="bodyTable">
            	<tr>
                	<td class="leftShadow" width="5">
                    </td>
                    
                    <!-- START FLASH HEADER CODE //-->
                    <td id="headerContent" width="800" hegiht="100">
                    
                      <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="100" hspace="0" vspace="0" id="FlashID" title="Eli Print Header">
                      <param name="movie" value="flash/banner.swf" />
                      <param name="quality" value="high" />
                      <param name="wmode" value="opaque" />
                      <param name="swfversion" value="6.0.65.0" />
                      <param name="expressinstall" value="Scripts/expressInstall.swf" />
                      <object data="flash/banner.swf" type="application/x-shockwave-flash" width="800" height="100" hspace="0" vspace="0">
                      <param name="quality" value="high" />
                      <param name="wmode" value="opaque" />
                      <param name="swfversion" value="6.0.65.0" />
                      <param name="expressinstall" value="Scripts/expressInstall.swf" />
                      <div>
                      	<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                        <p><a href="http://www.adobe.com/go/getflashplayer">
                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" 
                        alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                      </div>
                      </object>
                    </object>
                    
                    </td>
                    <!-- END FLASH HEADER CODE //-->
                    
                    <td class="rightShadow" width="5">
                    </td>
                </tr>
                <tr>
                	<td class="leftShadow" width="5">
                  	</td>
                    
                    <td class="centerNavigation" width="800" hegiht="60">
                    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="60" hspace="0" vspace="0" id="FlashID2">
                      <param name="movie" value="flash/navigation.swf" />
                      <param name="quality" value="high" />
                      <param name="wmode" value="opaque" />
                      <param name="swfversion" value="6.0.65.0" />
                      <param name="expressinstall" value="Scripts/expressInstall.swf" />
                      <object data="flash/navigation.swf" type="application/x-shockwave-flash" width="800" height="60" hspace="0" vspace="0">
                        <!--<![endif]-->
                        <param name="quality" value="high" />
                        <param name="wmode" value="opaque" />
                        <param name="swfversion" value="6.0.65.0" />
                        <param name="expressinstall" value="Scripts/expressInstall.swf" />
                        <div>
                          <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                          <p><a href="http://www.adobe.com/go/getflashplayer">
                          <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
                        </div>
                      </object>
                    </object>
                    
                    </td>
                    
                    <td class="rightShadow" width="5">
                    </td>
                </tr>
            </table>
        <script type="text/javascript">
    swfobject.registerObject("FlashID");
    swfobject.registerObject("FlashID2");
        </script> 
    </body>

    css file

    Code:
    *{
    	margin: 0;
    	padding: 0;
    	
    }
    body{
    	background-image: url(../images/background.png);
    	background-repeat: repeat-x;
    	background-color: #a0a0a0;
    }
    #bodyTable{
    	margin-left: auto;
    	margin-right: auto;
    }
    .leftShadow{
    	background-image: url(../images/sideshadowleft.png);
    }
    .rightShadow{
    	background-image: url(../images/sideshadowright.png);
    }
    #headerContent{
    	margin: 0px;
    	padding: 0px;
    }
    #centerNavigation{
    	margin: 0;
    	padding: 0;
    }

  • #4
    New Coder
    Join Date
    Mar 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Any1?

  • #5
    New Coder
    Join Date
    Mar 2008
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    screencap

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,866
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Quote Originally Posted by RisTar View Post
    screencap
    Your screen shot looks good, though your markup is very bad, since you are using tables for making your layout. Have a look at http://www.hotdesign.com/seybold/ to see the issues of a table layout.

    Now, in to your issue, you might be struggling with the mysterious gap created when we add img tags inside table cells.

    Have a try by adding
    Code:
    td img{ float:left;}
    into your CSS.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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