Skip to content

Instantly share code, notes, and snippets.

@sudsy
Created April 17, 2012 05:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sudsy/2403801 to your computer and use it in GitHub Desktop.
Save sudsy/2403801 to your computer and use it in GitHub Desktop.
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
.container {
height: 20px;
background-color: red;
overflow: hidden;
}
.left {
float: left;
background-color: orange;
width: 100px;
}
.center {
height: 20px;
overflow: hidden;
float: right;
background-color: purple;
}
.right {
width: 200px;
float: right;
background-color: blue;
}
.more {
width: 50px;
float: right;
background-color: grey;
}
.subcontainer {
background-color: green;
}
.item {
float: right;
width:100px;
background-color: green;
}
div ul {
list-style-type: none;
}
div ul li {
float: right;
}
<!-- content to be placed inside <body>…</body> -->
<div class="container">
<span class="left">Test</span>
<span class="right">right</span>
<span class="more">more</span>
<span class="item">Item 1</span>
<span class="item">Item 2</span>
<span class="item">Item 3</span>
<span class="item">Item 4</span>
<span class="item">Item 5</span>
<span class="item">Item 6</span>
<span class="item">Item 1</span>
<span class="item">Item 2</span>
<span class="item">Item 3</span>
<span class="item">Item 4</span>
<span class="item">Item 5</span>
<span class="item">Item 6</span>
<span class="item">Item 1</span>
<span class="item">Item 2</span>
<span class="item">Item 3</span>
<span class="item">Item 4</span>
<span class="item">Item 5</span>
<span class="item">Item 6</span>
</div>
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment