如何让我的侧边栏向右浮动?

时间:2016-04-19 15:37:05

标签: css wordpress twitter-bootstrap woocommerce

在Wordpress中,我有一个侧边栏,里面有一个WooCommerce小部件。我试图让它浮动到右边,它与position: fixed语句一起工作正常,但是因为我希望侧边栏与页面一起滚动我使用#secondary { position: fixed; float: right; padding: 15px; margin-right: 15px; z-index: 1000; top: 91px; height: 350px; width: 250px; text-align: center; background-color: #e6e6e6; overflow-y: auto; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } 语句,但是将它自动拉到左边。

我需要添加什么才能使侧边栏保持在右侧?

P.S。在查看HTML时,Javascript / PHP会注意到它的Wordpress / Woocommerce本机命令。

CSS:

<aside id="secondary" class="widget-area" role="complementary">
  <?php dynamic_sidebar( 'sidebar-1' ); ?>
</aside><!-- #secondary -->

HTML:

<?php do_action( 'woocommerce_before_mini_cart' ); ?>

<ul class="cart_list product_list_widget <?php echo $args['list_class']; ?>">

    <?php if ( ! WC()->cart->is_empty() ) : ?>

        <?php
            foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
                $_product     = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
                $product_id   = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );

                if ( $_product && $_product->exists() && $cart_item['quantity'] > 0 && apply_filters( 'woocommerce_widget_cart_item_visible', true, $cart_item, $cart_item_key ) ) {

                    $product_name  = apply_filters( 'woocommerce_cart_item_name', $_product->get_title(), $cart_item, $cart_item_key );
                    $thumbnail     = apply_filters( 'woocommerce_cart_item_thumbnail', $_product->get_image(), $cart_item, $cart_item_key );
                    $product_price = apply_filters( 'woocommerce_cart_item_price', WC()->cart->get_product_price( $_product ), $cart_item, $cart_item_key );
                    ?>
                    <li class="<?php echo esc_attr( apply_filters( 'woocommerce_mini_cart_item_class', 'mini_cart_item', $cart_item, $cart_item_key ) ); ?>">
                        <?php
                        echo apply_filters( 'woocommerce_cart_item_remove_link', sprintf(
                            '<a href="%s" class="remove" title="%s" data-product_id="%s" data-product_sku="%s">&times;</a>',
                            esc_url( WC()->cart->get_remove_url( $cart_item_key ) ),
                            __( 'Remove this item', 'woocommerce' ),
                            esc_attr( $product_id ),
                            esc_attr( $_product->get_sku() )
                        ), $cart_item_key );
                        ?>
                        <?php if ( ! $_product->is_visible() ) : ?>
                            <?php echo str_replace( array( 'http:', 'https:' ), '', $thumbnail ) . $product_name . '&nbsp;'; ?>
                        <?php else : ?>
                            <a href="<?php echo esc_url( $_product->get_permalink( $cart_item ) ); ?>">
                                <?php echo str_replace( array( 'http:', 'https:' ), '', $thumbnail ) . $product_name . '&nbsp;'; ?>
                            </a>
                        <?php endif; ?>
                        <?php echo WC()->cart->get_item_data( $cart_item ); ?>

                        <?php echo apply_filters( 'woocommerce_widget_cart_item_quantity', '<span class="quantity">' . sprintf( '%s &times; %s', $cart_item['quantity'], $product_price ) . '</span>', $cart_item, $cart_item_key ); ?>
                    </li>
                    <?php
                }
            }
        ?>

    <?php else : ?>

        <li class="empty"><?php _e( 'No products in the cart.', 'woocommerce' ); ?></li>

    <?php endif; ?>

</ul><!-- end product list -->

<?php if ( ! WC()->cart->is_empty() ) : ?>

    <p class="total"><strong><?php _e( 'Total', 'woocommerce' ); ?>:</strong> <?php echo WC()->cart->get_cart_subtotal(); ?></p>

    <?php do_action( 'woocommerce_widget_shopping_cart_before_buttons' ); ?>

    <p class="buttons">
        <!-- <a href="<?php echo esc_url( wc_get_cart_url() ); ?>" class="button wc-forward"><?php _e( 'View Cart', 'woocommerce' ); ?></a> -->
        <a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="btn btn-default" id="minicart-btn"><?php _e( 'Checkout', 'woocommerce' ); ?></a>
    </p>

<?php endif; ?>

<?php do_action( 'woocommerce_after_mini_cart' ); ?>

PHP /使用Javascript:

create or replace trigger tri_ISSUE
after insert or delete
on ISSUE
for each row
declare
    ct varchar2(20);
    cnt number(20);
begin
    if inserting
    then
        select bk_category into ct from BOOK_MASTER where accn_no=:new.accn_no;
        select available into cnt from BOOK_INFO where bk_category=ct;
        if(cnt=0)
        then
            dbms_output.put_line('Book is not available!');
            delete ISSUE where rollno=:new.rollno and accn_no=:new.accn_no;
        else
            select bk_category into ct from BOOK_MASTER where accn_no=:new.accn_no;
            update BOOK_INFO set available=available-1 where bk_category=ct;
        end if;
    end if;
    if deleting
    then
        select bk_category into ct from BOOK_MASTER where accn_no=:old.accn_no;
        update BOOK_INFO set available=available+1 where bk_category=ct;
    end if;
end;

3 个答案:

答案 0 :(得分:3)

如果您需要将侧边栏固定在页面右侧,则可以使用right属性以及固定位置:

right: 0px;

float无法使用fixed元素。

答案 1 :(得分:2)

固定位置和向右浮动不能一起使用。使用权限:0使固定元素保持在右侧。

答案 2 :(得分:0)

你应该首先在CSS中使用BFC。 你可以在下面获得BFC的信息 CSS 101: Block Formatting Contexts