Skip to content

Instantly share code, notes, and snippets.

@MurakamiShinyu

MurakamiShinyu/inline-elem-text-boundary-problem.html

Last active June 2, 2023 05:25
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MurakamiShinyu/406f9638aa106fea57e2adad757e4dd7 to your computer and use it in GitHub Desktop.
Save MurakamiShinyu/406f9638aa106fea57e2adad757e4dd7 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
inline-elem-text-boundary-problem.html
<!DOCTYPE html>
<html lang="ja">
<style>
div:nth-child(2) {
font-family: "Noto Sans CJK JP";
}
div:nth-child(3) {
font-family: "Noto Serif CJK JP";
}
div:nth-child(4) {
font-family: sans-serif;
}
div:nth-child(5) {
font-family: serif;
}
div:nth-child(6) {
font-family: "YuMincho", serif;
}
p {
inline-size: 40em;
border: 1px solid black;
}
@page {
size: a4;
}
</style>
<body>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
<div>
<p>一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</p>
<p>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span>一<span>二</span>三<span>四</span>五<span>六</span>七<span>八</span>九<span>十</span></p>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment