iPadで見るために

2015年1月15日

このホームページはWordpressのTwenty Elevenというテーマを使っているのですが、
デフォルトの状態だと、iPadで見たときに右のサイドバー（カレンダーなどがある場所）が下に落ちてしまいます。これは可変幅の設定で、何ピクセルだとこういうレイアウトって細かく指定されているのです。
そこでCSSを調整しました。
私が昔作ったような極簡単なホームページはただPタグの中に字をいれるとか、HRで線を引くとかだけなのですが、こってくると色をつけたり、太くしたりとかの装飾をだんだん入れるようになってきます。HTMLを書くときにそれぞれのタグに装飾の属性を入れればいいのですが、装飾だけを別に定義、記載しておいて、HTMLの記述は本文を主体にするというものがCSSです。（厳密にはちょっと違うのかもしれないけど）

Twenty Elevenに限らないと思いますが、テーマはいろいろな作り込みができる反面CSSが複雑です。いろんなサイト参考にしながら見つけたのが、ここの記述。

/* =Responsive Structure
———————————————– */

@media (max-width: 800px) {
/* Simplify the basic layout */

800pxから10ずつ値を下げていくと760pxでiPadでもサイドバーが表示されました。
一件落着。

今日はヘッダの画像を増やす作業もしました、5枚追加。

  • ハバナ、クラシックカー3台
  • ハバナ、ココタクシー
  • ハバナ、ハバナクラブの看板　「キューバ産のラムと煙草の店」
  • トリニダ、馬車にのるおじさん
  • バラデロ、ビーチの風景

WEB・電化,キューバ,旅行・行楽CSS,iPad,Twenty Eleven,WordPress,キューバ,トリニダ,バラデロ

Posted by takeichiro