contact_005

東京都庁

東京都新宿区西新宿2丁目8−1  GoogleMap
受付時間 /午前9:00~11:45
午後16:00~18:45

休診日 /日曜日・祝日
tel:046-211-7167

ブロック自体のwidth指定をしたブロックで半分は余白なしで写真をレイアウト

 
ブロックの背景に色をつけてブロックを認識しやすいようにするために、CSSでブロック事態のwidth指定をしています。ブロックの余白設定はゼロに、そして2分割としています。右の文字情報はカラム2に対して設定したpaddingで上下左右に余白が入るようにしています。この設定はスマホではそのまま文字情報が写真の下になり見易さも保てます。
 
写真は横幅500px以上の写真がいいと思いますが、高さは自由です。右カラムに入る文字情報の行数によって写真を超える高さになってしまうとレイアウトが格好悪くなりますので、右の行数によって写真の高さを越えないような写真を選んぶようにしましょう。