Html 如何使div响应

我正在使用wordpress建立我的网站，我有一个分区，其中包含一个网格显示的项目分区。除了网格中只有一个项目的情况外，其他一切正常。我希望这一个项目在该分区中居中，整个分区都能响应 这是我的密码：

echo '<section class="our-team" id="resources">';


                echo '<div class="container">';


                    echo '<div class="section-header">';


                        $zerif_events_title = get_theme_mod('zerif_events_title',__('Resources','zerif-lite'));//Title

                        if( !empty($zerif_events_title) ):
                            echo '<h2 class="dark-text">'.__($zerif_events_title,'zerif-lite').'</h2>';
                        endif;

                    echo '</div>';


                    if(is_active_sidebar( 'sidebar-doctors' )):
                        echo '<div class="row" data-scrollreveal="enter left after 0s over 0.1s">';
                            dynamic_sidebar( 'sidebar-doctors' );
                        echo '</div> ';
                    else:

                    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
                    $wp_query = new WP_Query( array('post_type' => 'resources', 'showposts' => '3', 'paged' => $paged) );
                    $count = $wp_query->post_count;

                    if( $wp_query->have_posts() ):
                     $i =1;
                        while ($wp_query->have_posts()) : $wp_query->the_post();

                         $url = get_post_meta($post->ID, '_location', true);
                         $permalink = get_permalink( $post->ID);

                         if($count == 1)
                         {
                         //
                         echo '<div  style="position:relative;left:33%">';
                         }
                         if($count == 2)
                         {

                         echo "<div class = 'col-md-6'>";
                         }
                         else
                         {
                         echo "<div class='col-md-4'>";
                         }
                            if($url)
                            {
                            echo "<a href = ".$url.">";
                            echo the_post_thumbnail();
                            echo "</a>";
                            echo "<h6>";
                            echo the_title();
                            echo "</h6>";
                            echo substr(get_the_excerpt(), 0,170);  



                            }
                            else{
                            echo "<a href = ".$permalink.">";
                            echo the_post_thumbnail();
                            echo "</a>";
                            echo "<h6>";
                            echo the_title();
                            echo "</h6>";
                            echo substr(get_the_excerpt(), 0,170);  

                            }
                            echo "</div>";  
                             $i++;
                                if($i>3)
                                {
                                    echo "<br>";
                                    $i=1;
                                }

                        endwhile;
                        if($count > 2){
                        $page = get_permalink(  get_page_template_by_title( 'Resources' ) );
                            echo '<a style ="position:relative;top:50px" text-align="right" href = "http://localhost/wordpress/?page_id=89"> View All -> </a>';
                            }
                    endif;


                    endif;




                echo '</div>';


            echo '</section>';

echo'；
回声'；
回声'；
$zerif_events_title=get_theme_mod（'zerif_events_title'，'zerif_events_title'，'zerif-lite'）//标题
如果（！empty（$zerif\u events\u title））：
回显“”。（$zerif_事件标题，'zerif-lite'）；
endif；
回声'；
如果（是活动的侧栏（“侧栏医生”）：
回声'；
动态侧栏（“侧栏医生”）；
回声'；
其他：
$paged=（获取查询变量（'paged'））？获取查询变量（'paged'）：1；
$wp_query=新的wp_查询（数组（'post_type'=>'resources'，'showposts'=>'3'，'paged'=>$paged））；
$count=$wp\u query->post\u count；
如果（$wp\u query->have\u posts（））：
$i=1；
而（$wp_query->have_posts（））：$wp_query->the_post（）；
$url=get_post_meta（$post->ID，'u location'，true）；
$permalink=get\u permalink（$post->ID）；
如果（$count==1）
{
//
回声'；
}
如果（$count==2）
{
回声“；
}
其他的
{
回声“；
}
如果（$url）
{
回声“；
回声“；
附和标题（）；
回声“；
echo substr（获取摘录（），0170）；
}
否则{
回声“；
回声“；
附和标题（）；
回声“；
echo substr（获取摘录（），0170）；
}
回声“；
$i++；
如果（$i>3）
{
回声“
”；
$i=1；
}
结束时；
如果（$count>2）{
$page=get_permalink（按标题（'Resources'）获取页面模板）；
回声'；
}
endif；
endif；
回声'；
回声'；

要使元素具有响应性，您需要查看CSS和HTML，而不是PHP

例如，如果您的

DIV

具有类

responsive

（

foo

），并且您希望它居中并具有相对于窗口的自适应宽度，则您的CSS可以是：

.responsive {
    width: 100%;
    display: block;
    text-align: center;
}

这意味着宽度始终正好是窗口宽度的100%，其中的文本将居中

---

您需要发布静态HTML以便我们提供帮助。这是PHP代码，您可以使用HTML代码中的引导类使div响应