Firefox CSS issue

Discussion in 'CSS' started by Bilalq, Nov 21, 2006.

0
  1. #1
    Hello,
    Can some on eplease tell me why the following code won't work in firefox. It works fine in explorer. I know from reading and reading that firefox does have an excellent support for CSS, but for some strange reason it does not work on mine. I have Firefox/1.0.3 installed. Thanks in advance.........

    
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
	    <title>Frame1</title>
	    <style type="text/css">
		body
		{
		   font-size:12pt;
		   font-weight:normal;
		   font-family: arial, helvetica, Sans-Serif;
		   width:100%;
		   margin-top:1;
		}
		img
		{
		   margin-top:0.4em;
		}
		.mystyle1
		{
		   padding: 0em;
		   margin: 0em;
		   text-align: center;
		}
		.TDInfo
		{
		   float:right;
		   font-weight:bold;
		   width:28%;
		   text-align:right;
		   margin-top:1em;
		}
		.TDPic
		{
		   float:right;
		   width:15%;
		   font-weight:bold;
		   text-align:center;
		   vertical-align:middle;
		   height:4em;
		}
		div
		{
		   float:right;
		}
		#tb2
		{
		   width:100%;
		   height:60;
		   background-color:F0F0EF;
		   padding:0, 0, 0, 0;
		}
		.textbox
		{
		   background-color:CBCBCB;
		}
	   </style>

	</head>
	
	<body>
	<form id="frame1">
	   <div class="mystyle1">
		<div id="tb2">
		   <span class="TDPic"><img id="patient-info" src="images/patient-pic.jpg" alt="Patient Pic"></span>
		   <span class="TDInfo">First Name:&nbsp;&nbsp;<input class="textbox" type="text" id="fname" name="fname" disabled></span>
		   <span class="TDInfo">Gender:&nbsp;&nbsp;<input class="textbox" type="text" id="gender" NAME="gender" disabled></span>
		   <span class="TDInfo">Weight:&nbsp;&nbsp;<input class="textbox" type="text" id="weight" NAME="gender" disabled></span>
		   <span class="TDInfo" style="margin-bottom:0.5em;">Last Name:&nbsp;&nbsp; <input class="textbox" type="text" id="lname" NAME="lname" disabled></span>
		   <span class="TDInfo">D.O.B:&nbsp;&nbsp;<input class="textbox" type="text" id="dob" NAME="dob" disabled></span>
		   <span class="TDInfo">Height:&nbsp;&nbsp;<input class="textbox" type="text" id="height" NAME="height" disabled></span>
		</div>
	   </div>
	</form>
	</body>
</html>
    Code (markup):

     
    Bilalq, Nov 21, 2006 IP
  2. chopsticks

    chopsticks Active Member

    Messages:
    565
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    60
    #2
    Removing the "float:right;" from the DIV seems to stop it moving so far to the right in Firefox, and doesn't seem to have any difference in Internet Explorer or Opera.

    Try validating your CSS using the W3C CSS Validator. Might fix some stuff in your code aswell.
     
    chopsticks, Nov 23, 2006 IP
  3. nowares

    nowares Active Member

    Messages:
    115
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    80
    #3
    Yep, the W3C CSS Validator is like an old school teacher of mine rofl.
    Damn mistakes :(
     
    nowares, Nov 30, 2006 IP
  4. halotree

    halotree Peon

    Messages:
    211
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I know you may not want to, but can i suggest you use a stylesheet? What do you mean by not working? as in not appearing at all?
     
    halotree, Nov 30, 2006 IP