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 4 of 4
  1. #1
    Regular Coder
    Join Date
    Aug 2002
    Posts
    151
    Thanks
    5
    Thanked 0 Times in 0 Posts

    CSS for table appearing differently on Firefox Chrome

    Hello,

    Please visit: http://www.greek-concierge.com/benefits

    The first row in the tables appears much larger than it should be in Firefox and Chrome.

    It looks fine in IE.

    Here is the CSS i am using:

    Code:
    table.gridtable {
    	font-family: verdana,arial,sans-serif;
    	font-size:11px;
    	color:#d1d1d1;
    	border-width: 1px;
    	border-color: #383838;
    	border-collapse: collapse;
    }
    table.gridtable th {
    	border-width: 1px;
    	padding: 8px;
    	border-style: solid;
    	border-color: #383838;
    	background-color: #232323;
    }
    table.gridtable td {
    	border-width: 1px;
    	padding: 8px;
    	border-style: solid;
    	border-color: #383838;
    	background-color: #000000;
    	text-align: left;
    }
    any help?

    thanks a lot
    Andy

  • #2
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Code:
    table.gridtable th {
    	border-width: 1px;
    	padding: 8px;
    	border-style: solid;
    	border-color: #383838;
    	background-color: #232323;
    }
    Code:
    table.gridtable th {
    	border-width: 1px;
    	padding: 0 8px;
    	border-style: solid;
    	border-color: #383838;
    	background-color: #232323;
    }
    the differences in how it look come mainly from invalid markup:

    http://validator.w3.org/check?verbos...com%2Fbenefits

    try to fix it.

    best regards

  • #3
    Regular Coder
    Join Date
    Aug 2002
    Posts
    151
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Hi oesxyl,

    I tried your suggestion and this fixes Firefox and Chrome but it messes up IE. the height is too narrow now on IE.

    thanks for the help
    Andreas

  • #4
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by neodjandre View Post
    Hi oesxyl,

    I tried your suggestion and this fixes Firefox and Chrome but it messes up IE. the height is too narrow now on IE.

    thanks for the help
    Andreas
    yes, but you didn't validate that means each time you fix something you have big chances to break something else.
    About IE differences, must be a box model problem and depend of the ie version, i would use conditional comment to add new style for ie.

    http://htmlfixit.com/contribs/MS_conditional_tags.html

    at the end of the page there is a link to another way to solve this.

    best regards


  •  

    Posting Permissions

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