和風サイトを開発しようと思い立ち、「もちろん“和風”なんだから縦書きでしょ!」と安易な気持ちで始めたのだが、かなり苦労したのでここにまとめておく。 heading(h1タグやh2タグ)やparagraph(pタグ)などの通常のテキストは、writing-modeプロパティにvertical-rlを指定するたけで簡単に縦書きにできる。 しかし、入力フォーム(inputやtextarea、select、button)はwriting-modeプロパティの指定だけでは縦書きにできなかった。 そこで、HTMLとCSSだけで縦書きの入力フォームをつくる方法をまとめる。(かなり脳筋なやり方だけど) writing-mode とは まずは縦書きにするもっとも簡単な方法であるwriting-modeプロパティについて。 writing-mode プロパティは、テキストの行のレイアウトを水平または垂直に、ブ
![HTML/CSSだけで縦書きの入力フォームをつくる | Black Everyday Company](https://cdn-ak-scissors.b.st-hatena.com/image/square/6b220bf44aa6cb26cb6676b61e4807cef4cc4c0a/height=288;version=1;width=512/https%3A%2F%2Fblogger.googleusercontent.com%2Fimg%2Fb%2FR29vZ2xl%2FAVvXsEhSr-fLMrgSgvYsc96p4s1qYrE37Y82h89XS_NytQMS-Pp8dPxk2HWodpJSUb5BiFWfE0UkOsfXHe5bmQP5UCPr_RIys6KOI_btyhD5gm7Agy_nF8B3V96cZfZQF9MQ8Ti5w1VbJz2Emjgq%2Fw1200-h630-p-k-no-nu%2Fvertial-input-forms.png)