Support » Plugin: Sharebar » Hiding Vertical Bar When Using sharebar_button?

  • I wanted to customize my sharebar a bit so I’m using sharebar_button instead of using sharebar and sharebar_horizontal

    How do I hide the vertical bar and display the horizontal bar when the width of the browser is less than 1000px?

    heres the code for my vertical bar:

    <div class="vertical-sharebar">
    	<div class="facebook"><?php sharebar_button('facebook','big'); ?></div>
    	<div class="twitter"><?php sharebar_button('twitter','big'); ?></div>
    	<div class="stumbleupon"><?php sharebar_button('stumbleupon','big'); ?></div>
    	<div class="email"><?php sharebar_button('email','big'); ?></div>
    </div>

    and the horizontal bar:

    <div class="horizontal-sharebar">
    			<div class="facebook"><?php sharebar_button('facebook','small'); ?></div>
    			<div class="twitter"><?php sharebar_button('twitter','small'); ?></div>
    			<div class="stumbleupon"><?php sharebar_button('stumbleupon','small'); ?></div>
    			<div class="email"><?php sharebar_button('email','small'); ?></div>
    		</div>

    http://wordpress.org/extend/plugins/sharebar/

Viewing 1 replies (of 1 total)
  • My version of horizontal code:

    <div class="horizontal-sharebar">
    			<div class="inline"><?php sharebar_button('facebook','big'); ?></div>
    			<div class="inline"><?php sharebar_button('twitter','big'); ?></div>
    			<div class="inline"><?php sharebar_button('stumbleupon','big'); ?></div>
    		</div>

    and CSS

    div.horizontal-sharebar {
    	float:right;
    	width:200px;
    	    overflow: hidden;
        white-space: nowrap;
    }
    div.inline {
        display: inline-block;
    }

Viewing 1 replies (of 1 total)
  • The topic ‘Hiding Vertical Bar When Using sharebar_button?’ is closed to new replies.