wordpress 中的帖子页面图像无法居中和响应答案

【问题标题】：post page image in wordpress cannot be centered and responsivewordpress 中的帖子页面图像无法居中和响应
【发布时间】：2016-10-21 02:31:09
【问题描述】：

我在 wordpress 中创建了一个简单的页面。我制作了 wordpress 的自定义主题。当我转到我的页面部分时，在我的 wordpress 页面的 wyswig 编辑器中，我放了一张图片。问题是我有图片发布并且我已经将它对齐在 wyswig 的中心但是当我在实际页面中看到它时，图片没有居中，当我去移动视图时我的图片无法响应，我还创建了一个 css 媒体查询，但还是不行。

这是我的代码：

<?php
/*
    Template Name: Custom Page
*/

get_header(); ?>
<div id="wrapper">
<section id="custom">
    <div class="container">

        <?php 
        if ( have_posts() ) {
            while ( have_posts() ) {
                the_post(); ?>
                <h2><?php the_title(); ?></h2>
                <hr width="30%" align="left">
                <p><?php the_content(); ?></p>
            <?php } // end while
        } // end if
        ?>

    </div>

</section>
<?php get_footer(); ?>
</div>

这是我的 css @media 查询，最大宽度为 460：

 #custom img {
        width: 100%;
        height: auto;
    }
    #custom h2 {
    margin-top: 32%;
    }

【问题讨论】：

标签： css wordpress responsive-design wordpress-theming wysiwyg

【解决方案1】：

您正在寻找的是max-width 属性。

顺便说一下，不一定在媒体查询中，比如

#custom img {
    // So we can center it
    display:inline-block;
    // Limit the size : 
    max-width: 100%;
}

然后在你的媒体查询中，你可以像max-width:50%;一样调整max-width

【讨论】：