http://jsfiddle.net/ETkkR/

<div id="Blog1">
    <div class="post">
    <img src="http://dummyimage.com/180x120/000/fff" alt="Image 1" title="This is my first image"/>
        <div class="post-info">
            <span>post title post title post title</span>
        </div>
    </div>
    <div class="post">
    <img src="http://dummyimage.com/175x104/f0f/fff" alt="Image 2" title="The second one is pretty"/>
                <div class="post-info">
            <span>post title post title post title</span>
        </div>
    </div>        
</div>​

El div.post-info en algunos casos (imágenes de ancho mayor que el contenido de div.post-info) se ajusta al div.post parent, sin embargo, a veces el ancho del div.post-info es mayor y afecta al div principal. Publicar por redimensionarlo. ¿Cómo puedo hacer que el div.post-info se ajuste al ancho del div.parent y no cambie su tamaño si es mayor?

mi css

#Blog1{
    padding:10px;
}
#Blog1 .post{
    border:1px solid #000000;
    margin:3px;
    text-align:center;
    position: relative;
    display: inline-block;
    *display: inline;
    zoom: 1
}
.post img{
    height:100px;
}
.post .post-info{
    text-align:left;
}
.post .post-info span{
    word-wrap:break-word;
}​

Editar

USTED PUEDE CAMBIAR LOS ELEMENTOS MIENTRAS EL CONTENIDO PERMANECE AL MISMO PARA CREAR UNA SOLUCIÓN la gente sigue dando soluciones que no son adecuadas para lo que estoy preguntando ... lo que necesito es que el div infantil .post-info no tenga un ancho mayor que el del .post parent div