最近仕事から帰ってきてはシコシコとBOMmERのサイトを構築中なのですが、その中にギャラリーページというものを設けまして
要は僕らのCD紹介ページです。
右往左往しながら作ってます。
多分コードは汚いので虐めないでください。
んで、構成としては簡単な感じだけどこんな感じに仕上げたいわけですよ。
▲こんな感じ
だのに
何か苦戦してしまったよ、ていう話
とりあえず、うりゃああ!って作ったら…
▲ちがうちがう
そうじゃない
なんで重なるんですか
で、この時点で使ってたのは回り込むための<br clear=”all”>なんかを駆使してなんとかしようとしてたけど、どうやら違う
参考:<br clear=”属性”> 画像の下から文書を始める -HTMLタグ辞典
そこで、ようやく気付いたのが
「tableで作成してそこに埋め込む形にすればいいんじゃね」
てこと
つまりイメージとしては
こんな感じでテーブル(Excelでいうとこのセルかな)つくってそこに画像なり文字を埋め込んでいけばいいんじゃねってこと。
▲こんな風に
じゃあ、あとは簡単じゃーん
って思ったけど改善されず
なぜだ
▲テーブルの大きさの設定してるし、画像はその半分使ってるから文字は勝手に残り半分使うんじゃないの?
って思ったけど、これが違う
テーブルの大きさの設定はよかったんだけど、「画像のサイズ設定=セルの大きさ設定」ではなかった。
- テーブルの大きさ設定
- セルの大きさ設定
- 入れたい情報を各セルに入れる
これだわ
この手順だわ
▲これなら大丈夫だろ
わくわく♪
▲…ちがう
曲名がど真ん中に鎮座してしまった
なぜ言うことを聞いてくれない
と思ったら、セル内での曲名配置設定してなかったくさい。
これでどうだ!!
▲できたあああああああああ!!!!!
これだよー
これがやりたかったんだよー