CSSのみでposition:absoluteがかかっている要素を上下中央配置にする

position:absoluteで浮いている要素を上下中央配置にするやり方。

昔は大変だったが、今ではflexboxを使えば簡単にできる。キーは子要素にdisplay:flexをかけて、縦方向に中心いするためにflex-direction:column、align-items: center;にし、さらにwidthとheightに100%をかける。

.parent {
  position: relative;
}

.child {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

幅と高さがない場合中央配置にならないため注意。

単純に中央配置にするだけなら、flexboxを使わなくても実現可能。leftとrightをどちらも0を指定するだけ。

.parent {
  position: relative;
}

.child {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
}

こちらも幅の指定をしないと中央配置にならないため注意。

 

Gitで全てをコミットした後でmodule不使用にも関わらず、下層ディレクトリでmodified: と表示される場合

Gitで全てをコミットした後でmodule不使用にも関わらず、下層ディレクトリでmodified: と表示される場合。

以下のような状態

On branch develop
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)
  (commit or discard the untracked or modified content in submodules)

    modified:   wp-content/themes/wpphone (modified content, untracked content)

no changes added to commit (use "git add" and/or "git commit -a")

単純に、上記ディレクトリにもう一つGitが設定されている場合がある。上記の場合で言えば、ルートにてgit initされて.gitディレクトリが設定されているのに加えて、

wp-content/themes/wpphone

のディレクトリにもgit initされて.gitディレクトリが存在する状態になる。

ちなみに下層ディレクトリにもGitがある場合、そのディレクトリでgitコマンドを打つと、上層のGitではなくそのディレクトリにあるGitへの登録が優先される。

Polylangに既存のページを翻訳ページに設定する方法

Polylangに既存のページを翻訳ページに設定する方法。何てことはない。翻訳バーのところに該当するページ名を入力して検索をかけるだけ。

Polylang

表示されたら選択するだけ。

「+」アイコンをクリックして新規ページを追加する方法のみしか紹介されていないところが多い。これだけのことが案外分からなかったりもする。

参考:Adding Translations to existing pages with Polylang

Macのディスプレイの色味がおかしい時の直し方

物理的にディスプレイが故障したわけではないのにも関わらず、色味が若干くすんで見える時がある。

特に自分の場合は黄緑色が顕著にくすんで見え、サブディスプレイと比べると違いが大きく分かるくらい。

調べてみるとPRAMメモリのクリアで直るとの情報を得て、実際にやってみると確かにくすみが取れて基のクリアな状態に戻った。

PRAMメモリのクリアはMacを起動直後に、

Option + Commnad + R + P

を押しっぱなしにする。成功するとMacのリンゴマークが出る前にもう一度再起動がかかる。リンゴマークが見えたら失敗のため、押すタイイングをずらすといい。

macOS Sierra: コンピュータの NVRAM または PRAM をリセットする

Linuxの数字による権限方式の簡単な覚え方

Linuxで権限の番号がいつも何番が何を表すか忘れてしまうため、ゴロで覚えよう。

chmod 600 directory-name

とかの600の部分のこと。

前提として1がx、2がw、4がrを覚えさえすれば、あとは組み合わせによって足せばいいだけ。

例:-wxは3、r-xは5など

(この時点で何を言ってるか分からない人は先にコマンド集で確認しよう)

で、1がx、2がw、4がrを覚えるゴロ。

夜には一○ックス

yo(4) “r”u ni(2) “w”a ichi(1) “x”

ん?何かちょっと大人な感じ。。と思ってるそこの方、

あなたの発想がエロいのです笑

kusanagiでインストールしたWordPressサイトにてLet’s Encryptを発行したにも関わらずhttps化されなかった時の対応方法

プライム・ストラテジー社から提供されているkusanagiはバージョン7.8からLet’s Encryptに対応しており、WordPressインストール時に選択すれば手軽にサイトのhttps化が実現できる。

しかし、Let’s Encryptを使用するように設定したにも関わらず、実際にサイトにアクセスしてみるとhttpのままだった時の対応。

サーバーにSSHでログインし、以下のコマンドを打つことでLet’s Encryptを再登録してくれる。Emailアドレスは適宜自分の登録したいメールアドレスに変更すること。

kusanagi ssl --email nullpopopo@example.com --https redirect --auto on <provision name>

参考:https://column.prime-strategy.co.jp/archives/column_384

Linux(CentOS)でディスク容量がいっぱいになった時に、GB以上のディレクトリの容量を確認するコマンド

ディスクのお掃除をする時は、容量が大きいGB以上のディレクトリから確認していきたいもの。

下記のコマンドでGB以上のディレクトリを確認できる。<dir>は実際のディレクトリ名に置き換える。

du -h <dir> | grep '[0-9\.]\+G'

参考:Tracking down where disk space has gone on Linux?