2

我正在为我的妻子整理一个网页,但我遇到了一个我无法弄清楚的 CSS 问题。我有一个图像滑块(RoyalSlider),我希望它周围没有空白,但是滑块 div 之前的各种嵌套 div 添加了填充、边距和边框。类和类中的格式在页面上的多个位置使用,所以我不能简单地更改每个元素而不破坏页面的其他元素,我更愿意这样做而不弄乱 PHP。

下面是导致格式化的 div,用标签表示它们是如何嵌套的,每个 div 下面是 div 的 CSS 格式。

<div class="container">
    #section-content .container {
        padding-top: 20px;
    }

    #section-content .container {
        border-left: 10px solid white;
        border-right: 10px solid white;
    }

        <div class="eleven columns content sixteen no-thumbnail">
            .content {
                padding: 10px 0 0;
            }

            .column, .columns {
                float: left;
                display: inline;
                margin-left: 10px;
                margin-right: 10px;
            }

                <div class="the_content post type-post hentry excerpt clearfix">
                    .content .hentry {
                        padding-bottom: 15px;
                    }

                    <div class="royalSlider">
                        <div class="rsOverflow">
                            <div class="rsContainer">

我认为我可以用一堆 > (或其他东西......我的 CSS 技能很初级)来指定当 RoyalSlider div 存在时它将覆盖所有其他规则,但我无法弄清楚如何去做吧。

该页面的 URL 在这里:

http://rachelhappen.com/high-res-royal-test-post/

这是一张图片,展示了它现在的样子,我希望它是什么样的,以及 CSS 格式化方式的颜色编码图形。

网页图片
(来源:rachelhappen.com

任何帮助将不胜感激。

4

2 回答 2

1

您可以尝试类层次结构。我假设它royalSlider肯定会在那里,那么您可以尝试使用它的层次结构来指定适用于它的规则。

例子

你可以试试

.container .royalSlider{
/* rules here */
}

希望能帮助到你。

[编辑]:所以你的问题是填充在于父级,因此问题。

问题

解决方法 ==> 在容器上尝试相同的背景颜色 - 隐藏空白。不是一个完美的解决方案 - 只是一种解决方法。如果您希望图像居中,则不适合

于 2013-01-19T20:28:54.317 回答
0

给图片一个ID,把它的padding设置为0,0,0,0,如果图片下面还有一些空白,把display属性设置为block;

于 2013-01-19T19:53:07.827 回答