Skip to content

Instantly share code, notes, and snippets.

@Grsmto
Created June 23, 2013 19:07
Show Gist options
  • Save Grsmto/5846149 to your computer and use it in GitHub Desktop.
Save Grsmto/5846149 to your computer and use it in GitHub Desktop.
Chrome Android pixel snapping test
<!DOCTYPE html>
<!--[if IEMobile 7 ]> <html class="no-js iem7"> <![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="cleartype" content="on">
<style>
.menu {
position: absolute;
}
.menu ul {
margin: 0;
}
.menu li {
display: block;
border-bottom: 1px solid black;
list-style: none;
}
.menu a {
color: #333;
text-decoration: none;
background: none;
border: none;
font-weight: normal;
text-shadow: none;
text-align: left;
height: 40px;
padding-top: 20px;
padding-left: 15px;
font-size: 1.5em;
font-family: sans-serif-light, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 100;
display: block;
line-height: 18px;
}
.menu a:hover {
background-color: transparent;
}
.menu a:active {
background-color: white;
}
#pixelsnapped {
left: 0;
top: 0;
margin-right: 40px;
-webkit-transform: translate3d(2px,2px,0);
}
#not-pixelsnapped {
right: 0;
top: 0;
margin-right: 40px;
-webkit-transform: translate3d(1px,1px,0);
}
#not-pixelsnapped a {
height: 39px;
}
</style>
</head>
<body>
<!-- Add your site or application content here -->
<div id="pixelsnapped" class="menu">
<ul>
<li><a href="#">Accompagnateurs</a>
</li>
<li><a href="#">Conseils</a>
</li>
<li><a href="#">Réglementations</a>
</li>
<li><a href="#">Guide</a>
</li>
</ul>
</div>
<div id="not-pixelsnapped" class="menu">
<ul>
<li><a href="#">Accompagnateurs</a>
</li>
<li><a href="#">Conseils</a>
</li>
<li><a href="#">Réglementations</a>
</li>
<li><a href="#">Guide</a>
</li>
</ul>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment