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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2009
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image percent query- (Safari vs. Firefox)

    So I recognize the misgivings about using percent as opposed to pixels but for this particular rollover image I would like it to be slightly smaller than the screen size. I thought I would employ the percent tag in my text. This seems to work quite nicely in Safari but not at all in Firefox. Could anyone tell me if this is user error or just something I'll have to accept as differences in the software. Thanks guys!

    website is http://www.schechter-industries.com

    [what i assume to be the relevant] source is....


    <body onload="MM_preloadImages('images/misc/intro2.png')">
    <table width="95%" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr>
    <td width="52%"></td>
    <td width="1%">&nbsp;</td>
    <td width="47%" ><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/misc/intro2.png',1)"><img src="images/misc/intro1.png" name="Image2" width="*" height="85%" border="0" align="right" id="Image2" /></a></td>
    </tr>
    <tr>

    </tr>
    </table>
    </body>

    </html>
    Last edited by Industries; 02-23-2009 at 03:08 AM.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,737
    Thanks
    22
    Thanked 1,835 Times in 1,819 Posts
    Hello Industries,
    FF3 at least shows an image here, hover over it and some red text shows up.
    IE8 and IE7 show nothing.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New to the CF scene
    Join Date
    Feb 2009
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Looking at your links I see the "why tables are bad" info. Could my problem be the table?
    Thanks for your help!

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,737
    Thanks
    22
    Thanked 1,835 Times in 1,819 Posts
    Quote Originally Posted by Industries View Post
    Looking at your links I see the "why tables are bad" info. Could my problem be the table?
    Thanks for your help!
    It very well could be. There is no need for a table there, that's for sure
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #5
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,737
    Thanks
    22
    Thanked 1,835 Times in 1,819 Posts
    Try this:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    html, body {
    	font: 12px "Comic Sans MS";
    	background: #FC6;
    	text-align: center;
    }
    * {
    	margin: 0;
    	padding: 0;
    	border: none;
    }
    #wrap {
    	width: 800px;
    	margin: 30px auto;
    	background: #999;
    	overflow: auto;
    }
    #rollover {	
    	width: 480px;
    	height: 782px;
    	margin: 20px;
    }
    #rollover a:link, #rollover a:visited, #rollover a:active {
    	width: 480px;
    	height: 782px;
    	display: block;
    	background: url(http://www.schechter-industries.com/images/misc/intro1.png) no-repeat;
    }
    #rollover a:hover {
    	background: url(http://www.schechter-industries.com/images/misc/intro2.png) no-repeat;
    }
    </style>
    </head>
    <body>
        <div id="wrap">
            <div id="rollover">
            	<a href="">link</a>
            <!--end rollover--></div>
        <!--end wrap--></div>
    </body>
    </html>
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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