左边是CSS导航，右边是图片

我不确定该如何描述这个问题，但这里什么都没有

我在网站的左侧有一个导航

.headerWrapper {
    border: 1px solid #FFFFFF;
    float: left;
    height: 745px;
    margin-left: 40px;
    width: 250px;
}

在它旁边是一个类，里面有一个图像

.mainContent {
    float: left;
    padding-left: 5px;
    width: 1000px;
}

图像的宽度为1000px，在图像宽度属性中设置

---

此布局在我的屏幕上看起来不错，但在其他屏幕上，图像位于HeaderRapper的下方……为什么要这样做？我如何修复它？

图像位于下方，因为没有足够的宽度区域来容纳导航和图像。对于次要的修复，请尝试使用

.mainContent

、

.headerrapper

和

body

的边距、填充（大约0）来将它们并排放置

但是，为了更好地适应所有分辨率，您应该使用

这是一把小提琴。调整结果窗口的大小并查看动画

基本上，使用媒体查询，您可以根据窗口大小定义样式，例如，在您的情况下，您可以减小图像大小以适应低分辨率屏幕等

希望有帮助。：）