Help & FAQs    Search BCF    Members    Groups    Events Calendar
Resend my activation email : Register : Log in 
BCF: Bike Chat Forums


CSS + Firefox issue..

 Reply to topic
Bike Chat Forums Index -> The Geek Zone
View previous topic : View next topic  
Author Message

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 10:35 - 30 Jul 2010    Post subject: CSS + Firefox issue.. Reply with quote
Does CSS not display correctly in firefox or am I doing something wrong?

I've made a website which has CSS table border properties, this displays fine in my HTML code editor (not a drag and drop one) and displays fine in internet explorer but when I open in firefox the border does not display as colour, its invisible! Other than that all nothing changes, just the border colour dissapears.

Any ideas??
____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Phil.
World Chat Champion



Joined: 02 Feb 2002
Karma :
PostPosted: 10:45 - 30 Jul 2010    Post subject: Reply with quote
Can you post the code that you are having trouble with?
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Kickstart
The Oracle



Joined: 04 Feb 2002
Karma :
PostPosted: 10:46 - 30 Jul 2010    Post subject: Reply with quote
Hi

I would suspect FF is correct and IE is managing to bodge things.

Download firebug and check the style of the element to see if something has over ridden it.

Also try a few other browsers (Opera, Safari and Chrome).

All the best

Keith
____________________
Traxpics, track day and racing photographs - Bimota Forum - Bike performance / thrust graphs for choosing gearing
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 11:08 - 30 Jul 2010    Post subject: Reply with quote
Attached a test file which has the exact problem, shows fine in IE but the table border dissapears in firefox...

p.s as you can tell, I've only just started using CSS and I still suck Laughing
____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Kickstart
The Oracle



Joined: 04 Feb 2002
Karma :
PostPosted: 11:27 - 30 Jul 2010    Post subject: Reply with quote
Hi

I have tried to download that and found it empty.

Can you just post the code (use [ c o d e ] tags)

All the best

Keith
____________________
Traxpics, track day and racing photographs - Bimota Forum - Bike performance / thrust graphs for choosing gearing
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 13:00 - 30 Jul 2010    Post subject: Reply with quote
CSS File

Code:

p
{
font-family:"tahoma";
font-size:0.9em;
text-decoration:bold;
color:white;
padding:0px 40px;
text-align:justify;
}

p.second
{
font-family:"tahoma";
font-size:0.9em;
text-decoration:bold;
color:#000000;
padding:0px 40px;
text-align:justify;
}


table.first
{
border-color:#dc9541;
border-style: solid;
}


A:link   {font-family: arial; text-decoration: none; color:  red }
A:visited   {font-family: arial; text-decoration: none; color:  red }
A:active   {font-family: arial; text-decoration: none; color: red }
A:hover   {font-family: arial; text-decoration: underline; color: red }
   


A test html file

Code:
<html>
<head>
<title>supercooks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <link href="style.css" type="text/css" rel="stylesheet"/>

</head>
<body bgcolor="#5a0000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">


<table class="first" width="500" height="500" border="0" cellpadding="0" cellspacing="0">
   <tr>
      <td colspan="5">
         testtesttesttest
         
   </td>
         
</tr>
         
</table>

</body>
</html>


Shows a thick orange border in IE but not in firefox...
____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Kickstart
The Oracle



Joined: 04 Feb 2002
Karma :
PostPosted: 13:21 - 30 Jul 2010    Post subject: Reply with quote
Hi

Set a border width for the table (ie border-width:5px;).

Also correct the minor HTML errors (ie, add a doc type), as this can lead to inconsistent handling of layouts..

All the best

Keith
____________________
Traxpics, track day and racing photographs - Bimota Forum - Bike performance / thrust graphs for choosing gearing
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts

Frost
World Chat Champion



Joined: 26 May 2004
Karma :
PostPosted: 13:33 - 30 Jul 2010    Post subject: Reply with quote
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" lang="en" dir="ltr">
<head>
<title>supercooks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <link href="style.css" type="text/css" rel="stylesheet"/>

</head>
<body>


<table id="first">
   <tr>
      <td colspan="5">
         testtesttesttest         
      </td>         
   </tr>         
</table>

</body>
</html>


