Proverbs

by lilysirius

HTML

<link href="/proverb.css" rel="stylesheet" />
<div><span id="numbering">##42</span> <span id="frq">—regularly used</span></div>
  <div class="row">
    <div class="column">
      <h3 class="monS">Аз хүү байвал, ёоз хүүгээр цохино.</h3>
      <p class="monG">Ёоз гэдэг нь шоо шиг нүхтэй тоглоом юм. Энэ нь мөн тухайн тоглоомон дээрх хамгийн азгүй хэсгийн нэр. Зарим хүн хамгийн муу байдалтай байсан ч ялж чаддаг хүнд энэ үгийг хэлдэг. Харин зарим нь энэ зүйр үгийг ямар нэг зүйлийг азаар хожихыг хүсэж байгаа хүнд зориулан хэрэглэдэг байна.</p>
    </div>
    <div class="column">
      <h3 class="engS">If a person is lucky, hle will even win with yoz.</h3>
      <p class="engG">Yoz is a game with domino like pieces. It is also the word for the unluckiest piece to draw in the game. Some people would say this when referring to a person who can win even with the worst draws. Others might use it when referring to someone who wants to win something through luck.</p>
    </div>
  </div>

CSS

/* 加载字体 */
@font-face {font-family: 'Tahoma'; src: local('Tahoma'), url('/tahoma.ttf');}

/* 设置不同设备的基础字号 */
@media only screen and (max-device-width: 1440px) {body {font-size: 17px;} .column {width: 100%;}}  /* 手机 */
@media only screen and (min-device-width: 1441px) {body {font-size: 14px;} .column {width: 46%;}} /* 电脑 */

/* Create two equal columns that floats next to each other */
.row {display: flex;}
.column {float: left; padding: 0 10px 10px 10px;}


#frq {color:purple; font-size: 80%; font-style: italic;}
#numbering {color:gray; font-size: 80%;}


.monS {font-size: 100%; text-align: left; margin-bottom: 2px; font-weight: bold; font-family: 'Tahoma';}
.monG {font-size: 90%; text-align: left; margin-bottom: 2px; font-family: 'Tahoma';}


.engS {color: darkblue; font-family: serif; font-size: 93%; text-align: left; font-weight: bold;}
.engG {color: darkblue; font-family: serif; font-size: 85%; text-align: left;}