Resize all images so that they are the same height.  Make sure you do not mess up the proportions. 

Create a new div container around each heading, paragraph and div/image (three new div elements in total).  Each staff member is now contained in their own div element. Give the three new div elements a class called staffcontainer.  In the style sheet set the height for the staff container to 300px.

Move each image (div and img) element above the heading (h2) within the new container div:

  1. for each person cut the original div with the img in it
  2. paste it above the h2 for that person (so the order is now div/image, h2, p all still inside a staffcontainer div)

Give the image div elements the same class imagediv.  Give them a height and width which allows the largest image to fit inside.  You cna get the dimensions of the image by right clicking on it in your browser.  Float them right and if it does not work you have probably forgotten to set the height of the staffcontainer div. 

Now adjust the left margins for imagediv elements to make some space between them and the text.

Now use a child selector to style the img elements with a border.  They are all inside a container div elements which has a class.  You can use that and the img type selector together  (a child selector) so that only img elements which are descendants of container div elements are affected by these new styles.  Otherwise the image on the front page will have two borders - one from it's div and one of it's own from these new styles.

Finally adjust the width of the three outer, container div elements using their class selector.  Then centre them by setting margin-left and margin-right to auto.