That's hot your HTML should look, all the stuff you have in there is style info and should be in the css file. Putting it int he HTML file you will eventually find yourself trying to over ride something with css and failing.
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 13:43 - 30 Jul 2010    Post subject: Reply with quote
Kickstart wrote:
Hi

Set a border width for the table (ie border-width:5px;).

All the best

Keith


Simple as that Laughing thanks!
____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 13:44 - 30 Jul 2010    Post subject: Reply with quote
DaFrostyOne wrote:
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" lang="en" dir="ltr">
<head>
<title>supercooks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <link href="style.css" type="text/css" rel="stylesheet"/>

</head>
<body>


<table id="first">
   <tr>
      <td colspan="5">
         testtesttesttest         
      </td>         
   </tr>         
</table>

</body>
</html>


That's hot your HTML should look, all the stuff you have in there is style info and should be in the css file. Putting it int he HTML file you will eventually find yourself trying to over ride something with css and failing.


Nice one thank you, I'll go through the actual website and improve on the HTML as per your advice.
____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Sparks!
Sir Tart-a-lot



Joined: 30 Aug 2003
Karma :
PostPosted: 14:13 - 30 Jul 2010    Post subject: Reply with quote
DaFrostyOne wrote:

That's hot your HTML should look, all the stuff you have in there is style info and should be in the css file. Putting it int he HTML file you will eventually find yourself trying to over ride something with css and failing.


I've tried tidying my code up following your guides... once I remove cellpadding="0" and cellspacing="0" from the table itself in the HTML file then I lose the cellpading and spacing formatting on the site... Ideally id like to do this in CSS then but what I've put in doesn't work


Code:
}

table.second
{
border-color:#dc9541;
border-style: solid;
border-width:3px
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
margin: 0px 0px 0px 0px;


}

____________________
Current Toys: 06 Yamaha WR250F | Nissan 350Z GT | Tech 4 Homes
 Back to top
View user's profile Send private message Visit poster's website You must be logged in to rate posts

Kickstart
The Oracle



Joined: 04 Feb 2002
Karma :
PostPosted: 14:22 - 30 Jul 2010    Post subject: Reply with quote
Hi

The padding really applies to the table cells rather than the table which might be causing the issue

Have a read of this.

https://www.quackit.com/css/css_cellpadding.cfm

All the best

Keith
____________________
Traxpics, track day and racing photographs - Bimota Forum - Bike performance / thrust graphs for choosing gearing
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts

Frost
World Chat Champion



Joined: 26 May 2004
Karma :
PostPosted: 16:23 - 30 Jul 2010    Post subject: Reply with quote
Also note the difference between an element 'class' and an element 'id'. ID's are unique and won't be repeated e.g major formatting areas. Classes are things that are be be repeated.

https://www.tizag.com/cssT/cssid.php

Messing them up is a very common cause of problems.

Paddings and margins are the bulk of what goes into css and can be a right pain to get sorted sometimes, especially when IE displays them different to firefox & chrome.

Do yourself a favour and develop it for firefox, and forget about trying to make it work for IE6! If your using something like dreamweaver you can set what display engine it uses to show the page you are editing.

If you are using dreamweaver it has features to check of code is valid css & xhtml. If not then there are some online validators:

https://validator.w3.org/

They will tell you rather cryptically where the error is. At first they will be a pain and slow you down, but you will learn how to do things properly which will save you time in the long run. good luck Razz
 Back to top
View user's profile Send private message Send e-mail You must be logged in to rate posts
Old Thread Alert!

The last post was made 16 years, 39 days ago. Instead of replying here, would creating a new thread be more useful?
  Display posts from previous:   
This page may contain affiliate links, which means we may earn a small commission if a visitor clicks through and makes a purchase. By clicking on an affiliate link, you accept that third-party cookies will be set.

Post new topic   Reply to topic    Bike Chat Forums Index -> The Geek Zone All times are GMT + 1 Hour
Page 1 of 1

 
 You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
You cannot attach files in this forum
You cannot download files in this forum

Read the Terms of Use! - Powered by phpBB © phpBB Group
 
Debug Mode: ON - Server: birks (www) - Page Generation Time: 0.13 Sec - Server Load: 0.4 - MySQL Queries: 13 - Page Size: 87.35 Kb