custom widget alignment twenty eleven

  • site: https://www.workingwriterscoach.com

    I need help creating the css to align the last three widgets in the code below in one horizontal row:

    <div id="primary">
<?php if ( is_active_sidebar( 'main-top-widget-left' ) ) : ?>
<div><?php dynamic_sidebar( 'main-top-widget-left' ); ?></div>
<?php endif; ?>
<?php if ( is_active_sidebar( 'main-top-widget-right' ) ) : ?>
<div><?php dynamic_sidebar( 'main-top-widget-right' ); ?></div>
<?php endif; ?><?php if ( is_active_sidebar( 'header-widget' ) ) : ?>
<div><?php dynamic_sidebar( 'header-widget' ); ?>
</div><?php endif; ?>

<div id="custom_inline"><?php if ( is_active_sidebar( 'header-widget2' ) ) : ?>
<div><?php dynamic_sidebar( 'header-widget2' ); ?></div>
<?php endif; ?>
<?php if ( is_active_sidebar( 'header-widget3' ) ) : ?>
<div><?php dynamic_sidebar( 'header-widget3' ); ?></div>
<?php endif; ?>
<?php if ( is_active_sidebar( 'header-widget4' ) ) : ?>
<div><?php dynamic_sidebar( 'header-widget4' ); ?></div>
<?php endif; ?></div>
Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter rafael nadal

    (@rafael-nadal)

    Here is the css for what I have now:

    #custom_inline {
  overflow: auto;
}

/*widget1-4
----------------------------------------------*/
#custom_inline .text-577704918 {
  float: left;
  width: 25%;
  padding: 2%;
  margin: 0 1%;
 }

#custom_inline .text-577704910 {
  float: left;
  width: 25%;
  padding: 2%;
  margin: 0 1%;
 }

#custom_inline .text-577704921 {
  float: left;
  width: 25%;
  padding: 2%;
  margin: 0 1%;
 }
    Thread Starter rafael nadal

    (@rafael-nadal)

    I can get the content of each widget to display in a horizontal line, but not the three entire widgets.

    please post a link to a page with those #custom_inline section widgets activated.

    simple divs without CSS classes like here <div><?php dynamic_sidebar( 'header-widget2' ); ?></div> might be more difficult to format than those with specific CSS classes…

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘custom widget alignment twenty eleven’ is closed to new replies.