|
| |
|
|
chrlogan
Posts: 5
Joined: 5/1/2009
Status: offline
 |
Firefox not applying certain css elements - 5/1/2009 15:07:11
Hi all,
Have a quick question! A site I'm working on is displaying the way I want it to in IE and not Firefox (there's a first time for everything!). The site is located here:
http://www.myrelationshipresolution.com/
More specifically, I'm just referring to the header -- the title doesn't display in white nor does menu bar appear in purple (although the hover works).
Page Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<center>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td class="leftheader" width="15%"></td>
<td class="rightheader" width="*" valign="bottom"><h1>Welcome to the Relationship Resolution Centre, Inc.</h1></td>
</tr>
</table>
<table width="100%" cellpadding="0" cellspacing="0">
<tr class="rowhead">
<td class="menubarleft" width="15%"><font color="white">.</font></td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Coaching</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Mediation</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Financial Divorce Analysis</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Relationship Building</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Workplace Bullying</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">About Us</td>
<td class="menubar" width="12%" valign="bottom" onmouseover="this.style.backgroundColor='#C97979'" onmouseout="this.style.backgroundColor='#997979'">Contact Us</td>
</tr>
</table>
</center>
</html>
CSS:
h1 {
color: white;
}
h2 {
color: #997979;
}
td.leftheader {
background-image: url('RRC_finalOttawa.png');
background-repeat: no-repeat;
margin: 0px auto; position: relative;
}
td.rightheader {
background: repeat-x url('testbar.png');
margin: 0px auto; position: relative;
height: 125px;
text-align: center;
padding-bottom:12px;
}
td.menubar {
background-color: #997979;
color: white;
text-align: center;
}
td.footer {
background: repeat-x url('botbar.png'); color: #FFF;
margin: 0px auto; position: relative;
width: 764px; height: 85px;
z-index: 1;
text-align: center;
color:black;
font-family: arial, "lucida console", san-serif;
font-size: 12px;
}
Thanks for any help!
< Message edited by chrlogan -- 5/1/2009 15:20:57 >
|
|
|
|
chrlogan
Posts: 5
Joined: 5/1/2009
Status: offline
|
RE: Firefox not applying certain css elements - 5/1/2009 15:48:03
http://myrelationshipresolution.com/
I was under the impression that IE could not work properly with something like td.whatever:hover hence I went with the JS mouseovers. What is a better solution?
EDIT: Seems to be working fine now in Firefox. /shrug
Let me follow up with:
Yes, I'm building a site with frames. I realize that I probably should have gone with /includes but the site is very small and not code heavy so I'm not too worried about it for now.
| |
|
|
|
chrlogan
Posts: 5
Joined: 5/1/2009
Status: offline
|
RE: Firefox not applying certain css elements - 5/1/2009 16:24:51
That's a good point -- adding the hover to the link as opposed to the td.
One quick question then, since I'm going to reworking this using includes here -- http://myrelationshipresolution.com/index_test.php
Currently have a table set up which includes the header, sidemenu, body and footer for the index page. If I click a link on the sidemenu, I suppose there isn't an equivalent to say a targetted link for a frame. That is, I'd have to have the table with the includes on every single page?
Thanks for all the help. :)
| |
|
|
|
chrlogan
Posts: 5
Joined: 5/1/2009
Status: offline
|
RE: Firefox not applying certain css elements - 5/7/2009 18:28:42
Hey, new question --
http://www.myrelationshipresolution.com/coaching.php
The sidepanel is being affected by <br> and <p> in the body text. The layout for coaching.php --
<tr>
<td>
<?php include "header.php"; ?>
</td>
</tr>
</table>
<table width="90%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="20%">
<?php include "sidepanel.php"; ?>
</td>
<td width="80%" valign="top" align="left" class="main">
text is here with <br> and <p>!
</td>
</tr>
</table>
<table width="90%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<?php include "footer.php"; ?>
</td>
</tr>
</table>
How can I:
a) alleviate the issue in the short term without redesign, if possible
b) design a better layout ?
Cheers!
-Chris
| |
|
|
|
chrlogan
Posts: 5
Joined: 5/1/2009
Status: offline
|
RE: Firefox not applying certain css elements - 5/8/2009 10:29:00
I don't know what to use instead of tables to achieve a columnar setup. /blush
< Message edited by chrlogan -- 5/8/2009 10:35:12 >
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
