ナナピみたいな情報ブログ

【HTML】横並びにして縦の位置を合わせたい

2013/02/27 20:30 投稿

  • タグ:
  • HTML
  • 覚書
  • 勉強
  • これ見れば大丈夫
  • どうしてこうなった

【覚書】
横並びにして縦の位置を合わせたい

vertical-align: middle;
をつかいたい

‥もfloatとかでやっても高さを認識してくれなかったり、vertical-alignが使えなかったりする。

vertical-align: middle;を使いたいため、
横並びには

display: inline-block;

を使ってあげると、縦方向に合わせやすい。

.left_contents{
display: inline-block;
margin-right: 10px;
}

.center_contents{
display: inline-block;
margin-right: 0px;
vertical-align: middle;
}

.right_contents {
display: inline-block;
overflow: hidden;
vertical-align: middle;
margin-left: 10px;
}

.right_contents に縦の高さが可変してもセンター合わせになる!‥はず


コメント

コメントはまだありません
コメントを書き込むにはログインしてください。

いまブロマガで人気の記事