" > STINGER 8:PREV, NEXT(前のページ、次のページ) の表示を横並びにしてみた。 – てててのて

ブログいじり 雑記

STINGER 8:PREV, NEXT(前のページ、次のページ) の表示を横並びにしてみた。

投稿日:2020/01/21 更新日:

STINGER 8:PREV, NEXT テーブルタグ追加後の状態
STINGER 8:PREV, NEXT テーブルタグ追加後の状態


さて、前回は気になっていた「PREV、NEXT」の表示位置を執筆者とコメントの間に移動したところまで進めてみたわけだが・・・・・。

表示自体はこれまでどおり「PREV」と「NEXT」は上下に配置された縦並びのまま。

STINGER 8:PREV, NEXT 前回までの表示状態

これでは某の目指す「ページを捲る」という感覚には程遠いものがある。

というわけで、今回はこの縦並びの「PREV、NEXT」を左右に並べて表示するまでをやってみようと思う。

やり方はいろいろあるとは思うが、某の考えた一番確実で手っ取り早い方法は 「テーブル」を利用すること。


テーブルとは

↓要するにコレの事。

1行1列目の要素 1行2列目の要素 1行3列目の要素
2行1列目の要素 2行2列目の要素 2行3列目の要素
3行1列目の要素 3行2列目の要素 3行3列目の要素

これをHTMLタグで記述するとこうなります。


<table>
  <tr>
    <td>1行1列目の要素</td>
    <td>1行2列目の要素</td>
    <td>1行3列目の要素</td>
  </tr>
  <tr>
    <td>2行1列目の要素</td>
    <td>2行2列目の要素</td>
    <td>2行3列目の要素</td>
  </tr>
  <tr>
    <td>3行1列目の要素</td>
    <td>3行2列目の要素</td>
    <td>3行3列目の要素</td>
  </tr>
</table>

ここで例として 挙げたのは3行x3列のテーブルですが、要はこんな感じに 左側に「PREV」右側に「NEXT」 が来るように1行2列 のテーブルで囲ってやればよい・・・という単純な発想なのである。

まあ「テーブルをレイアウト目的に使用するべきではない」とどこかで明言されていたような気もするが、あまりいろいろ試している時間もないのでとりあえず赦されたし。


> 続きを読む 

-ブログいじり, 雑記
-, , ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

アフィリエイト

Google AdSense にチャレンジしてみた

アフィリエイト 何も考えず中途半端な状態でスタート切った感のあるこのブログではあるが 記事が10件書けたらやろうと思った事をいくつか設定してあのタイミングでの公開に踏み切っていたりする。 少し前の「P …

「JUNK LAND」玉置浩二(アップ)

太陽さん・・・玉置浩二・・・

「JUNK LAND」玉置浩二(アップ) 少し昔の話をしよう。 あれは某コーヒー飲料がオリジナル・ジャンパーを景品に販促キャンペーンをしていた頃。 そのキャンペーンは、缶に付いたシールを何十枚だか集め …

STINGER 8:PREV, NEXT 今回手直し後の状態

STINGER 8:PREV, NEXT(前のページ、次のページ) の表示を調整してみた。

STINGER 8:PREV, NEXT 今回手直し後の状態 前回、 見かけは少々いびつながら一応は「PREV」「NEXT」を横並びにすることができました。 今回は、この微妙におかしな表示を修正して、 …

PREV, NEXT 移動後の位置

STINGER 8:PREV, NEXT(前のページ、次のページ) の表示位置を変更してみた。

STINGER8:PREV, NEXT の移動 某のブログのテーマとして STINGER 8 を選んだ理由は単純で、始めてみようかと思うきっかけになったブログで使われていたテーマが、(たぶん)コレだっ …

今日のタピアン(2020/01/26)

これからの予定を少し

今日のタピアン(2020/01/26) 天気も悪いし寒いので今日は一日、家でダラダラ過ごす予定。 朝食の後、風呂に浸かりながらメールとSNSをチェック。 さっぱりしたところでPCの電源を入れて、rad …

プロフィール・・・?

▼プロフィール・・・?

「楽しもうとしないヤツの人生なんて楽しくないに決まってるだろ?」
・・・という事実に気づいて以来、いろいろと少しづつ生活を変えてる真っ最中。
某の駄文、楽しんでいただけたら幸い也。