Image Borders Defined using CSS won't Display in FF or IE

[calfstad]

Title says it all. I am using dreamweaver to create a very simple page and have linked an external style sheet. I have created a tag for all images (not link images) to have a 1px white border. The border displays fine in dreamweaver but won't display in FF or IE. I will paste my code below and a link to my file.

Also, how do you create a border are just 1 image instead of ALL images? I reckon you would just use an in-line style? But again, I can't test if I did it correctly because of the aforementioned display issue.

Any thoughts are greatly appreciated. (I am a beginner, in school for graphic design and just trying to get a basic portfolio website up!)

This is the web page which should have the image with the border around it:
http://home.comcast.net/~calfstad82/typoberlin.html

My style sheet is this:

@charset "utf-8";
body {
background-color: #333333;
}
.font1{
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
img {
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-color: #ffffff;
border-right-color: #ffffff;
border-bottom-color: #ffffff;
border-left-color: #ffffff;
}a:link {
color: #FFFFFF;
}

[calfstad]

Title says it all. I am using dreamweaver to create a very simple page and have linked an external style sheet. I have created a tag for all images (not link images) to have a 1px white border. The border displays fine in dreamweaver but won't display in FF or IE. I will paste my code below and a link to my file.

Also, how do you create a border are just 1 image instead of ALL images? I reckon you would just use an in-line style? But again, I can't test if I did it correctly because of the aforementioned display issue.

Any thoughts are greatly appreciated. (I am a beginner, in school for graphic design and just trying to get a basic portfolio website up!)

This is the web page which should have the image with the border around it:
http://home.comcast.net/~calfstad82/typoberlin.html

My style sheet is this:

@charset "utf-8";
body {
background-color: #333333;
}
.font1{
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
img {
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-color: #ffffff;
border-right-color: #ffffff;
border-bottom-color: #ffffff;
border-left-color: #ffffff;
}a:link {
color: #FFFFFF;
}

Yay I found it myself!!

For those who may wish to know:

.img1 IMG{
border-bottom: 1px solid #ffffff;
border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;



So I had the wrong CSS language in addition I didn't use the correct DIV tag. In fact, I don't think I was using one at all.

<div class="img1" align="center"> is the correct tag to use.