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>

    https://www.ads-software.com/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.