~firefox
12 itemsDownload ./*


..
stylish
hidecaption.ahk
homepage-centered-iframe.html
homepage-centered-slideshow.html
homepage-masonry.html
homepage-panels.html
homepage-sidebar.html
homepage-slide3d.html
mailorder.html
remoteButter.html
slideshow.html
template.html


firefoxtemplate.html
8 months agoDownloadRawClose


<!DOCTYPE html>
<!--

    Author:        Twily                                 2015 - 2017
    Website:       http://twily.info/
    Compatibility: Mozilla Firefox, Internet Explorer, Google Chrome

	Sources:
	http://stackoverflow.com/questions/33454533/cant-scroll-to-top-of-flex-item-that-is-overflowing-container

-->
<html>
<head>
<title>&gt;_</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

<!--<link id="favicon" rel="shortcut icon" href="http://twily.info/favicon.ico" />-->
<!--<link rel="stylesheet" type="text/css" href="./css/style.css?v=1" />-->
<style type="text/css">
html,body {
    margin: 0; padding: 0; overflow: auto; font-size: 12pt;
    font-family: "Droid Sans", "Liberation Sans", "DejaVu Sans", "Segoe UI", Sans;
    background: #17181A; color: #AAABAD;
    width: 100%; height: 100%; margin: 0; padding: 0;
}
* { box-sizing: border-box; }
*:focus { outline: none !important; }

a:link, a:visited { color: #606163; text-decoration: none; }
a:hover, a:active { color: #EA75BC; }

.tbl { display: table; width: 100%; height: 100%; }
.tr { display: table-row; }
.td { display: table-cell; vertical-align: top; border: 1px solid #27282B; }


#flex { width: 100%; height: 100%; display: flex; position: absolute; z-index: 9; }
#wrap { padding: 128px; background: #111113; margin: auto; display: inline-block; position: relative; }


.menu {
    display: inline-block; cursor: default; position: relative;
    color: #606163; background: #27282B;
}
.menu span { display: inline-block; padding: 8px; }
.menu ul {
	display: block; list-style: none; margin: 0; padding: 0;
	visibility: hidden; opacity: 0; position: absolute;
	z-index: 10; background: #17181A; text-align: left;
    transition: .2s ease;
}
.menu ul li { white-space: nowrap; }
.menu:hover ul { visibility: visible; opacity: 1; }

.menu a:link, .menu a:visited { display: inline-block; width: 100%; color: #606163; padding: 8px; }
.menu a:hover, .menu a:active { color: #EA75BC; background: #27282B; }

#mnu1 { position: absolute; left: 0; top: 0; }
#mnu2 { position: absolute; right: 0; bottom: 0; }
#mnu2 ul { right: 0; bottom: 100%; text-align: right; }

</style>

<!--<script type="text/javascript" src="./js/main.js?v=1"></script>-->
<script type="text/javascript">
var $=function(id) { return document.getElementById(id); };

function init() {
    $('wrap').innerHTML+="&lt;Thanks for using <a href=\"http://twily.info/\" target=\"_blank\">Twily's</a> template! /&gt;";
}

</script>
</head>
<body onload="init();">


<div id="flex">
<div id="wrap">
	<div class="menu" id="mnu1">
		<span>Example 1</span>
		<ul>
			<li><a href="" target="_self">Item 1</a></li>
			<li><a href="" target="_self">Item 2</a></li>
			<li><a href="" target="_self">Item 3</a></li>
		</ul>
	</div>
	<div class="menu" id="mnu2">
		<span>Example 2</span>
		<ul>
			<li><a href="" target="_self">Item 4</a></li>
			<li><a href="" target="_self">Item 5</a></li>
			<li><a href="" target="_self">Item 6</a></li>
		</ul>
	</div>
</div>
</div>

<div class="tbl" style="position: absolute; top: 0; left: 0;">
    <div class="tr" style="height: 50px;">
        <div class="td">
            &nbsp;
        </div>
    </div>
    <div class="tr">
        <div class="td">
        
        <div class="tbl">
            <div class="tr">
                <div class="td" style="width: 200px;">
                    &nbsp;
                </div>
                <div class="td">
                    &nbsp;
                </div>
                <div class="td" style="width: 200px;">
                    &nbsp;
                </div>
            </div>
        </div>
        
        </div>
    </div>
    <div class="tr" style="height: 50px;">
        <div class="td">
            &nbsp;
        </div>
    </div>
</div>


</body>
</html>


Top
twily at openmailbox dot org
©twily.info 2013 - 2017



744 939 visits
... ^ v