読者です 読者をやめる 読者になる 読者になる

ホームページ制作講座

ホームページ制作のHTMLやCSS、JavascriptやDTDとかDreamweaverなどWEB制作について

画像のtext-align:centerが効かない時の解決方法


ブロック要素内でimgタグをCSSでtext-align:centerで指定しても、ブロック内の中央に配置されない。テキストを配置した場合には正しくセンタリングされるのである。

imgタグのCSSセレクタにdisplay:blockプロパティが指定されていたので、優先度の高いセレクタを新たに作成して指定することで中央配置とする。

解決方法の補足として、imgタグにdisplay:blockプロパティを指定するのは、imgタグ下に余白は表示される場合があり、それを回避するために指定があり、CSSについての特性です。


問題解決カテゴリーとしては、text-alignについてのWeb制作に分類される。


情報について、検索エンジンでは下記の関連情報での組み合わせでインデックスされている。
text-align justify
text-align 効かない
span text-align
text-align 縦
css3 text-align
padding
text-align center 効かない
text-align html
float
position:relative