【问题标题】:div row and columns background colordiv 行和列的背景颜色
【发布时间】:2014-12-10 03:34:37
【问题描述】:

我的行背景有问题,我无法将左侧的内容最大化,所以我有这个不同颜色的小空间。

截图 - http://i.imgur.com/gOtYJhQ.png

我需要用与内容相同的颜色更改剩余的小空间。

CSS

.row .twelve {
    background: #f2eee3;
}

HTML

<div class="row" style="box-shadow: 0 3px 0px 0px #888888,  7px 0 7px -4px #888888, -7px 0 7px -4px #888888;">
<?php get_header(); ?>
            <div id="content">              
                <div class="twelve columns clearfix">
                    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

                    <article id="post-<?php the_ID(); ?>" <?php post_class('clearfix'); ?> role="article" itemscope itemtype="http://schema.org/BlogPosting">

                        <section class="nine columns clearfix" itemprop="articleBody" style="border-right: 1px solid #a79c7f; min-height:450px; background:transparent;">
                        <!-- article header -->
                        <header>
                        <!--h1 class="page-title" itemprop="headline"><?php the_title(); ?></h1-->
                        </header> 
                                    <!-- end article header -->
                            <?php the_content(); ?>

                        </section> <!-- end article section -->
                        <?php get_sidebar(); // sidebar 1 ?>
                        <footer>

                            <?php the_tags('<p class="tags"><span class="tags-title">Tags:</span> ', ', ', '</p>'); ?>
                        </footer> <!-- end article footer -->
                    </article> <!-- end article -->             
                    <?php endwhile; ?>      
                    <?php else : ?>
                    <?php endif; ?>
                </div>    
                </div> <!-- end #main -->
<?php get_footer(); ?>
        </div> <!-- end #content-->

我将 html 更改为此并应用了一些内联样式,但我现在的问题是内容的边框与页眉和页脚剪切不对齐。

http://i.imgur.com/4xfaQJr.png

网络链接-

http://fabioide.com/frederiksminde/vaerelser/

【问题讨论】:

  • 截图url重定向到一个空页面
  • 对不起。我现在替换了链接。
  • 从这里我们无法检查 css,但我认为主文章上有填充,请检查它是否存在
  • 移除内边距会使内容的边框和页脚错位。
  • 那么与其从文章中删除它,不如将其移到子 div 中,它会做到这一点

标签: html css backbone.js row


【解决方案1】:

增加div的宽度并减少margin-left值。通过这样做,空白将被 div 本身替换。

【讨论】:

  • 这有点复杂,因为我使用的是基础框架。我不能只增加宽度
  • 最外层div的覆盖范围是多少?意思是,内容 div 和外部 div 共享相同的区域,除了间隙?
【解决方案2】:

CSS

.row .twelve {
background: #f2eee3;
padding: 0px; /* added this */
    }

.row .nine {
background: #e8e6d2; /* added this */
}

调整滑块图像的大小以使其与下面的分隔线对齐

【讨论】:

    猜你喜欢
    • 2018-05-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-09-05
    • 2012-02-28
    • 1970-01-01
    • 2013-08-20
    • 1970-01-01
    相关资源
    最近更新 更多