Skip to content

Instantly share code, notes, and snippets.

@azusa-tomita

azusa-tomita/index.html

Created September 3, 2019 08:42
Show Gist options
  • Save azusa-tomita/69f68ff943286603c13ce980f2f69f14 to your computer and use it in GitHub Desktop.
Save azusa-tomita/69f68ff943286603c13ce980f2f69f14 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<style id="jsbin-css">
input{
font-size:20px;
line-height:1.2;
border:1px solid #ccc;
border-radius:0;
width:100px;
}
.h {
font-family: 'Hiragino Kaku Gothic ProN';
}
.out0:focus {
outline: 0;
}
</style>
</head>
<body>
<h1>iOS inputにヒラギノ且つ:focus{outline:0}にしてると2文字目からgとかの下部分が欠ける</h1>
<p>font未指定 : <input type="text" class="n out0"></p>
<p>ヒラギノ : <input type="text" class="h out0"></p>
<script id="jsbin-source-css" type="text/css">input{
font-size:20px;
line-height:1.2;
border:1px solid #ccc;
border-radius:0;
width:100px;
}
.h {
font-family: 'Hiragino Kaku Gothic ProN';
}
.out0:focus {
outline: 0;
}</script>
</body>
</html>
Raw
jsbin.biyusil.css
input{
font-size:20px;
line-height:1.2;
border:1px solid #ccc;
border-radius:0;
width:100px;
}
.h {
font-family: 'Hiragino Kaku Gothic ProN';
}
.out0:focus {
outline: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment