2015-11-22 7 views
3

Я использую customizer на Wordpress для установки различных макетов и изменения положения боковой панели. Скрипт работает так: он устанавливает поплавок на боковой панели, влево или вправо. Но когда боковая панель устанавливается на левой, она опускается ниже содержания (потому что содержание на float:left;)Установить положение содержимого относительно боковой панели

Структура как этот

<div class="home"> 
    <div class="content" style="float:left;"> 
    <?php get_template_part('loop'); ?> 
    </div> 

    <div class="sidebar"> 
    <?php get_sidebar(); ?> 
    </div> 
</div> 

В моем заголовке

<?php 
    $sidebar_position = get_theme_mod('sidebar_position'); 
    ?> 
    <style> 
     #sidebar-primary {float: <?php echo $sidebar_position; ?>;} 
    </style> 

Часть сценарий для боковой панели:

$wp_customize->add_setting('sidebar_position', array()); 
$wp_customize->add_control('sidebar_position', array(
    'label'  => __('Sidebar position', 'Blog'), 
    'section' => 'layout', 
    'settings' => 'sidebar_position', 
    'type'  => 'radio', 
    'choices' => array(
    'left' => 'left', 
    'right' => 'right', 
), 
)); 

Ho w могу ли я автоматически изменить положение контента относительно боковой панели? Простой CSS или мне нужно добавить что-то в скрипт, чтобы установить противоположную позицию float в контент?

+0

Я смог исправить это, добавив отображение: встроенный блок как для содержимого, так и для боковой панели. Я все равно хотел бы знать, есть ли лучшее решение для этого. – dbsso

+0

Скорее всего, вы должны установить 'overflow: hidden' в контейнере боковой панели, но я только беру на себя дикую догадку, так как это зависит от вашей темы WP. Если вам нужен правильный ответ, вам нужно воспроизвести проблему в тестовой среде, например [jsfiddle] (http://jsfiddle.net/). –

ответ

0

Если вы хотите установить боковую позицию слева на свой контент с помощью css float left, боковая панель должна быть размещена перед содержимым. Таким образом, вы можете проверить настройки следующим образом:

<div class="home"> 
    <?php if ($sidebar_position == 'left') { ?> 
     <div class="sidebar"> 
      <?php get_sidebar(); ?> 
     </div> 
    <?php } ?> 

    <div class="content" style="float:left;"> 
     <?php get_template_part('loop'); ?> 
    </div> 

    <?php if ($sidebar_position == 'right') { ?> 
     <div class="sidebar"> 
      <?php get_sidebar(); ?> 
     </div> 
    <?php } ?> 
</div> 
Смежные вопросы