如何在Html中使用内联块显示表格和图像？

如何在同一级别上显示图像和表格？这真的让我很沮丧，因为我无法让“内联块”工作(

嘿

模型
汽车
现代住宅
度假胜地
体育及户外活动
书
废弃房屋
夏装
化妆
站点信息
身体{
背景：#181818；
保证金：0；
填充：0；
}
/*将主体显示设置为内联表格*/
#玩{
背景：黑色；
颜色：白色；
保证金：0；
填充：0；
高度：35px；
}
表，td{
颜色：白色；
边框：1px纯白；
边界塌陷：塌陷；
宽度：160px；
填充：10px；
字体系列：；
}
桌子{
}
#场地{
高度：350px；
}
img{
浮动：对；
}

我改变了图片，但大小差不多 在css代码中：

table{
float:left;
}

我们应该做到这一点

阅读更多内容：

检查此小提琴：

---

首先，用一个div包装你的图像标签。给这个div命名任何你想要的名字。让我们把它命名为：“image test”

您会注意到您的图像比包含的div大，所以让我们在所有图像上设置一个最大宽度，以避免将来出现问题

img {
  max-width:100%;
}

---

如果希望图片位于表格旁边，而不是浮动在屏幕右侧，请将img的浮动更改为left

img{float:left；}

/*******Added style******/
img
{
    /*165px is your Menu width with borders*/
    max-width: calc(100% - 165px);
    /*For cross browser*/
    -webkit-max-width: calc(100% - 165px);
    -moz-max-width: calc(100% - 165px);
    -o-max-width: calc(100% - 165px);
    -ms-max-width: calc(100% - 165px);
    display: inline-block;
    vertical-align: top;/* Can be middle, bottom */
}
#menu{
    display: inline-block;
}

<div class="image-test">
  <img src="(URL for IMAGE)">
</div>

#menu{
  float:left;
  width:50%;

}
.image-test{
  float:left;
  width:50%;
}

img {
  max-width:100%;
}