Skip to content

Instantly share code, notes, and snippets.

@AramZS

AramZS/sidebar-for-anyone

Last active December 20, 2015 11:19
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save AramZS/6122246 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save AramZS/6122246 to your computer and use it in GitHub Desktop.
Download ZIP
Quick and dirty universal sidebar HTML
Raw
sidebar-for-anyone
<div class="quick-sidebar" style="width:100px; height:auto; float:right; margin-right: 10px; margin-left: 10px; margin-top: 10px; margin-bottom: 10px; border: 1px solid black; padding: 6px;">
Your content goes in here. It can be images, words, video, or anything.
All the numbers to control how this are contained inside the style attribute above.
Width and height are for size control. Leave out height and the box will get as long as you need it to be to contain text.
You must set a width.
Float controls if it sits on the right or left side of the page.
The margins control the amount of empty space that sits on the side of the sidebar designated after the hyphan.
Border controls the border size, line type, and color.
Basic color names can be found at http://www.w3schools.com/html/html_colornames.asp
And here are the border styles - http://www.w3schools.com/css/css_border.asp
Padding defines the space between the inside edge of the sidebar and the contents of that sidebar.
Padding can be broken down into -left, -right, -top, and -bottom, but at this configuration is set to apply to all sides of the sidebar.
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment