www.webdeveloper.com
Results 1 to 6 of 6

Thread: Cellspacing doesn't work in Firefox

  1. #1
    Join Date
    Mar 2011
    Posts
    3

    Cellspacing doesn't work in Firefox

    My website looks exactly the way my client wants it to look like in IE, but in Firefox the cellspacing and table background is not visible.

    Can anybody please tell me what I'm doing wrong. First I buit it in nested tables and thought that that might be the problem, so I rebuilt it in DIV's, but it's no better.

    My coding:

    SITE_TOP:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>AfJARE</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <META name="keywords" content="journal, agriculture, environment">
    <link rel="stylesheet" href="inc/reset-fonts-grids.css" type="text/css">
    <link rel="stylesheet" href="inc/skin.css" type="text/css">
    </head>
    
    <body>
    <div align="center">
    	<div class="mainpane">
    		<div class="topsection">
    			<table cellspacing="10px" cellpadding="10px" border="0" bgcolor="#4A6997" width="800px">
    		    <tr><td bgcolor="#BEC287" class="menu"><h1>AfJARE</h1>
                <br/>
                <p>  <a class="menu" href="index.asp">Home</a>
                <br/><a class="menu" href="editorialstaff.asp">Editorial Board</a>
                <br/><a class="menu" href="contact.asp">Contact Us</a>
                <br/><a class="menu" href="authors.asp">Guidelines for Authors</a>
                <br/><a class="menu" href="referees.asp">Information for Referees</a>
                <br/><a class="menu" href="links.asp">Links</a>
                <br/>
                </p>
                </td>
                <td><img src="img/main.jpg" width="600px" align="right">
                </td>
                </tr>
    		  </table>		
          	</div>
    INDEX.ASP
    Code:
    <!--#include file="site_top.asp" -->
       
          <!-- Always include the above -->
          
          <!-- Content goes here -->
            
    <table class="body" cellspacing="10px" align="center">
    <tr>
    <td class="body" width="210" align="center" valign="top">
    <h1>Our latest issues</h1>
    <br/>
    <p>Vol.5 no.2, December 2010<br/>
    <a href="volume 5 no 2.asp"><img width="180px" src="img/coverfinalold5-2.jpg"/></a>
    <br/>
    <br/>Vol.5 no.1, September 2010<br/>
    <a href="volume 5 no 1.asp"><img width="180px" src="img/coverfinalold5-1.jpg"/></a>
    </p>
    <br/>
    <br/>
    </td>
    <td class="body" width="365" bgcolor="#BEC287" align="center" valign="top">
    <h1>Aim Scope and Mission</h1>
    <br/>
    <p align="justify">The African Journal of Agricultural and Resource Economics (AfJARE) is published by the African Association of Agricultural Economists (AAAE).  The journal aims to publish original research about how African agriculture interacts with local and global economic systems and policy regimes in its impacts upon people.  The scope of the journal covers the roles of markets, technology, policy, institutions and the natural environment in shaping the lives of wellbeing of Africans engaged in agricultural activities.  The journal strives to nurture and enhance the capacity of African professionals to conduct and publish scientific research and provides a venue for communicating and disseminating their findings.  Multi-disciplinary, problem-oriented articles are encouraged.  Submissions may deal with teaching, research extension, consulting, advising, entrepreneurship and administration.  The Chief Editors and Editorial Board, under the general dirction of the AAAE President, Executive Committee and Council are charged with implementing Journal policy to serve members of AAAE.</p>
    <div align="justify"><br/>
    </div>
    <p align="justify">
    The main section of the journal publishes technical research articles while a small section is devoted to publishing brief notes with important policy content and book reviews.  The journal is published twice per year.</p>
    
    </td>
    <td class="body" width="210" bgcolor="#BEC287" align="center" valign="top">
    <h1>Search Archives</h1><br/>
    <p>
    Search by volume:<br/>
    <form name="volume">
    <p align="center">
    <select name="menu">
    <option value="volume 5 no 2.asp">Volume 5, no.2</option>
    <option value="volume 5 no 1.asp">Volume 5, no.1</option>
    <option value="volume 4 no 2.asp">Volume 4, no.2</option>
    <option value="volume 4 no 1.asp">Volume 4, no.1</option>
    <option value="volume 3 no 2.asp">Volume 3, no.2</option>
    <option value="volume 3 no 1.asp">Volume 3, no.1</option>
    <option value="volume 2 no 2.asp">Volume 3, no.2</option>
    <option value="volume 2 no 1.asp">Volume 2, no.1</option>
    <option value="volume 1 no 2.asp">Volume 1, no.2</option>
    <option value="volume 1 no 1.asp">Volume 1, no.1</option>
    </select>
    <input type="button" onClick="location=document.volume.menu.options
    [document.volume.menu.selectedIndex].value;" value="Submit">
    </p>
    </form>
    </p>
    <br/>
    <p>
    Search by date:<br/>
    <form name="date">
    <p align="center">
    <select name="menu">
    <option value="volume 5 no 2.asp">December 2010</option>
    <option value="volume 5 no 1.asp">September 2010</option>
    <option value="volume 4 no 2.asp">June 2010</option>
    <option value="volume 4 no 1.asp">March 2010</option>
    <option value="volume 3 no 2.asp">September 2009</option>
    <option value="volume 3 no 1.asp">March 2009</option>
    <option value="volume 2 no 2.asp">September 2008</option>
    <option value="volume 2 no 1.asp">March 2008</option>
    <option value="volume 1 no 2.asp">September 2007</option>
    <option value="volume 1 no 1.asp">December 2006</option>
    </select>
    <input type="button" onClick="location=document.date.menu.options
    [document.date.menu.selectedIndex].value;" value="Submit">
    </p>
    </form>
    </p>
    <br/>
    <p>
    Search by author:</p>
    </p>
    <br/>
    </td>
    </tr>
    </table>
    
    
    <!-- Always include the underneath -->
    <!--#include file="site_bottom.asp" -->
    SITE_BOTTOM
    Code:
    		</div>
    		<div class="bottomsection">
    	  		<a href="index.asp">Home</a> | <a href="terms.asp">Terms & Conditions</a> | <a href="privacy.asp">Privacy Statement</a> | <a href="contact.asp">Contact Us</a>
    	  	</div>
    		<div class="companysection">
    	  		Website Developed by 
    	  	</div>	  	
      	</div>
    </div>
    </body>
    </html>
    
    CSS:
    
    /******* Main *******/
    body {
    	font:14px  Arial, Helvetica, sans-serif;
    	height:auto;
    	margin:0px;
    	padding: 0px;
    	color: #100000;
    	}
    a:link {
    	color: #4A6997;
    	text-decoration: none;
    	}
    a:visited {
    	color: #4A6997;
    	text-decoration: none;	
    	}
    a:active {
    	color: #100000;	
    	text-decoration: none;
    	}		
    a:hover {
    	color: #663399;
    	text-decoration: none;
    	}
    H1 {
    	font: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 20px;
    	font-style: normal;
    	font-weight: bold;
    	color: #100000;	
    	}
    H2 {
    	font: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 18px;
    	font-style: normal;
    	font-weight: bold;
    	color: #100000;
    	}
    H3 {
    	font: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 16px;
    	font-style: normal;
    	font-weight: bold;
    	color: #100000;	
    	}
    input.text {
    	border: 1px solid 663399;
    	}		
    /******* Main Pane Section *******/
    .mainpane{
    	width: 800px;
    	padding-top: 15px;
    	background-color: #FFFFFF
    	}
    .topsection{
    	padding-top: 15px;
    	padding-bottom: 0px;
    	height: 188px;	
    		}
    .menusection{
    	padding-top: 0px;
    	color:#FFFFFF;
    	font-size: 14px;
    	width: 750px;	
    		}		
    a.menu{
    color: #100000;
    text-decoration:none;
    font-weight:bold;
    font-size:12px;
    }
    a.menu_link{
    color:#FFFFFF;
    text-decoration:none;
    font-weight:bold;
    font-size:12px;
    }
    a.menu_active{
    color:#FFFFFF;
    text-decoration:none;
    font-weight:bold;
    font-size:12px;
    }
    a.menu_visited{
    color: #4A6997;
    text-decoration:none;
    font-weight:bold;
    font-size:12px;
    }
    td.menu{
    border: 0;
    background-color:#BEC287;
    padding:10px;
    }
    
    table.body{
    background-color:#4A6997;
    width: 800px;
    border:0;
    }
    td.body{
    padding:10px;
    background-color:#BEC287;
    
    }
    .middlesection{
    	padding-bottom: 15px;
    	padding-left:10px;
    	padding-right:10px;
    	text-align: left;
    		}
    .bottomsection{
    	padding-top: 5px;
    	padding-bottom: 0px;
    	color: #FF2CA4;
    		}
    Last edited by Kor; 03-15-2011 at 06:59 AM. Reason: wrap the code [code][/code]

  2. #2
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Your presentation codes are contradictory . On one hand you want to use cellspacing in HTML
    Code:
    <table width="800px" cellspacing="10px" cellpadding="10px" border="0" bgcolor="#4a6997">
    on the other you destroy the cellspacing from within CSS
    Code:
    table {
     border-collapse: collapse;
     border-spacing: 0;
    }
    That CSS class is equivalent to cellspacing=0 In normal browsers (well, IE is not quite a normal one CSS rules override the correspondent HTML attributes.

    Make up your mind how do you want to control the cellspacing: in HTML or in CSS ?

  3. #3
    Join Date
    Mar 2011
    Posts
    3
    I appreciate the reply, but I don't see the part that you copied from my CSS? The border collapse and border spacing?

  4. #4
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428

  5. #5
    Join Date
    Mar 2011
    Posts
    3
    Wow, great - it worked! Thank very much

  6. #6
    Join Date
    Aug 2014
    Posts
    1

    cellspacing is not at all working in firefox...

    Hi

    please giude me how to fix this i too have the same pblm..I commented out
    table {
    border-collapse: collapse;
    border-spacing: 0;
    }
    in my reset.css and i am trying to give cellspacing="10" in my html...
    In ie its working fine but in firefox its not at all workingg..

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles