图像位于文本下方

Question

我不明白如何解决这个问题。

每当我在手机或平板电脑上查看时，图像都会出现在文本下方，这会使文字变得不可读。 它在笔记本电脑/电脑上看起来很棒，但在手机或平板电脑上却很糟糕。 这是我的网站。 http://www.phincer.com/其标题为“我们知道网站对贵公司的重要性”的部分，这是代码。

    .style_two {
    position: relative;
}
    .style_two .promo-image {
    position: relative;
    padding: 0px;
    border-top: 1px solid #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
    text-align: right;
    background: #ffffff;
    overflow: hidden
}
    .style_two .promo-image img {
    width: 50%;
    float: right;
}
    .style_two .caption {
    width: 49%;
    float: left;
    height: 100%;
    background: #ffffff;
    text-align: left;
    position: relative;
    /*margin-left: 10px;*/
}

Answer 1

这是因为您没有正确设置位置。 应该是“相对”

更改以下代码，

<div class="caption wow fadeIn" data-wow-delay="1s">

对此，

<div class="caption wow fadeIn" data-wow-delay="1s" style="position:relative">

否则你可以简单地改变你的 CSS，如下所示。

.style_two .caption {
    width: 49%;
    float: left;
    height: 100%;
    background: #ffffff;
    text-align: left;
    position: relative !important;
}