html - 向已有填充的容器内的标题添加填充

Question

我目前正在尝试向该容器的标题添加填充，但出于某种原因，它不允许我向左侧或右侧添加任何填充。下图显示了它现在的样子。

这是我的代码:

<?php
$feed = 'http://miletich2.blogspot.co.uk/feed/';
$rss = fetch_feed($feed);
?>
<div class="container">
<div class="clear">
<div class="right">
<div class="rss-container">
<div class="rss-heading">
<?php
$title = "Clashing With Life";
$description = 'This is a blog written by an autistic person for other autistic people about <br>some of the biggest issues in life, whether deplorable or marvelous.';
echo '<h3 class="text-center title">' . $title . '</h3>'; 
echo '<p class="text-center">' . $description . '</p>'; 
?>
</div>
<?php
if ( !is_wp_error($rss) ) :
    $maxitems  = $rss->get_item_quantity(3);
    $rss_items = $rss->get_items(0, $maxitems);
    if ($rss_items):
        foreach ($rss_items as $item) :
            $item_title     = esc_attr( $item->get_title() );
            $item_permalink = esc_url( $item->get_permalink() );
            $item_post_date = $item->get_date( get_option('date_format') );
            $item_excerpt   = wp_trim_words( wp_strip_all_tags( $item->get_description(), true ), 50 );
            echo sprintf('<div class="spacing"><a href="%s" target="_blank">%s</a><div class="pull-right">%s</div><p>%s</p><hr></div>', $item_permalink, $item_title, $item_post_date, $item_excerpt);
        endforeach;
    endif;
endif;
?>

这是我的CSS:

.right{
    float:right;
}

.rss-container{
        max-width: 400px;
    width: 100%;
    margin: 25px auto;
    background: #f4f4f4;
        padding: 0 20px 0 20px;
}

.rss-heading {
    background: #7ED321;
    color: #000;
    padding: 15px 30px;
    border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    font-weight: bold;
}

.rss-heading p{
    font-size:9px;

}


hr{
    border-top: 1px solid #DCDCDC !important;
}

.article-head{
    line-height: 2em;
    font-family: Roboto Condensed;
    font-weight: bold;
}

.clear{
    clear:both;
}

.spacing a {
    line-height: 2em;
    font-size: 15px;
}

.pull-right{
    line-height: 2em;
     font-size: 15px;
}

h3.title {
    font-family: Roboto Condensed !important;
    font-weight: bold;
}

在 .rss-container 中我添加了这个:padding: 0 20px 0 20px;和 .rss-heading padding: 15px 30px; 我试图将 30px 更改为另一个值，因为我只想让它左右改变，它继续改变顶部和底部。任何帮助将不胜感激!

Answer 1

要仅更改左右填充值，您不能使用“填充”快捷方式。明确指定:

padding-right: 30px;
padding-left: 30px;

这将使顶部和底部保持不变。