add example for #13

aralejs · Sep 9, 2012 · 30b39da · 30b39da
1 parent 459cfe6
commit 30b39da
Showing 1 changed file with 46 additions and 0 deletions.
diff --git a/examples/item-haslayout.html b/examples/item-haslayout.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
+<title>Select</title>
+<link rel="stylesheet" href="http://aralejs.org/assets/base.css">
+<style type="text/css" media="screen">
+.ui-container {margin:50px auto;width:950px;}
+h1{margin-bottom: 100px;font-size:18px;}
+
+
+.ui-select {position:absolute;border:1px solid #ccc;}
+.ui-select-item-hover {background: #ccc;}
+.ui-select-error .ui-select-item{
+    /* height: 30px; */
+    zoom:1;
+}
+</style>
+</head>
+<body>
+
+<div class="ui-container">
+    <h1>
+    正常情况
+    </h1>
+    <div class="ui-select" style="top:80px;">
+        <ul>
+            <li class="ui-select-item">占位占位占位占位占位</li>
+            <li class="ui-select-item">占位占位占位占位占位</li>
+        </ul>
+    </div>
+
+    <h1>
+    设置了 height，不正常了，当然也可以用 zoom:1
+    </h1>
+    <div class="ui-select ui-select-error" style="top:220px;">
+        <ul>
+            <li class="ui-select-item">占位占位占位占位占位</li>
+            <li class="ui-select-item ui-select-item-hover">占位占位占位</li>
+        </ul>
+    </div>
+</div>
+</body>
+</html>
+