css - 在wordpress中更改小部件宽度的大小

Question

我想在我的主页上有两个彼此相邻的小部件。但是我希望第一个小部件为 650 像素，而另一个为 290 像素。我无法做到这一点。有人可以帮助我吗？

我在主题 functions.php 文件中为小部件注册的代码:

   register_sidebar(array(
    'name' => 'Slider 1',
    'before_widget' => '<div id="%1$s" class="widget-area1 %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3>',
    'after_title' => '</h3>',
));

register_sidebar(array(
    'name' => 'Side Column',
    'before_widget' => '<div id="%1$s" class="widget-area2 %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3>',
    'after_title' => '</h3>',
));

然后我在我的主页模板文件中放置:

<?php 
/**
 * Template Name: Home Page
 */
get_header();
include('_functions/get-options.php');
?>

<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') ||!dynamic_sidebar('Homepage')); ?>
**<div class="widget-area1">
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Slider 1')); ?>
</div>
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Side Column')); ?>**

<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Homepage 1')); ?>
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Homepage 2')); ?>

<div class="clear"></div>

<?php get_footer(); ?>

还有我放在样式表中的 css 样式:

div.widget-area1 {
clear: both;
margin: 0 auto;
width: 650px;
}

div.widget-area3 {
clear: both;
margin: 0 auto;
width: 290px;
}

你能告诉我我做错了什么吗？我使用的主题是比较，如果这可能有帮助的话。

Answer 1

你问题中的样式就像它们应该工作一样，但这是我在你的样式表中看到的

#widget-area1 {
  clear: both;
  margin: 0 auto;
  width: 650px;
}

#widget-area2 {
  clear: both;
  margin: 0 auto;
  width: 290px;
}

这些规则引用的是 ID，而不是您在问题中定义的类。

此外，如果您希望它们并排放置，您可能需要删除 clear:both。