PDA

View Full Version : Why does my text look bold?


Ogaac
09-25-2010, 04:06 AM
I'm building a site based on a template I made, and no matter what font I pick it looks bold in Live Preview or if I preview in a browser. Any browser.

Everything looks normal in the WYSIWYG editor. I have a CSS style attached to it, but I'm next to positive that's not causing the problem (but am willing to post it if anyone doubts me).

Did I hit a funny setting? Am I hallucinating?

Thank you kindly,

Ogaac

edbr
09-25-2010, 04:10 AM
yes post or we can't guess what is causing it

Ogaac
09-25-2010, 04:30 AM
Again, I don't think it's anything wrong with my CSS, but please prove me wrong because this is driving me nuts.

@charset "UTF-8";
/* CSS Document */

body {
font-family: Tahoma, Geneva, sans-serif;
color: #FFF;
background-color: #000;
width: 960px;
background-image: url(../Images/KADDbacker.gif);
background-repeat: no-repeat;
background-position: center top;
margin-left: auto;
margin-right: auto;
}
#wrapper {
width: 960px;
}
#fbLogo a{
height: 50px;
width: 50px;
display: block;
background-image: url(Images/facebookPixy.png);
background-repeat: no-repeat;
background-position: left top;
float: left;
margin-left: -15px;
}
#twitterLogo a{
height: 50px;
width: 50px;
display: block;
background-image: url(Images/twitterPixy.png);
background-repeat: no-repeat;
background-position: left top;
float: left;
margin-left: 5px;
}
#fbLogo a:hover {
background-position: left bottom;
}
#twitterLogo a:hover {
background-position: left bottom;
}
#header {
width: 960px;
padding: 0px;
background-repeat: no-repeat;
}
#leftColumn {
width: 770px;
float: left;
padding: 15px;
}
#rightColumn {
width: 140px;
float: left;
text-align: center;
padding-top: 4px;
padding-right: 8px;
padding-bottom: 4px;
padding-left: 8px;
border-left-width: 2px;
border-left-style: solid;
border-left-color: #666;
}
#footer {
width: 960px;
clear: both;
text-align: center;
}
a:link {
color: #FFF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFF;
}
a:hover {
text-decoration: none;
color: #999;
}
a:active {
text-decoration: none;
color: #FFF;
font-weight: normal;
text-align: left;
}
#rightColumn ul{
list-style: none;
}
#rightColumn li{

}
#subNav{
width: 100%;
background-image: url(Images/subNav.gif);
background-repeat: repeat-x;
display: inline-block;
height: 50px;
}
#footer ul{
clear: both;
margin-left: 300px;
}
li{
float: left;
margin-left: 20px;
margin-top: -15px;
list-style-type: none;
}

edbr
09-25-2010, 05:30 AM
no looks ok , try changing the font weight for body or colour from black . it hard to say without seeing what your seeing but the font should respond to those changes

Ogaac
09-25-2010, 06:12 AM
I can change font size, I can change font type, I can make it bolder and I can italicize it, but it still looks bold. I'll attach a screen shot of my WYSIWYG and my preview, tell me I'm crazy.

Before and After (http://kyleaho.com/beforeAfterBold.jpg)

I appreciate your help by the way :)

DWcourse
09-25-2010, 06:37 AM
It would b better to have a link to the actual page but, looking at your picture, I'm not sure what you're talking about. The two items circled in the before picture don't look bold to me.

edbr
09-25-2010, 06:39 AM
i think its just the contrast effect ,but im not certain, of white on black that makes it seem bolder, however do you have the info in a header tag h1 h2 etc, because if so you will get the browser default settings (bold) unless you give your own attributes to them in your style sheet

Ogaac
09-25-2010, 07:11 AM
i think its just the contrast effect ,but im not certain, of white on black that makes it seem bolder, however do you have the info in a header tag h1 h2 etc, because if so you will get the browser default settings (bold) unless you give your own attributes to them in your style sheet

Ahhhhh, because I didn't define my h tags they're bold. Thank you sir, you are a gentlemen and a scholar.