JPstreamer
何の設定だっけ？
code:style.css
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
.container {
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: row-reverse;
border: 3px solid #bdc3c7;
padding: 20px;
margin: 20px 0;
font-size: 30px;
background-color: #2c3e50;
color: #ecf0f1;
width: 95%; /* ウィンドウ幅の80%に設定 */
height: 90%; /* ウィンドウ高さの50%に設定 */
}
.black-board-row {
font-family: "けいふぉんと", "しねきゃぷしょん", "メイリオ";
align-self: flex-end; /* 下揃えに配置 */
position: fixed;
bottom: 10;
}
.black-board {
writing-mode: vertical-rl;
font-family: "けいふぉんと", "しねきゃぷしょん", "メイリオ";
display: inline-block; /* テキストを横に並べる */
position: fixed;
font-size: 40px;
right: 10;
}
.clockTimer {
font-family: "けいふぉんと", "しねきゃぷしょん", "メイリオ";
position: fixed;
bottom: 70px; /* 下端からの距離を指定 */
left: 30px; /* 左端からの距離を指定 */
text-shadow: 1px 1px 2px #f00; /* 影の色、オフセット、ぼかしを指定 */
}
.clockTimerOther {
font-family: "けいふぉんと", "しねきゃぷしょん", "メイリオ";
position: fixed;
bottom: 40px; /* 下端からの距離を指定 */
left: 30px; /* 左端からの距離を指定 */
}
.black-board-org {
writing-mode: vertical-rl;
font-family: "けいふぉんと","しねきゃぷしょん", "メイリオ";
display: inline-block; /* テキストを横に並べる */
}
.black-board-row-org {
font-family: "けいふぉんと","しねきゃぷしょん", "メイリオ";
align-self: flex-end; /* 下揃えに配置 */
}