スマフォ用サイト


スマフォ用サイトのQRコード

今月のカレンダー



1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30


カテゴリ一覧

ただの日記(916)
原付生活(3)
子育て日記(11)
PC関連(11)
もろもろ日記(869)

競馬+POG(1303)
当たらない予想と反省会(699)
POGネタ(58)
競馬について考える(17)
競馬もろもろ(187)
ダービーウィーク!(14)
2011年競馬場訪問記(27)
2012年競馬場訪問記(53)
2013年競馬場訪問記(61)
2014年競馬場訪問記(40)
2015年競馬場訪問記(44)
2016年競馬場訪問記(25)
2017年競馬場訪問記(36)
2018年競馬場訪問記(33)
ひとくち馬主(3)

ホームページ製作(336)
PHPの備忘録(13)
CSSの備忘録(5)
JavaScriptの備忘録(2)
ホームページもろもろ(258)
Flashの備忘録(12)
管理人の備忘録(19)
スマフォ用サイト作成(19)

自宅サーバ(337)
FreeBSD(17)
Apache(4)
PHP(5)
MySQL(16)
サーバもろもろ(130)
障害連絡(124)
リニューアルプロジェクト 2011-2012(41)

お仕事(48)
お仕事(48)

旅の記録・水曜どうでしょう関連(43)
水曜どうでしょう(11)
2009年四国お遍路(6)
2009年アンコールワット(5)
2010年ベトナム(3)
2010年いっそ九州(5)
2010年北海道179市町村(5)
2011年春の一人旅(2)
2011年四国お遍路(6)


先月までのネタ

2018年
2018年11月(4)
2018年10月(10)
2018年9月(6)
2018年8月(1)
2018年7月(7)
2018年6月(5)
2018年5月(7)
2018年4月(19)
2018年3月(3)
2018年2月(3)
2018年1月(11)

2017年
2017年12月(14)
2017年11月(11)
2017年10月(18)
2017年9月(18)
2017年8月(21)
2017年7月(29)
2017年6月(26)
2017年5月(23)
2017年4月(18)
2017年3月(11)
2017年2月(11)
2017年1月(16)

2016年
2016年12月(25)
2016年11月(24)
2016年10月(30)
2016年9月(15)
2016年8月(16)
2016年7月(15)
2016年6月(18)
2016年5月(30)
2016年4月(28)
2016年3月(29)
2016年2月(26)
2016年1月(32)

2015年
2015年12月(30)
2015年11月(29)
2015年10月(30)
2015年9月(27)
2015年8月(28)
2015年7月(28)
2015年6月(28)
2015年5月(29)
2015年4月(30)
2015年3月(28)
2015年2月(26)
2015年1月(29)

2014年
2014年12月(31)
2014年11月(28)
2014年10月(31)
2014年9月(29)
2014年8月(29)
2014年7月(31)
2014年6月(31)
2014年5月(30)
2014年4月(30)
2014年3月(28)
2014年2月(27)
2014年1月(31)

2013年
2013年12月(29)
2013年11月(27)
2013年10月(29)
2013年9月(27)
2013年8月(28)
2013年7月(28)
2013年6月(29)
2013年5月(29)
2013年4月(30)
2013年3月(26)
2013年2月(24)
2013年1月(29)

2012年
2012年12月(28)
2012年11月(27)
2012年10月(28)
2012年9月(30)
2012年8月(31)
2012年7月(33)
2012年6月(32)
2012年5月(33)
2012年4月(35)
2012年3月(30)
2012年2月(27)
2012年1月(31)

2011年
2011年12月(25)
2011年11月(25)
2011年10月(28)
2011年9月(28)
2011年8月(28)
2011年7月(28)
2011年6月(27)
2011年5月(26)
2011年4月(16)
2011年3月(9)
2011年2月(11)
2011年1月(9)

2010年
2010年12月(12)
2010年11月(11)
2010年10月(8)
2010年9月(13)
2010年8月(10)
2010年7月(20)
2010年6月(6)
2010年5月(9)
2010年4月(2)
2010年3月(3)
2010年2月(5)
2010年1月(8)

2009年
2009年12月(9)
2009年11月(2)
2009年10月(4)
2009年9月(3)
2009年8月(1)
2009年7月(9)
2009年6月(3)
2009年5月(14)
2009年4月(10)
2009年3月(11)
2009年2月(9)
2009年1月(10)

2008年
2008年12月(1)
2008年11月(1)
2008年10月(1)
2008年9月(5)
2008年8月(1)
2008年7月(1)
2008年6月(2)
2008年5月(1)
2008年4月(1)
2008年3月(2)
2008年2月(7)
2008年1月(7)

2007年
2007年12月(11)
2007年11月(7)
2007年10月(8)
2007年9月(12)
2007年8月(11)
2007年7月(5)
2007年6月(16)
2007年5月(8)
2007年4月(2)
2007年3月(14)
2007年2月(2)
2007年1月(8)

2006年
2006年12月(4)
2006年11月(6)
2006年10月(7)
2006年9月(10)
2006年8月(9)
2006年7月(20)
2006年6月(13)
2006年5月(3)

2005年
2005年9月(13)
2005年8月(13)
2005年7月(18)
2005年6月(24)
2005年5月(26)
2005年4月(26)
2005年3月(27)
2005年2月(22)
2005年1月(26)

2004年
2004年12月(29)
2004年11月(29)
2004年10月(26)
2004年9月(23)
2004年8月(12)


最近のコメント



管理人の今年の目標が一つ増えました…。(あああ)

まあそんなに書くことはありませんが…。(momo)

【管理人からご挨拶】 『The Sunday Breeze』は5月25日に開設19周年を迎えます。(アオヤギ)

4月からスタートする「Sunday Breeze POG!」の一部ルール追加について。(アオヤギ)

昨日「Sunday Breeze賞」の観戦に帯広競馬場へ行ってきました。(白イチゴ)

本日5月25日、「The Sunday Breeze」は18回目の誕生日を迎えました。(アオヤギ)

【「G1予想大会」プレリリース終了】皆様のご協力、本当にありがとうございました。(アオヤギ)

【再度お知らせとお願い】今週からの「G1予想大会」、新機能プレリリースを公開中です。(白イチゴ)

2015年、新年明けましておめでとうございます(去年の目標を振り返り、今年の目標を!) (アオヤギ)

今日のブログは読まなくていいです。(ルーク)



ネタの検索



管理人の競馬観戦記録


(2018年)

JRA札幌競馬場
9月1日 (札幌2歳S)

JRA函館競馬場
7月22日 (函館2歳S)

JRA福島競馬場
11月11日 (福島2歳S)

JRA新潟競馬場
8月26日 (新潟2歳S)

JRA東京競馬場
10月6日 (KSARC)
10月21日

JRA中山競馬場
1月6日 (中山金杯)
3月3日 (オーシャンS)
9月29日

JRA京都競馬場
11月4日 (JBC3競走)

JRA小倉競馬場
9月2日 (小倉2歳S)

帯広競馬場
6月30日

盛岡競馬場
10月8日 (MCS南部杯)

水沢競馬場
6月10日 (岩手ダービーDC)

浦和競馬場
7月16日 (プラチナC)

船橋競馬場
3月16日
5月2日 (かしわ記念)
7月25日 (習志野きらっとS)
10月3日 (日本テレビ盃)

大井競馬場
1月24日 (TCK女王盃)
4月17日 (ブリリアントC)
5月9日 (羽田盃)
6月6日 (東京ダービー)
10月11日 (レディスプレリュード)

川崎競馬場
4月4日 (クラウンC)

園田競馬場
6月7日 (兵庫ダービー)

門別競馬場
6月20日 (北海優駿)
6月28日 (栄冠賞)
11月15日 (道営記念)

2012年以降の競馬観戦インデックス


管理人の競馬家計簿


(最近14日分)

2018年11月4日京都
61勝  回収率:136.4%

2018年11月6日門別
30勝  回収率:0.0%

2018年11月7日船橋
11勝  回収率:1,048.3%

2018年11月7日門別
32勝  回収率:219.4%

2018年11月8日門別
41勝  回収率:84.2%

2018年11月9日船橋
31勝  回収率:35.2%

2018年11月10日東京
62勝  回収率:169.1%

2018年11月10日京都
20勝  回収率:0.0%

2018年11月11日福島
20勝  回収率:0.0%

2018年11月11日京都
10勝  回収率:0.0%

2018年11月12日名古屋
31勝  回収率:45.2%

2018年11月13日門別
21勝  回収率:57.9%

2018年11月14日大井
11勝  回収率:150.7%

2018年11月14日門別
11勝  回収率:233.3%

2018年11月15日門別
82勝  回収率:53.3%

2018年11月17日東京
21勝  回収率:24.8%

2018年合計
1326333
勝率:25.1%  回収率:77.1%
(万馬券:34本的中)

