Skip to content

Instantly share code, notes, and snippets.

@oksushi

oksushi/dabblet.css

Forked from anonymous/dabblet.css
Created March 25, 2013 06:49
Show Gist options
  • Save oksushi/5235328 to your computer and use it in GitHub Desktop.
Save oksushi/5235328 to your computer and use it in GitHub Desktop.
Download ZIP
Any chance to get the result displayed as in
Raw
dabblet.css
/**
* Any chance to get the result displayed as in
* http://dabblet.com/gist/5235311 without using
* javascript or having to move the subnav out of .nav?
*/
* { margin: 0; padding: 0; }
li { list-style: none; }
.nav > li { width: 20%; float: left; color: white; min-height: 6ex; }
.nav > li > ul { /* this is supposed to be 100% wide */position: absolute; left: 0; right: 0; top: 6ex }
Raw
dabblet.html
<ul class="nav">
<li style="background: #c00;">1</li>
<li style="background: #cc0;">
2
<ul class="subnav" style="background: #ee8; color: black;">
<li>Subnav:</li>
<li>This should</li>
<li>be 100% wide</li>
<li>and below the</li>
<li>main navigation bar</li>
</ul>
</li>
<li style="background: #0c0;">3</li>
<li style="background: #4cc;">4</li>
<li style="background: #44f;">5</li>
</ul>
<br style="clear: both;" />
Content: This should be pushed down by the subnav.
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split","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