水平设置Wordpress小部件

Question

I’m currently working on putting together a child theme off of the new Twenty Twelve Wordpress website. The site has a fluid/liquid structure for its responsiveness (using percentages as opposed to fixed widths in pixels - which would relate to how I may have to style my widgets).

At the top of my template I would like to include a widgetized area where the user/admin can drag and drop items from the available widgets in the list provided.

Ideally, as the design and layout of the site for this section is on a horizontal plane, three widgets would visually look nice in terms of space.

However, if the user would like to add more, I take it that I would need to work with PHP or JavaScript to calculate if there is a certain amount of divs/classes/ids within a section tag for example, change the CSS widths from 33.33% (3 widgets) to 25% (4 widgets) or 50% is there is two etc. ?

How would I be able to accommodate an equally spaced width for each widget and place them next to each other?

Answer 1

A little messy, but here's a start:

<?php
$widgets = wp_get_sidebars_widgets();
$percentage = !empty($widgets['header-widget-area']) ? floor(100/count($widgets['header-widget-area'])) : 100;
?>
<style type="text/css">
hgroup .widget{
    width:<?php echo $percentage; ?>% !important;
    float:left;
}
</style>