はてなブログでスタイルシートを使う

~~~~~ 16 March 2023追記 ~~~~~
今はもう少しシンプルに書いてて次のように書いてる
hogehogeで外枠をつくり
その内部にfuga1とfuga2で2つコンテンツを配置する
それらの幅はそれぞれ30%と70%

.hogehoge{
    display: flex;
    border: solid 3px #dcdcdc;
    background-color:#F9F9F9;

    text-align: center;
    align-items: center;

    margin: 0px;
    padding: 5px;
    width: 100%;
    height:260px
}
  
.fuga1{
    display: block;
    width: 30%;

}
  
.fuga2{
    display: block;
    font-size:14px;
    width: 70%;
}

~~~~~ 追記ここまで ~~~~~

[ダッシュボード]などの左のツールバーから
[デザイン] -> [カスタマイズ] -> [デザインCSS]
でスタイルシートにアクセスできる

divタグなどのstyleを指定するには
スタイルシートに以下の記述を加える

.hogehoge{
  display: table;
  border: solid thin #dcdcdc;
  background-color:#F9F9F9;
  text-align: center;
  margin: 0px;
  padding: 0px;
  width: 100%;
  height:240px
}

.hugahuga{
  display: table-cell;
  vertical-align: middle;
  float: left;
  width: 45%;
  margin-top: -30px;
  margin-bottom: 0px;
  margin-left: 5%;
  margin-right: 0%;
  padding: 0px;
  height: 220px
}

トップマージンをマイナスにしているのは
はてな記法のときに改行が入るのでその調整
markdownだといらないかも

設定したパラメータは
以下のようにして使用する

<div class="hogehoge">
  <div class="hugahuga">
    <a href="https://www.google.com/?hl=ja">
    google
    </a>
  </div>
  <div class="hugahuga">
    <a href="https://www.yahoo.co.jp/">
    yahoo!
    </a>
  </div>
  <div style="clear:both;">&nbsp;</div>
</div>