Css 浮动和@media query不'；他似乎不在一起工作

以下是我的CSS：

div.imgbeequick 
{
background: url('../img/beequick400-135.png') no-repeat center top; 
display: inline-block;
vertical-align: center;
width:45%;
margin:auto;
height:135px;
}


aside
{
padding:5px;
vertical-align: center;
color:black;
float:right;
}

@media screen and (min-width: 1076px)
{
    div.imgbeequick
    {
    width:45%;
    }

    aside
    {
    clear: both;
    float: right;
    vertical-align: center;
    }
}

@media screen and (max-width: 1075px)
{
    div.imgbeequick
    {
    width:100%;
    }

    aside
    {
    float: none;
    width:80%;
    margin:auto;
    text-align:center;
    }
}

问题是，当我将窗口扩展到1076 px以上时，“搁置”按钮不会正确浮动（但如果刷新期间的页面大小超过此大小，它会浮动）

以下是指向整个页面的链接：

---

“搁置”按钮包含输入，div.imgbeequick是蜜蜂的图像

可能是，此更改可帮助您获得所需：

@media screen and (min-width: 1076px) {
    div.imgbeequick {
        width:45%;
        float: left; /* ADDED */
    }

    aside {
        /*clear: both; REMOVED */
        float: right;
        vertical-align: center;
    }
}

@media screen and (max-width: 1075px) {
    div.imgbeequick {
        width:100%;
        float: none; /* ADDED */
    }

    aside {
        float: none;
        width:80%;
        margin:auto;
        text-align:center;
    }
}

---

替换<代码>浮动：右侧显示：内联表格

@media screen and (min-width: 1076px)
{
    div.imgbeequick
    {
    width:45%;
    }

    aside
    {
    clear: both;
    display: inline-table;
    }
}

哦，还有一件事……没有垂直对齐：居中您所指的值很可能是“中间值”，但在您的情况下它不是必需的

内联表值在HTML中没有直接映射。信息技术
行为类似于HTML元素，但作为内联框，而不是
一个块水平的盒子。表框内是块级上下文。（）

您正在测试哪个浏览器（和版本）？