Wordpress Tweten Seconday边栏

Question

我想在wordpress中使用二十个主题的第二个侧边栏。我已将代码添加到functions.php和sidebar.php中，并显示侧栏。现在的问题是侧边栏在彼此之下，我希望它们彼此相邻，我该怎么做？

示例图片：

的functions.php

function add_my_sidebars(){
register_sidebar( array(
'name' => 'My sidebar',
'id' => 'my-sidebar',
'description' => 'Just a little description',
'before_widget' => '<div id="%1$s" class="widget-container %2$s">',
'after_widget' => '</div>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
} add_action('widgets_init', 'add_my_sidebars');

的sidebar.php

<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
<div id="secondary" class="widget-area" role="complementary">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
<?php dynamic_sidebar('my-sidebar'); ?>

</div><!-- #secondary -->

<?php endif; ?>

来自styles.css的补充工具栏的CSS

/* Sidebar */
.widget-area .widget {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    margin-bottom: 48px;
    margin-bottom: 3.428571429rem;
    word-wrap: break-word;
}
.widget-area .widget h3 {
    margin-bottom: 24px;
    margin-bottom: 1.714285714rem;
}
.widget-area .widget p,
.widget-area .widget li,
.widget-area .widget .textwidget {
    font-size: 13px;
    font-size: 0.928571429rem;
    line-height: 1.846153846;
}
.widget-area .widget p {
    margin-bottom: 24px;
    margin-bottom: 1.714285714rem;
}
.widget-area .textwidget ul {
    list-style: disc outside;
    margin: 0 0 24px;
    margin: 0 0 1.714285714rem;
}
.widget-area .textwidget li {
    margin-left: 36px;
    margin-left: 2.571428571rem;
}
.widget-area .widget a {
    color: #757575;
}
.widget-area .widget a:hover {
    color: #21759b;
}
.widget-area .widget a:visited {
    color: #9f9f9f;
}
.widget-area #s {
    width: 53.66666666666%; /* define a width to avoid dropping a wider submit button */
}

Answer 1

请尝试实施以下代码。

我在主类中添加了一些CSS，所以请添加这个CSS并检查布局是否与您想要的相同。

#access .menu-header, div.menu, #colophon, #branding, #main, #wrapper {
    margin: 0 auto;
    width: 965px !important;
}

#container {
    float: left;
    margin: 0;
    width: 60%;
}

#primary, #secondary {
    float: left;
    width: 190px;
}