2017年合計
881163
勝率:18.5% 回収率:69.8%
(万馬券:36本的中)

2016年合計
1520346
勝率:22.8% 回収率:68.6%
(万馬券:41本的中)

2015年合計
2014422
勝率:21.0% 回収率:67.2%
(万馬券:51本的中)

2014年合計
1733371
勝率:21.4% 回収率:67.0%
(万馬券:33本的中)

2013年合計
1716328
勝率:19.1% 回収率:76.6%
(万馬券:25本的中)

2012年合計
1206236
勝率:19.6% 回収率:72.5%
(万馬券:9本的中)

2011年合計
90988
勝率:9.7% 回収率:38.1%
(万馬券:8本的中)


管理人のつぶやき


(皆様のフォローをお願いします。)

@sunday_breeze からのツイート
「ホームページ製作」の「CSSの備忘録」ネタは、全部で5件あります。

IEのCSSバグについて考える

先日の続き。

IE5とかIE5.5にはCSSの解釈に一部バグがあります。

ちょっと試しに。

箱があります。
そして、ヘッダがあります。

箱とヘッダ 期待してる形

これは、最終的に望む姿。

ヘッダは<h2>、箱は<div>。

H2
{
background-color: #36e;
color: #fff;
padding: 8px;
font-size: medium;
font-weight: bold;
display: inline;
}

DIV
{
border: 1px solid #36e;
padding: 5px;
margin: 8px 0;
}

というスタイル。

これをIE5で見ると

箱とヘッダ IE5 なんか変

なんか変。

1:ヘッダがきつきつ。
2:ヘッダと箱の隙間。

2は古くからある「Box Hack」という手法で

DIV
{
border: 1px solid #36e;
padding: 5px;
margin: 0;
voice-family: "\"}\"";
voice-family: inherit;

margin: 8px 0;
}

とすることで解決。

で、問題は1だ。

これも根本原因は
<h2>要素をインラインにしてるから
ってことなんですが。
(これは「バグ」ではないらしい。「非対応」ということ)

ブロック要素にすると、こんな感じ。

箱とヘッダ h2をブロックに 隙間が

やっぱり隙間が開いちゃう。
マージンを0にする。

箱とヘッダ h2ブロックのマージン0に まあまあ

おかしくはないけどさ。

<h2>を<div>に入れてみる。

箱とヘッダ h2をdivの中に おかしかないけどさ

おかしくはないけどさ。
イメージ(=望む最終形)とは、ちと違う。

インライン要素であっても、width指定すると
パディングとかマージンとか現れるらしい。

ということで、widthを指定してみる。

H2
{
background-color: #36e;
color: #fff;
padding: 8px;
font-size: medium;
font-weight: bold;
display: inline;
width: 0;
}
箱とヘッダ インラインにwidth指定 ある意味予想通り

予想通り。

なので、改行するなってことか。

H2
{
background-color: #36e;
color: #fff;
padding: 8px;
font-size: medium;
font-weight: bold;
display: inline;
width: 0;
word-break: keep-all;
}

箱とヘッダ 改行するな まあ望む形

これです。求めていたのは。

で、これをIE6で見ると

箱とヘッダ IE6だとやっぱり隙間

なので、「Box Hack」と同じ手法で、
IE5以外なら
width:auto
word-break:normal
としちゃう。

H2
{
background-color: #36e;
color: #fff;
padding: 8px;
font-size: medium;
font-weight: bold;
display: inline;
width: 0;
word-break: keep-all;
voice-family: "\"}\"";
voice-family: inherit;
width: auto;
word-break: normal;
}

箱とヘッダ IE6ハック 一応見れる

まあこんな感じでしょう。

IEの5と6、Opera7.5と9.02、Netscapeの6.1と8.1で確認。

Netscapeの8.1だと、微妙に隙間できてるけど、
もうめんどくさい(笑)

でもさ、word-breakって大丈夫かなあ。
単語の切れ目でしょ?半角数字とか英文字とかが混ざったヘッダだったら
改行されちゃったりしない?

white-spaceとかword-wrapだとIE5は効いてくれないし。

<nobr>って使えたっけか?

[コメント読む(0)]  人気ブログランキングへ 
[広告です] 地方競馬をひとつに集約!全場買える【 楽天競馬 】

また1からやり直し?

週末、プライベートマシンにWindows2000を入れなおしました。

やっぱり入れなおすと、なかなか快適に動くもんですね。

ところが。

初期状態のInternet Explorerのバージョンは5.0。たぶん。

リニューアル予定のページは、予想通り表示が崩れてましたねぇ。
Ajaxは動くみたいだけど。

同様にして、学生時代に使っていたPC98ノートに
Windows98SEを入れてみて、
初期状態のIE(これもバージョン5.0?)で見てみました。
JavaScriptのエラー、でまくり。
表示崩れまくり。


IEについては、CSSの表示にかなりバグが潜んでますんで、
バグリストと見比べつつ、ちょっと直していくって感じですかね。

いつになったら公開できるんだ??

[コメント読む(0)]  人気ブログランキングへ 
[広告です] 地方競馬をひとつに集約!全場買える【 楽天競馬 】

残作業を少しずつ潰す(今日の分)

今週も始まりましたが、
みなさんいかがお過ごしでしょうか。

まずは、NN4.x対策。

全く表示されないのは、結局スタイルシートが中途半端に適用されたためで、
完全に適用外にしてしまえば、そこそこ見られることがわかりました。
「バグにはバグで対抗! Netscape4.x スタイルシート対策」
なんて記事を見つけましたんで、
メディアタイプ=allとして、読み込めないようにしました。

それと同時に、外部CSSファイルでclass=しているところと
タグに直接style=指定しているところとで混在してましたんで、
NN4.x対策の一環として、すべてのスタイルは外部CSSファイルに移そうと。

NN4.x対策、終了。

それと、プルダウンのリンクについて、
jsOffの場合、うんともすんとも言わなくなってしまう件は
完全にリンクで対応することにしました。
見栄えもちょっと変わってくるので、現在修正中。。。

AjaxというかAHAHというかで構成されているページは、
基本的にはjsなしのページを全部作る予定でいます。
こればっかりは仕方ない。

一応、画像を除いて、ページ作成は今週中にけりをつけたいところ。
画像いじるのは、家じゃないとできないので。

[コメント読む(0)]  人気ブログランキングへ 
[広告です] JRAのネット投票なら楽天銀行+即PAT!

IEのバグに悩まされていた。

20070125分画像
右の図。

現在作成中の画面です。
上半分はIE。下半分はOperaで表示させたときのものです。

通常、Operaを使用しているので、ごく最近まで気づかなかったのですが、
IEで表示させると、どうも行間が詰まる。
div要素のline-heightプロパティに1.8と設定しているのですが。

で、よくよく見てみたら
画像(imgタグ)が含まれている行だけ、行間が狭くなってる。

なぜだろうと思って、ぐぐってみた。
見つかった。

IEバグ:img要素などの置換要素を含む行の前後では、line-heightが指定した値より小さくなる|CSS HappyLife

ということ。

英語ですが、ここも(サンプルあり)
Microsoft Internet Explorer: Line-height / Replaced Element Bug

imgタグだけでなく、inputtextareaなどでも同様の現象が起こる模様。

対策としては、画像の上下にpaddingプロパティで間隔をあけてやるしかないみたい。
だけど、正常に見えてるブラウザに対してはハックで対処してやらなきゃならない、と。

具体的な方法については、これから考えます。

[コメント読む(0)]  人気ブログランキングへ 
[広告です] JRAのネット投票なら楽天銀行+即PAT!

blogリニューアルの反響

まったくなし(笑)

これじゃ 、いいのか悪いのかもわかりませんがな。
なんてことはまったく考えず、
相変わらずわが道を進んでおります。
毎日、若干ではありますが、
ページは変化しているのです。

土曜日、写真入れられるようにしました。
日曜日、太字下線を入れるようにしました。
月曜日、カレンダーのフォントを小さくしてみました。
さて今日は?

今、同じデザインで
POGページも作り変えてます。
時間かかってます。
メインはFlashです。
ヘッダのFlashも動きはできてます。
使用するイラストを奥さんに頼んでます。
自分とは違って、右脳がよく働く人ですから。

ちなみに、このページのデザインも、
奥さんに見てもらってます。かなり前に。
相当ダメ出しをくらって、
今にいたっております。

話が支離滅裂。

そうそう、最後に
IE5でスタイルシートを使うとき、
ボックスの幅などにバグがあるそうです。
(「Box Model Hack」というそうです。)
長いことこれで悩んでたんですよ。
備忘録もかねて、リンクはっときます。
日本語訳:Box Model Hack
[コメント読む(0)]  人気ブログランキングへ 
[広告です] JRAのネット投票なら楽天銀行+即PAT!