Css 在可调div中居中显示图像

我有一个10%宽度的Div，在它的内容中有一个图像，我希望能够垂直/水平居中，并调整大小以适应它的容器

<div class="proyecto_holder">
<div class="tipo_proyecto_image">
    <img src="http://i57.tinypic.com/vgo9k5.png" border="0" />
</div>
<div class="proyecto_datos_holder">
    <div class="proyecto_titulo">This id the title of the project</div>
    <div class="proyecto_tipo">Type of Project</div>
</div>

当窗口调整大小时，它可以很好地调整大小，但不知道如何在容器中居中放置图像

<div class="proyecto_holder">
<div class="tipo_proyecto_image">
    <img src="http://i57.tinypic.com/vgo9k5.png" border="0" />
</div>
<div class="proyecto_datos_holder">
    <div class="proyecto_titulo">This id the title of the project</div>
    <div class="proyecto_tipo">Type of Project</div>
</div>

以下是演示：

---

提前感谢。

以下作品

HTML:

---

在这里，我在

img

的css声明（2*）中指定所有100%的父母身高35%+30%，并将其用于缩放。。。也许不是你想要的，但它是有效的。。。试试看：）

如果我明白你想做什么，试着在

img

上使用

transform

和

position:relative

，给你这样的信息：

.tipo_proyecto_image img {
  width: 80%;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

如图所示：

.proyecto\u支架{
宽度：100%；
浮动：左；
高度：75px；
溢出：隐藏；
背景色：#F2F2；
页边顶部：1px；
}
.tipo_proyecto_图像{
宽度：10%；
高度：75px；
浮动：左；
}
.tipo_proyecto_图像img{
宽度：80%；
位置：相对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}
.proyecto_datos_holder{
宽度：90%；
高度：75px；
浮动：左；
}
proyecto_titulo先生{
宽度：100%；
浮动：左；
字体系列：titilliumweb；
字号：18px；
字体大小：粗体；
线高：20px；
边缘顶部：10px；
颜色：#666666；
}
proyecto_tipo先生{
浮动：左；
字体系列：titilliumweb；
字体大小：16px；
线高：20px；
颜色：11BB00；
填充：10px 15px；
}

此id是项目的标题
项目类型

如果不是关于将图像居中于div中，那么您的问题可能与之重复？在我的示例中，这种解决方案不适用。为什么？你的目标是一个不寻常的浏览器吗？完美！！非常感谢。我想指出的是

div.Container {
    position:absolute;
    top:25%;left:25%;
    width:50%;height:50%;
    background:#FF0;
}
div.Container > img {
    display:block;
    position:absolute;
    left:10%; width:auto;
    top:35%; height:30%;
}

.tipo_proyecto_image img {
  width: 80%;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}