Question

我在ie9的网站上遇到了一些麻烦。

这些框应该叠加到单独的项目中，如下面的截图，但在ie9底部的介绍文本区域为自己创建一个单独的框并且不在线...

应该如下所示： http://pagedev.co.uk/qube-issue/2.png 但它是这样的： http://pagedev.co.uk/qube-issue/1.png

我的HTML是：

<div class="projects-wrapper">
    <!--Open Brief Project-->
    <div class="projects-single">
        <a href="#"><img src="<?php the_field( 'thumbnail' ); ?>"></a>
        <div class="project-intro">
            <h3><?php the_field( 'project_title' ); ?><h3>
        </div>
    </div>
    <!--Close Brief Project-->
</div>

我的CSS是：

.projects-wrapper {
    width:100%;
    height:auto;
    margin-bottom:45px;
}

.projects-single {
    width:30%;
    height:auto;
    display:inline-block;
    background-color:#ffffff;
    margin-right:3%;
    margin-bottom:35px;
    vertical-align:top;
    float:left;
}

.projects-single img {
    width:100%;
    height:auto;
    margin-bottom:-5px;
}

.project-intro  {
    width:83%;
    height:auto;
    padding-left:8%;
    padding-right:8%;
    padding-top:6%;
    padding-bottom:6%;
}

.project-intro h3   {
    margin-bottom:0px;
    font-size:15px;
}

我正在努力弄清楚我需要改变什么才能让它在ie9中运行

如果您需要更多信息，请告诉我，并将其发布。

任何帮助都会很棒！

利

Answer 1

标记中存在错误，您的h3元素未关闭。

修正：

<h3><?php the_field( 'project_title' ); ?></h3>

ie9中的样式框 - CSS跨浏览器问题

1 个答案: