div中的图像与其他图像的高度不同

Question

I'm struggling to set an img's height inside a div to be taler than the other img's on the rest of my site, can anyone advise, thanks

Here is the HTML

<div class="project">

    <img src="../../../Images/Nu Space/Nu Space LH.jpg" alt="Nu Space LH" class="image" height="auto" width="580">

    <img src="../../../Images/Nu Space/Nu Space BC.jpg" alt="Nu Space BC" class="image" height="auto" width="580">

    <div class="clear"></div>
</div>

Here is the CSS

img {
    float: right;
    margin-top: 0px;
    height: auto;
}

img li {
    margin-top: 75px;
    height: 100%;
    width: 100%;
}

.project {
    width: 700px;
    min-height: 100%;
    margin-left: 10px;
    margin-right: 0px;
    margin-bottom: 30px;
    left: auto;
    background-color: #FFF;
}

Any help would be appreciated

Answer 1

div > img {
    width: (desired width in %);
    height: (desired height in %):
}

Edit: Sorry I was not exact in my explanations, but this will change only the images inside a div, which was what the author wanted. I believe he has other images on the webpage, which should have different size.

Answer 2

try this one,

.project 
{
    width: 700px;
    min-height: 100%;
    margin-left: 10px;
    margin-right: 0px;
    margin-bottom: 30px;
    left: auto;
    background-color: #FFF;
}
.project .image1 
{
    width:200px;
    height: 200px;
}

http://jsfiddle.net/tT8JH/2/