css float image doesn't seem to be working

I am currently working on two web sites. http://www.ca开发者_运维百科mpusreader.org/#About if you click on someones picture the text lines up right next to the image. But over on this new web site I'm working on http://www.computationalhealth.org/ , the float property is not working (click on the About tab and click on one of the tabs of the persons name).

I'm using google chrome dev tools and when I "inspect element" on the working site, it sees the css and shows me that its getting applied. But when I inspect element on the non working site dev tools does not show its getting applied. But, I can see my stylesheet, it is getting loaded. clearly the image class is "personPic" so Im not sure what I'm doing wrong.

Thanks, D

The contents of your CSS stylesheet:

.centered {
    display: block;
    margin-left: auto;
    margin-right: auto }
   }

.personPic{
    float: left;
    /*margin:0 1em 1em 0;*/
}

There's a formatting issue where the block of class 'centered' is closed twice.

Simply put the attribute float:left; on the image in your css.

Edit: just look at your css file:

.centered {
    display: block;
    margin-left: auto;
    margin-right: auto } <-- ugliness
   }

.personPic{
    float: left;
    /*margin:0 1em 1em 0;*/
}

Remove that bracket and you'll be good to go!