Css 将文本与图像左侧对齐，并与中间对齐

我正在为CSS中的一些东西而挣扎。如下图所示，图像需要居中，并且 文本位于其左侧（靠近图像，没有如小提琴所示的间隙）。请注意，图像的宽度可以更改（它是一个滑块）

我试着在图像中放置一个简单的

边距：auto

，然后用float right为文本（左侧）添加一个包装器-因此在我看来它应该浮动到图像上，但它不会（它在顶部创建一个间隙）并将文本向右浮动（当然，因为顶部有一个空白）

这在纯CSS中可能吗

我想做的是：

img{
    margin:auto;
    display:block;
}
.description{
    float:right;
}

---

绝对定位和表格单元格的组合将获得您想要的对齐方式

滑块{
宽度：1000px；
高度：500px；
边框：1px纯黑；
}
.ul{
列表样式：无；
保证金：0；
}
李先生{
文本对齐：居中；
垂直对齐：中间对齐；
宽度：100%；
}
.滑块.滑块内容{
显示：内联块；
位置：相对位置；
}
.ul li.说明{
左：-200px；/*减去描述的宽度*/
位置：绝对位置；
宽度：200px；
}
.ul li.图片容器{
显示：内联块；
}
.ul li img{
宽度：300px；
保证金：自动；
显示：块；
}
/*将内容对齐到中间*/
.ul-li.slideMiddle{
显示：表格单元格；
高度：500px；
垂直对齐：中间对齐；
}

这里应该有一些不错的文字靠近图像，而不是左

非常感谢您的精彩回答：Axel。在Alex answer的帮助下，我实际完成的工作是将文本浮动到容器的左侧宽度（200px宽度），将图像浮动到左侧，然后创建一个外包装，其宽度根据文本容器的宽度计算，加上图像宽度和自动边距：）

首先我想到的是什么？网格布局。（OT）只是出于好奇，这部分空间的正确用途是什么？它用于宽图像。因此，不宽的图像当然会留下一些空间：）这是一个非常好的例子，但可能我没有正确解释：）。在您的情况下，图像并不总是居中。图像需要始终居中。然后文本向左对齐。我已经更新了代码以说明图像居中的原因。这需要在绝对位置上付出更多的努力。我还列出了它工作的原因，希望能帮助你理解这些原则。