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,859
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    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
    •