SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2005
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Why is my font always bold in tables??

    Hello, I am having a problems with my tables. Any text that I put within a table on my page is automatically bolded and I can't seem to find out why. I will post my css file below, but I have searched it thoroughly and I cannot figure it out. Any help would be greatly appreciated!

    Thanks!
    Code:
    * {margin:0; padding:0;} /* add a reset*/
    
    html, body {
    	height: 100%;
    }
    
    body {
    	margin: 0;
    	padding: 0;
    	background: #EDFBD2 url(images/img01.jpg) repeat-x left top;
    	background-color:#B6DA9E;
    	color: #2B4E15;
    	}
    
    form {
    	margin: 0;
    	padding: 0;
    }
    
    input, textarea {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 1em;
    	color: #000000;
    }
    
    	h1, h2, h3 {
    Font:"Times New Roman", Times, serif}
    
    h1 {font-size: 3em; text-align:center	}		
    h2 {font-size: 2em; text-align:center	}
    h3 {font-size: 2em; text-align:center	}
    h4 {font-size: 1em; text-align:justify; }
    h5 {text-align:center; font-size:1.4em	}
    h6 {font-size: .6em; text-align:right 	}~
    
    p, ul, ol {
    	margin-bottom: 1.8em;
    	line-height: 160%;
    	}
    
    ul, ol {
    }
    
    blockquote {
    }
    
    a {
    	color: #2B4E15;
    }
    
    a:hover {
    	text-decoration: none;
    }
    
    hr {
    	display: none;
    }
    
    /* Wrapper */
    
    #wrapper {
    	height: 100%;
    	min-height: 100%;
    	
    }
    
    html>body #wrapper {
    	height: auto;
    }
    
    /* Menu */
    
    #menu {
    	width: 906px;
    	height: 57px;
    	padding-top: 10px;
    	margin: 0 auto;
    }
    
    #menu ul {
    	float: right;
    	margin: 0 64px 0;
    	padding: 0;
    	list-style: none;
    }
    
    #menu li {
    	display: inline;
    }
    
    #menu a {
    	float: left;
    	height: 16px;
    	padding: 10px 15px;
    	text-decoration: none;
    	text-transform: uppercase;
    	font-size:1em;
    	font-weight: bold;
    	color: #000000;
    	font:Georgia;
    	}
    
    #menu a:hover {
    	background: #B6DA9E;
    	color: #FFFFFF;
    }
    
    #menu .current_page_item a {
    	background: #B6DA9E;
    	color: #FFFFFF;
    }
    
    /* Logo */
    
    #logo {
    	width: 906px;
    	height: 180px;
    	margin: 0 auto;
    	color: #FFFFFF;
    	text-align:center;
    }
    
    #logo h1, #logo h2 {
    	float: left;
    	margin: 0;
    }
    #logo h2 {
    	padding: 36px 0 0 10px;
    	letter-spacing: -1px;
    	text-transform: uppercase;
    	font-weight: normal;
    	font-size: 14px;
    }
    
    #logo a {
    	text-decoration: none;
    	color: #FFFFFF;
    }
    
    /****main*****/
    
    .main {
    font-size:1.2em;
    text-align:justify;
    border:medium;
    border-right:3px outset #009900;
    border-left:3px inset #009900;
    background-color:#9BCE79;
    width: 900px;
    margin: 0 auto;
    margin-top:-30px;
    padding:0px 0;
    min-height:400px;
    overflow:hidden;
    padding:20px 0;
    position:relative;
    }
    
    
    
    /* Page */
    
    #page {
    	float:left;
    	width: 580px;
    	margin: 0 auto;
    	padding: 20px 0 0 50px;
    }
    
    #page p {
    font-size: 1em}
    
    /* Content */
    
    #content {
    	float: left;
    	width: 494px;
    	text-align:justify;
    	}
    
    /* Sidebar */
    
    #sidebar {
    	float: right;
    	width: 260px;
    		}
    	
    #sidebar ul {
    	margin-left:1.3em;
    	padding: 0;
    	list-style: none;
    }
    
    #sidebar li {
    	
    	margin-bottom:20px;
    	line-height:17px}
    	
    #sidebar li li {
    	margin: 0;
    	}
    /*
    #sidebar p {
    	padding: 0 20px;
    }
    */
    
    #sidebar h2 {
    	height: 29px;
    	margin: 0;
    	padding: 9px 0 0 0;
    	background: #B6E074;
    	border: 1px  dotted #4D7C2B;
    	font-size: 1.4em;
    	font-weight: normal;
    	color: #000000;
    	margin-bottom:20px;
    	text-align:center}
    
    /* Footer */
    
    #footer {
    
    	clear: both;
    	padding: 0;
    	font-size: 12px;
    	background: url(images/footer.gif) repeat-x left bottom;
    	line-height:56px
    	}
    
    #footer p {
    	margin: 0 auto;
    	text-align: center;
    	width: 906px;
    }
    
    
    #titlebar {
    color:white;
    font-size:17px;
    font-weight:bold;
    text-indent:28px;
    padding-top:3px
    }
    
    #titlebar2 {
    color:white;
    font-size:17px;
    font-weight:bold;
    text-indent:48px;
    padding-top:3px
    }
    
    #right {
    position:absolute;
    right: 55px;
    top: 38px;	
    font-size:16px;
    float: right;
    list-style: none;
    width: 196px;
    padding-top: 3px;
    height: 165px;
    padding-left:20px;
    margin-left:-20px;
    background:url(images/background.png);
    }
    
    #right ul{
    	list-style: none;
    	margin: 0px;
    	padding: 0px;
    }
    
    #right a:link{
    color: #4A7629;
    font-family: Trebuchet MS;
    font-size: 18px;
    height: 23px;
    display:block;
    text-decoration: none;
    padding: 8px 0 0 0px;
    font-weight:normal;
    }
    
    #right a:visited{
    text-decoration: none;
    }
    
    #right a:hover{
    color:white;
    }
    
    #right a:active{
    color: #dbdbdb;
    }
    
    #right2 {
    font-size:16px;
    position:absolute;
    right:55px;
    top:220px;
    margin-top:10px;
    float: right;
    list-style: none;
    width: 196px;
    padding-top: 3px;
    height: 165px;
    padding-left:20px;
    margin-left:-20px;
    background:url(images/background.png);
    }
    
    
    #right2 ul{
    	list-style: none;
    	margin: 0px;
    	padding: 0px;
    }
    
    #right2 a:link{
    color: #4A7629;
    font-family: Trebuchet MS;
    font-size: 18px;
    display:block;
    text-decoration: none;
    padding: 8px 0 0 0px;
    font-weight:normal;
    }
    
    #right2 a:visited{
    text-decoration: none;
    }
    
    #right2 a:hover{
    color:white;
    }
    
    #right2 a:active{
    color: #dbdbdb;
    }
    
    
    .sermons {
    color:black;	
    }
    
    
    
    #links {
    position:absolute;
    background-color:#D9E5CF;
    min-height:399px;
    width:215px;
    right:0px;
    border-left:3px solid #005C00;;
    top:0px;
    line-height:30px;
    font-size:18px;
    height:500%;
    }
    
    #links A:link {
    color:black;
    text-decoration:none;
    text-indent:5px;
    }
    
    #links a:visited {
    text-decoration:none;
    color:black;
    }
    
    #links A:hover {
    color:black;
    }
    #links ul li { 
    list-style:none}
    
    #links li a{
    border-bottom:thin #000000 solid;
    display:block;
    text-indent:5px	}
    
    #links li:hover {
    background-color:#9BCE79;
    color:black
    }
    
    #centerpic {
    margin-left:45px;
    }
    
    
    /*****************************************Contact Us Form**********************************/
    #contact-area {
    	width: 600px;
    	margin-top: 25px;
    }
    
    #contact-area input, #contact-area textarea {
    	padding: 5px;
    	width: 350px;
    	font-family: Helvetica, sans-serif;
    	font-size: .8em;
    	margin: 0px 0px 10px 0px;
    	border: 2px solid #ccc;
    }
    
    #contact-area textarea {
    	height: 90px;
    }
    
    #contact-area textarea:focus, #contact-area input:focus {
    	border: 2px solid #900;
    }
    
    #contact-area input.submit-button {
    	
    	width: 100px;
    	float: left;
    	margin-left:300px
    }
    
    label {
    	float: left;
    	text-align: right;
    	margin-right: 15px;
    	width: 100px;
    	padding-top: 5px;
    	font-size: 1.4em;
    }
    
    #page-wrap {
    	width: 455px;
    	background: white;
    	border: thin solid black;
    	padding: 20px 50px 20px 50px;
    		min-height: 270px;
    	height: auto !important;
    	height: 270px;
    }
    
    
    /*****************************************Tables**********************************/
    
    #tables {
    width 100%;
    font-size: .8em;
    font-weight:500}
    
    
    /****************************************Order of Service*************************/
    
    #order {
    position:absolute;
    float:right;
    width:215px;
    right:0px;
    top:0px;
    line-height:30px;
    height:500%;
    
    }
    Last edited by Varelse; Sep 12, 2008 at 15:06. Reason: code tags added

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,597
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    well you did tell it to use font-weight:500 for the tables and since 400 is normal some browsers will make 500 bold.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    @jordan8201 - For now so you do not run into issues such as these stick to 'bold' and 'normal' for font-weight.

  4. #4
    SitePoint Enthusiast
    Join Date
    Dec 2005
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That was just for a div that was called tables. Anyway, I removed that line and I am still having the problem with my tables.

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,597
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    Well without seeing the HTML it is impossible to tell which of the styles you have defined is the one setting the table content to bold.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Enthusiast
    Join Date
    Dec 2005
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, here is an example:
    http://www.mzbc.com/main.htm

    Thanks

  7. #7
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jordan8201 View Post
    Ok, here is an example:
    http://www.mzbc.com/main.htm

    Thanks
    Sidenote - <th> defaults to font-weight: bold;

    th { font-weight: normal; }

  8. #8
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,729
    Mentioned
    31 Post(s)
    Tagged
    0 Thread(s)
    I am not certain of this answer, but
    looking at your markup I wonder why you used THs within TRs instead of TDs? I think that may be the root cause... hope I have helped.

  9. #9
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,597
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    You should only be using <th> for the table column and row headings. The table content should be in <td> tags. The purpose of the two tags is to distinguish the headings from the data in the table. If you use the correct tags in the table then you don't have to attempt to override the way they look in the CSS as much since only the headings default to bold.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">


Bookmarks

Posting Permissions

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