Size title text properly on different platforms
This commit is contained in:
parent
11f56e57e8
commit
6af3ad4bc7
|
@ -44,6 +44,7 @@
|
||||||
.tarot-card__title {
|
.tarot-card__title {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
||||||
|
font-size: clamp(0.8rem, 6vw, 1.8rem);
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,10 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
|
<meta name="HandheldFriendly" content="true" />
|
||||||
|
<meta name="MobileOptimized" content="320" />
|
||||||
|
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, width=device-width, user-scalable=no" />
|
||||||
|
|
||||||
<title>tarotcard.css Test Page</title>
|
<title>tarotcard.css Test Page</title>
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
|
@ -34,7 +38,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="tarot-card__section tarot-card__section--title">
|
<div class="tarot-card__section tarot-card__section--title">
|
||||||
<h1 class="tarot-card__title">The Simple Card.</h1>
|
<p class="tarot-card__title">The Simple Card.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -45,11 +49,10 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="tarot-card__section tarot-card__section--title">
|
<div class="tarot-card__section tarot-card__section--title">
|
||||||
<h1 class="tarot-card__title">The Deal Card.</h1>
|
<p class="tarot-card__title">The Deal Card.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in New Issue