MRKなんでも記録

MRKなんでも記録 〜 好奇心・チャレンジ → synapse 増やそう

MRKなんでも記録

MENU

CSSを使って写真を中央配置に・縦写真が上に突き抜けるのが未解決

スポンサーリンク

f:id:r2okarain:20190712232246j:image

 

写真の中央配置

 

前から写真を中央に配置したかったが、コピペ元を探しても、なかなか見つからなかった。自分で出来そうに思えて、見よう見まねでしてみたが、やはり失敗。

 

が……見つけた。
memo@padさんの記事を。

ありがとうございました

n2blog.hatenablog.jp

 

/*写真を中央に表示*/
.hatena-fotolife, .http-image {
display: block;
margin: 0px auto;
}

/*写真を中央に表示 終わり*/

  

見事、この通り

f:id:r2okarain:20190422132736j:plain

 

(笑)パソコンで見ると中央化してるのが歴然だけど、スマホじゃ分からない

 

 

 縦写真の幅を70%狭くした

 縦写真がブログ幅いっぱいに表示されるので、幅を狭くしたかった

幅を70%の縮小

.photo-center {
display: block;
margin: 0 auto;
width: 70%;
}

今のところ効果のほどは分からない

横幅、70%になってるように思えないがまた再検討しよう

最近は、縦長になるのがイヤで、ブログにはあまり縦長写真を使わないようにしている

 

以下のサイト様のお蔭です 

www.takchaso.com

 

 

もう1つの写真ネタ

写真が縦長になって上に突き抜ける~未解決だが応急処置

前の前のテンプ(覚えていない)は縦長写真になったので、「innocent」に変えたら縦長が普通に戻った

 

今回、テンプレートを「Brooklyn」に変えて、以前の縦写真が縦に伸びてるのに気がついた

縦横比率がおかしいのは以前の写真だけで、最近の写真は普通に表示されているのが不思議

 

取り敢えずの応急処置は

ブログの写真を長押しして「イメージを保存」

(その写真の縦横の比率は正常なんだよな)

縦長写真を消して、再度アップする。

 

正常

f:id:r2okarain:20190422135146j:plain

 

下のは縦長になっている

f:id:r2okarain:20190422135306j:plain

 

テンプレートを変えると便利な事や支障が出る事もあるんだ。