/* CSS･スタイルシート質問スレッド【29】 */

1 ：Name_Not_Found：04/03/18 17:34 ID:Olo8rUwK

CSSに関する質問はこちらへどうぞ。 ※　議論はよそで　※
■■■■■　質問のしかた　■■■■■
・基礎は解説サイト（→【関連リンク】）で勉強してください。
・質問の前に【FAQ】を参照して、既出の再掲を避けて下さい。
・【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。
　WinIEの場合は、[Ctrl+F]で検索できます。
・ブラウザによって対応していないプロパティーやバグがありますので、
　解説サイト（→【関連リンク】）の対応表や「CSSバグリスト」に目を通しておきませう。
・土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
　正当(valid)なHTMLを心がけて下さい。

初心者の疑問は大抵ここまでで解決します。

・OSやブラウザの種類とヴァージョンについては必ず明記してください。
　特にNetscapeは、ver.4までと6以降でまったく別物です。
・「環境を書け」とか「ソースは？」と求められたら応じませう。
　その方が回答が早く得られます。

http://web2ch.s31.xrea.com:8080/?CSS
【FAQ】　http://web2ch.s31.xrea.com:8080/?CSSFAQ
【過去ログ】　http://web2ch.s31.xrea.com:8080/?CSSLog
【関連リンク】　http://web2ch.s31.xrea.com:8080/?CSSRelated

2 ：Name_Not_Found：04/03/18 17:35 ID:???

3 ：Name_Not_Found：04/03/18 17:36 ID:???

【関聯スレッド】
・CSS/DHTMLバグ辞典スレッド第３版
　http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
・代替スタイルシートに萌え～
　http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
　http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50
・* CSS[適用="2ch"]{ イケてるスタイルを："作れ"}
　http://pc2.2ch.net/test/read.cgi/hp/1038678267/l50
・CSSでイケてるデザインサイト 20
　http://pc2.2ch.net/test/read.cgi/hp/1074254818/l50

【仕様書】
・CSS1の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS1/
・CSS2の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS2/
・CSS1の仕様書の邦訳（日本規格協会訳／個人訳）
　http://www.y-adagio.com/public/standards/css1/toc.htm
　http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css1/rec-css1.html
・CSS2の仕様書の邦訳（日本規格協会訳／個人訳）
　http://www.y-adagio.com/public/standards/tr_css2/toc.html
　http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html

【CSS検証】
・W3C CSS 検証サービス
　http://jigsaw.w3.org/css-validator/

4 ：Name_Not_Found：04/03/18 17:37 ID:???

【解説など】
・ごく簡単なHTMLの説明
　http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
　http://www.zspc.com/stylesheets/
・K@tsukun's PAGE! > CSS Reference
　http://hp.vector.co.jp/authors/VA022006/css/index.html
・とほほのスタイルシート入門
　http://tohoho.wakusei.ne.jp/wwwcss.htm
・ばけらの CSS リファレンス
　http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・Academic HTML::CSS2
　http://www.tg.rim.or.jp/~hexane/ach/
・『スタイルシートWebデザイン』ボランティアHTML化版。
　http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
・ZSPC - CSS2対応状況ガイド
　http://www.zspc.com/documents/css2/
・CSS対応状況表
　http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS1テストスイート　http://www.doraneko.org/css1test/
・ブラウザのHTML4/CSS対応度テスト
　http://homepage1.nifty.com/emk/moz/browsertest.html
・CSS Laboratory対応表・一覧
　http://is.vis.ne.jp/charts/index.xhtml
・CSSバグリスト＠CSSバグ辞典スレッド
　http://cssbug.at.infoseek.co.jp/index.html
・Web標準化Tips　（特に「HTML/CSSのよくある誤解・ミス」）
http://www.mozilla.gr.jp/standards/webtips/index.html
・ブラウザによる振り分け　（JavaScriptを使用しない方法）
　http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
・（ ´∀｀）＜ CSS でイケてるデザインサイトリンク集2
　http://www.geocities.co.jp/SiliconValley-SantaClara/1308/

5 ：【FAQ】：04/03/18 17:40 ID:???

Q1: IEで見ると大丈夫なのに、Netscape6（or 7）で見ると横スクロールバーが出てしまうのですが。

A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。
（width と height の計算方法の実装の違いについて参照）。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height
width（height）は、要素の内容領域の幅（高さ）を指定するプロパティですが、
WinIE等では、ボーダー領域 + パディング領域 + 内容領域の寸法で計算されます。
Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。
WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます
（Internet Explorer 6におけるCSSの拡張 - ボックスのサイズの指定方法の違い参照）。
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3
参考: IEとNNのBOXの計測方法の違いについて
http://www.fromdfj.net/html/border2.html

Q2: tableなどブロック要素をセンタリングするには？
text-align:center;を指定しても Netscape6(or7)ではなりません。IEでは中央寄せになるのに……。

A2: IEの実装の誤りです。詳しくは下記をご覧ください。
'text-align'に関する考察
http://anslasax.net/css-make/t-a/index.html
IE5.5とNetscape6のCSS - 中央寄せ
http://tancro.stp-1.com/stylesheet/n6_center.html
Internet Explorer 6におけるCSSの拡張 - プロパティに追加された値
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic6
Tableのセンタリング
http://members.jcom.home.ne.jp/jintrick/Personal/css_miss_table.html
ブロックレベル要素をセンタリングする方法
http://www.mozilla.gr.jp/standards/webtips0004.html

6 ：【FAQ】：04/03/18 17:44 ID:???

Q3: CSSで段組するには？

A3: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラムデザインの実現
http://shiten.s9.xrea.com/etc/stylesheet/multi_column.htm
スタイルシートでマルチカラム・デザインを実現する方法
http://www.motchie.com/article/multicolumn.html
tableを使はない段組:CSSによるマルチカラムデザインについての考察
http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
試驗場 - 段組(position版)
http://members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html
段組れいあうとてすと（floatによる段組の例）
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
なかよしぱれっと（Netscape4でも崩れない段組みの実例）
http://village.infoweb.ne.jp/~fores/

7 ：【FAQ】：04/03/18 17:45 ID:???

Q4: なんかフロートの表示が崩れるみたいなんですけど？ †
A4: floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。
WinIEは勝手に補ってくれるだけです（width明示なしのブロック要素をfloat参照）。
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
またfloat:left;で回り込むのはテキスト（imgを含む）だけです。
ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:（浮動要素のwidth）;”なりを指定する必要があります。
WinIEの間違った実装で誤解が多いので注意。
フロートに後続する要素のボックス幅がフロートに合わせて短縮される(IE6)（CSSバグリスト）
http://cssbug.at.infoseek.co.jp/detail/winie/b054.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
heightプロパティの注意点～内容がfloat要素の場合
http://www.mozilla.gr.jp/standards/webtips0021.html
フロートの後続フロー制御を設定したbr要素が親要素に包含されない（CSSバグリスト）
http://cssbug.at.infoseek.co.jp/detail/winie/b079.html
幅や高さを指定した要素ではボックスサイズの算出時にフロートを除外しない(IE6)（CSSバグリスト）
http://cssbug.at.infoseek.co.jp/detail/winie/b053.html

Q5: CSSで疑似フレームってどうやるの？
A5: 次のページを参考にして下さい。
overflowプロパティ
Q5: CSSで疑似フレームってどうやるの？ †
A5: 次のページを参考にして下さい。
overflowプロパティ
http://kobit.info/tips/overflow.html
擬似フレーム
http://kobit.info/files/frame.html
overflowを用いた擬似フレーム
http://www.fromdfj.net/html/overflow.html
レイアウトサンプル擬似フレーム
http://www.rju666.com/web/layout/imitate_frames.html

8 ：【FAQ】：04/03/18 17:47 ID:???

Q6: 画面中央に配置するにはどうすれば？
A6: 左右（水平方向）のセンタリングはA2既出。
垂直には色々な方法があります（スタイルシート縦中央(垂直中央)参照）。
http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm
vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。

Q7: 背景画像を二つ指定するにはどうするか。
A7: できません。background-imageは一要素に一つだけ。要素を重ねるなど工夫して下さい。

Q8: dt・ddを横並びにしたいのですが。（会話文など）
A8: floatとmargin-leftの応用で。下記サイトを参照のこと。
<dl> の整形
http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

Q9: リンクした画像の線が消えません。
A9: img要素ではなくa要素をセレクタにしてborder指定してませんか？　 a:link img, a:visited img, a:hover img {border:none;}
NN4は画像アンカーのボーダーを消去できない（Netscape Navigator 4.x CSSバグリスト）参照。
http://cssbug.at.infoseek.co.jp/detail/nn4x/b022.html
text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。
cf. 親要素のtext-decorationの効果を子要素で解除できる(Internet Explorer (Windows) CSSバグリスト)
http://cssbug.at.infoseek.co.jp/detail/winie/b040.html

9 ：【FAQ】：04/03/18 17:49 ID:???

Q10: リンクを新しいウィンドウで開かせるにはどうしたら？
A10: ＣＳＳではできません。target属性かJavaScript?でやって下さい。別窓が開くと迷惑に感じる人もありますからなるべくしない、がＷ３Ｃの方針です。

Q11: いままでＨＴＭＬでやってた××をＣＳＳでやるにはどうすればいい？
A11: 下記をご覧あれ。テーブル・レイアウトは段組のＦＡＱを見なさい。
First step CSS - いままでの HTML との対照
http://www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm
Step forward CSS - いままでの HTML との対照
http://www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm
Take off with CSS - いままでの HTML との対照
http://www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm
HTML でのレイアウト指定の、 CSS での指定との対応表
http://deztec.jp/site/tips/page/p0037.html

10 ：Name_Not_Found：04/03/18 17:50 ID:???

>>7で思いっきりミスした・・・アドレスの前に空白入れるのも忘れたからかなり見づらいぽ・・・ｽﾏｿorz

11 ：Name_Not_Found：04/03/18 20:05 ID:vFQAm4TQ

tableタグで表を作成したのですが、
表示させる位置を指定させたいと思っています。
height、positionなどいろいろ動作させてみましたが
いまだ位置は変更できてません。

何かアドバイス等ありましたらよろしくお願いします。

12 ：Name_Not_Found：04/03/18 20:31 ID:???

>>1さん、乙。>>1に>>2-9へのアンカーが無いが。

13 ：Name_Not_Found：04/03/18 20:42 ID:???

>>11
まずは、table要素に対してmarginを設定してみましょうか。
>アドバイス
まるで分かってなさそうなので、解説サイトや仕様書を読んでみましょう。

14 ：Name_Not_Found：04/03/18 21:02 ID:???

>>12
忘れてた・・・ゴメンよー

15 ：Name_Not_Found：04/03/19 01:30 ID:???

>>1よ、>>3の關聯スレッドが更新されたので注意と言った筈だが。

CSS/DHTMLバグ辞典スレッド第４版
　http://pc2.2ch.net/test/read.cgi/hp/1078463560/l50

16 ：Name_Not_Found：04/03/19 01:57 ID:???

>>15
じゃあオマエが立てろよハゲ。

17 ：Name_Not_Found：04/03/19 02:10 ID:???

>>3の關聯スレッドが更新されたので注意と言った筈

ってのが正しければ>>1が悪い訳だが。

18 ：Name_Not_Found：04/03/19 02:10 ID:???

>>16
あ-あ、そんなこと言ったから……

/* CSS･スタイルシート質問スレッド【29】 */
http://pc2.2ch.net/test/read.cgi/hp/1079629187/l50

19 ：Name_Not_Found：04/03/19 02:12 ID:???

>>17
http://pc2.2ch.net/test/read.cgi/hp/1076968824/972n

20 ：Name_Not_Found：04/03/19 02:16 ID:???

リンクチェックもろくにしないものぐさが
いっちょまえの振りしてスレ立てるなってこった

21 ：Name_Not_Found：04/03/19 02:20 ID:???

>>19
前スレみるのダルかったからありがとう。

22 ：１：04/03/19 02:26 ID:???

あと４レスで1000ってのに何の動きもなかったから焦ったんだよ。悪かったよ。もう建てないよ。

23 ：Name_Not_Found：04/03/19 02:27 ID:???

失敗を糧にして、次から気をつければいいさ。

24 ：Name_Not_Found：04/03/19 02:56 ID:???

このスレが正当なスレです。
ミスがあればスレ内で訂正すればよい。

25 ：Name_Not_Found：04/03/19 02:57 ID:???

>スレが乱立してるのでこのスレは削除依頼出しました。
http://qb2.2ch.net/test/read.cgi/saku/1027465273/l50

26 ：Name_Not_Found：04/03/19 02:59 ID:???

>>25
削除依頼が出ているのは後から立てられた方

27 ：Name_Not_Found：04/03/19 03:08 ID:???

tu-ka両方出されてるし

28 ：Name_Not_Found：04/03/19 03:11 ID:???

>>27
こっちが正しいスレ。
馬鹿がこのスレの削除依頼を出しているが、あんな削除理由では通るわけがない。

29 ：Name_Not_Found：04/03/19 03:13 ID:???

というわけで、このスレを使いましょう。

30 ：Name_Not_Found：04/03/19 03:31 ID:???

>>15
とりあえずしね

31 ：Name_Not_Found：04/03/19 04:08 ID:???

>>15
前スレが終わりかけている状況でスレも立てないくせに、立ててくれた人が少しミスしたら文句かよ。
こういう奴こそ真の厨房だな。

32 ：Name_Not_Found：04/03/19 04:59 ID:zZ/7Ff/W

MS PGothic　と　ＭＳＰゴシック
は全く同じフォントですか？

全く同じ場合、どちらを指定した方が良いのでしょうか。

33 ：Name_Not_Found：04/03/19 05:27 ID:???

指定しないのが一番良い。

34 ：Name_Not_Found：04/03/19 05:51 ID:UBFF8pvH

で、どちらかを必ず指定する場合には、
どっちが良いんでしょうか？

35 ：Name_Not_Found：04/03/19 05:53 ID:???

指定しないのが一番良い。

36 ：Name_Not_Found：04/03/19 10:00 ID:???

>>15
消え失せろ。

37 ：Name_Not_Found：04/03/19 10:09 ID:???

もういいじゃん。

38 ：Name_Not_Found：04/03/19 11:11 ID:YDADsd/F

font-family:” "HG創英角ﾎﾟｯﾌﾟ体"を指定しても
なぜか表示されません。

39 ：Name_Not_Found：04/03/19 11:14 ID:???

もう秋田

40 ：Name_Not_Found：04/03/19 11:55 ID:YDADsd/F

font-family:"HG創英角ﾎﾟｯﾌﾟ体"を指定しても
なぜか表示されません。

すみません、この書き方でも

41 ：Name_Not_Found：04/03/19 12:01 ID:???

(･∀･)ﾆﾔﾆﾔ

42 ：Name_Not_Found：04/03/19 12:04 ID:???

>>40
そこの表記が正しくても前後のミスで反映されない事もある。
最悪CSSだけでもソースだそう。
font指定する時は、一般名も表記しよう。
そうすれば対象フォントがない環境でも多少は意図どおりの「レイアウト」にはなる。

font指定ないのが良いとか言ってるだけの奴はもうなんも言うな。

43 ：Name_Not_Found：04/03/19 13:42 ID:???

>>42
フォント云々の体裁表現のことで「レイアウト」という言葉はおかしい。
対象フォントがない環境でも雰囲気は最低限伝わるぐらいのもんだろう。

44 ：Name_Not_Found：04/03/19 17:01 ID:???

フォントは指定しないほうがいいのか。
てっきり指定したほうがいいのかと思ってた。

45 ：Name_Not_Found：04/03/19 18:49 ID:???

そのうち、「CSSは閲覧者側が用意すべきであり、作成者側はHTML文章だけ提示すべきだ」という極論になりそうだな。

46 ：Name_Not_Found：04/03/19 19:43 ID:???

つーかさー、HTML+CSSっていうのはユーザスタイルシートが使えるっていうのがメリットなんだから
作成者はなんらかの方法でclassやidを統一したHTMLだけを用意して
デザインはユーザ側に任せるほうがユーザのメリットが大きいんだから
お前らそうしろよ。

47 ：Name_Not_Found：04/03/19 21:37 ID:???

自分でスタイルシート用意するのめんどいって人もいると思うんだけど。

48 ：Name_Not_Found：04/03/19 21:41 ID:???

こちらでいいでしょうか?質問です。

del[datetime]:before{
content: "削除 ( "attr(datetime)" ) ";
display:block;
}

以上のようにするとMozillaなどで削除 (いつ何時)といった具合に生成されますが
その生成内容までline-throughされちゃいます。
削除時記は出しておきたいので上にtext-decoration: none !important;
と書いたのですが反映されません。
どうすればいいでしょうか?よろしくお願いします

49 ：Name_Not_Found：04/03/19 21:57 ID:???

>>48
祖先から影響されている装飾線を無効化することはできない。

削除を取消線で表現する慣習にとらわれる必要はないだろう。
例えば前景色をグレイに指定することで表現することも可能だ。

50 ：48：04/03/19 22:18 ID:???

>>49
レスどうも。継承せざるを得ませんか・・
ではおっしゃるように別の表現の方向でやってみます。
ありがとうございました。

51 ：Name_Not_Found：04/03/19 22:57 ID:???

>>50
text-decoration は継承しない。
子孫にも同じ装飾が影響するので、
継承したかのように見えるだけ。

52 ：Name_Not_Found：04/03/20 00:01 ID:???

重複スレがスレストされた模様。

53 ：32：04/03/20 00:59 ID:???

>>33,35 (;´Д｀) MS PGothic,Mona　の様にAA用に適応したいのです
どの環境でも同じフォントとして認識されるのでしょうか？

54 ：Name_Not_Found：04/03/20 01:11 ID:???

どの環境でもって…MSフォントのない環境なんて山のように
あるわけだが。Windows限定ということ？

55 ：Name_Not_Found：04/03/20 01:14 ID:???

そうです

56 ：Name_Not_Found：04/03/20 04:36 ID:???

>53　CSS2に対応したブラウザだったら、とくに問題ないと思う。
font-family: "MS PGothic", sans-serif;
などと指定すればよし。（「MS PGothic」でもちゃんと効く）

そのブラウザで対応しているか確かめたい場合は、
ブラウザの設定でフォントのところをいじってみればよい。
IEだったら、ツール→インターネットオプション→フォントの順に進み、
「Webページフォント」のところを明朝体などにする。
ブラウザを再起動して明朝体で表示された場合は、
何らかの原因で対応していないことになる。

57 ：Name_Not_Found：04/03/20 04:36 ID:???

ＣＳＳって正直無しの方が楽でね？？

58 ：Name_Not_Found：04/03/20 04:38 ID:???

>>57
好み。

59 ：Name_Not_Found：04/03/20 04:38 ID:???

ブラウザを再起動して明朝体で表示された場合
↓
ブラウザを再起動して、「Webページフォント」で設定した通りに表示された場合

60 ：Name_Not_Found：04/03/20 05:48 ID:???

>>57
最初に作るのは大変だけど、作った後の変更は楽だと思う。

61 ：Name_Not_Found：04/03/20 05:48 ID:???

ﾏｼﾞﾚｽｶｯｺｲｲ!!

62 ：Name_Not_Found：04/03/20 10:12 ID:???

お邪魔いたします＆少々お伺いいたします。
ブロック要素のセンターラインと画像のセンターラインを
合わせたい（absmiddleのようなことをしたい）のですが
いい方法はございますでしょうか？

63 ：Name_Not_Found：04/03/20 15:11 ID:aKL101zJ

質問させてください。
配置をする際のpositionの値は皆さん、何を使っておられますか？
自分はabsoluteを使って作ってみたのですが、ページが左揃えになってしまって。。
全てのブロック要素を真ん中に揃えたくて、
Ｑ＆Ａを読んで、ブロック要素をセンタリングする方法も試したのですが、ダメでした。
あと、absoluteを指定してると、floatってのも使えないみたいですし。
やはりabsoluteは使い勝手の悪い値なのでしょうか。

ＯＳはＷＩＮのＸＰ、ブラウザはＩＥの６（とネットスケープの７．１）です。

64 ：Name_Not_Found：04/03/20 15:18 ID:???

>63
static

65 ：63：04/03/20 15:26 ID:???

>>64
staticは、「位置指定を無視し通常の位置に表示」と手持ちの参考書には書いてありますが、
staticでも位置指定は行えるのですか？
もしかして、自分はとてつもない勘違いをしていたのでしょうかね。
とにかく試してみますが。

66 ：Name_Not_Found：04/03/20 15:31 ID:???

>>65
いや、位置指定してないってことだろ。

67 ：Name_Not_Found：04/03/20 16:07 ID:???

absolute　って意味知ってる？
絶対　とか　絶対的
とかいうもので、他の何にも影響されずに
絶対位置に表示されることになる。

レイヤーでいうと、最前面のレイヤーで、
下のものを幾らいじってもこれには影響してこない。

68 ：63：04/03/20 16:43 ID:???

>>67
レスありがとうございます。
absoluteは「ＴＯＰとＬＥＦＴから」の絶対位置を指定する
値ということでいいのでしょうか。
絶対という意味は分っていたのですが。。

ブラウザを最大化して、画面左横にお気に入りなどのスペースを
表示した場合にちょうどいい大きさの左揃えのページを作ったのですが。
それだと左横のスペースを表示しない場合に、ページが左端寄りに
なってしまって不恰好なんですよね。
それで、真ん中揃えにするには、absoluteではダメなのかな、と思った
（気づいた？）のです。

69 ：Name_Not_Found：04/03/20 16:58 ID:???

>>68
「絶対」の意味本当に分かってる？
>absoluteは「ＴＯＰとＬＥＦＴから」の絶対位置を指定する
ともまいさんも書いてるけど、真ん中というのは絶対位置ではない｡
ブラウザのサイズによらず真ん中というのは、「ブラウザのサイズの対して」相対的なもの。

70 ：63：04/03/20 17:10 ID:???

>>69
レスありがとうござます。
relativeを使って、なんとか頑張ってみます。
つか、やっている最中なのですが、また疑問点がでてくるかもです。
とりあえず一旦落ちて、作業の方に集中したいと思います。
本当にわざわざスミマセンでした。

71 ：Name_Not_Found：04/03/20 17:25 ID:???

>68
> ブラウザを最大化して、画面左横にお気に入りなどのスペースを
> 表示した場合にちょうどいい大きさの…

あんまそういう事考えない方が良いよ（´Д`；
解像度なんか人それぞれだし、お気に入りのスペースの大きさも違う。

それに閲覧者は何も指定して無い普通のページを見易いように
調整してるだろうから、
何も指定しないのが一番見易いんじゃないかと。

スレ違いっぽくてゴメンね、同じ事を友人に言われたので（´Д`；

72 ：Name_Not_Found：04/03/20 17:36 ID:???

>>70
おいおいおい。relativeは確かに相対位置を指定するものだけど、
素で(staticで)の位置に対して相対的なもの、だよ。
ブラウザサイズに対して相対的にはならない｡
ていうか、positionから一旦離れた方がよくないか？
>>71のいうとおり、何も指定しないのが一番いいと思うよ｡
何も指定せずにまともに見られるものをまず作って、
そこからCSSで見栄えを整えていくといい。

73 ：63：04/03/20 17:51 ID:???

>>71-72
そうですか。。
なんだかサイト作りのためのＣＳＳであるはずなのに、
ＣＳＳのためのサイト作りになっていたというか、
確かに本末転倒的な気がしないでもありません。
自分のやってることを思い返してみると。

とりあえず一度考えをリセットしてみます。
皆さん、親切にお答えいただいてありがとうございました。

74 ：Name_Not_Found：04/03/20 18:56 ID:???

body { overflow: hidden;}
とやったらスクロールできなくなってしまいました。助けてください。

75 ：Name_Not_Found：04/03/20 19:29 ID:???

>74　何を目的にそんな指定をしたのかわからんが。
hiddenをautoに変更すればよい。
あるいは、指定そのものを削除しても可。

76 ：Name_Not_Found：04/03/20 19:34 ID:???

ありがとうございました。outo西たらうまくいきました。

77 ：Name_Not_Found：04/03/21 02:39 ID:???

>>62
ブロック要素の外に画像があるのか、中にあるのか。
ブロック要素の外なら、同じ行にあるはずないから、floatでも使ってるのか。
とにかく、HTMLとCSSのソースを出してくれないと助言もできませんね。
align="absmiddle"なんてHTML4.1には無い独自拡張だし。

>>63
>Ｑ＆Ａを読んで、ブロック要素をセンタリングする方法も試したのですが、ダメでした。
そんなことはない。ちゃんとやればできるはず。
どうやったらどううまくゆかなかったのか。
ソースを出してくれないと誤りを指摘できませんよ。

78 ：Name_Not_Found：04/03/21 09:59 ID:???

>>45-46ﾜﾛﾀ
>>76 outo西ﾜﾛﾀ

79 ：Name_Not_Found：04/03/21 13:50 ID:???

ページごとにレイアウトが違っているのですが、外部CSS指定する必要はありますか？
メリットは「同じようなデザインの複数ページが、ひとつのCSSファイルから適用できる」というだけですか？

80 ：Name_Not_Found：04/03/21 14:19 ID:???

背景色・文字色・文字サイズなどなど、レイアウト以外に共通のCSS指定があるだろ。

81 ：79：04/03/21 15:14 ID:???

>>80
そういえばそうですね…。大雑把に考えてしまいました。
ありがとうございます。

82 ：Name_Not_Found：04/03/21 16:49 ID:???

>>74
ギャグセンス最高

83 ：63：04/03/21 17:32 ID:???

>>77さん
ソースはＨＴＭＬが、

<link rel="stylesheet" href="top.css" type="text/css">
</head>
<body>

<div style="margin-left:auto;margin-right:auto>
　<div id="contents">
　</div>

　<div id="left">
　<div id="menu">
　</div>
　<div id="mac_logo">
　</div>
　</div>

　<div id="right">
　</div>

</div>

</body>
</html>

84 ：63：04/03/21 17:32 ID:???

cssは、
div {position:absolute}
#left {}

#contents {}

#right {}

#menu {}

#mac_logo {}
で{}内はtop,right,bottom,left,それに
width,height,padding-bottomなどの数値が
入っているものです。

85 ：Name_Not_Found：04/03/21 18:52 ID:???

86 ：Name_Not_Found：04/03/21 19:27 ID:???

>>85
それは何ですか？

87 ：85：04/03/21 19:32 ID:???

つまり、スタイルシートで他のスタイルを無効にできるんですか？
java scriptとかじゃなくて、スタイルシートで。

88 ：Name_Not_Found：04/03/21 19:48 ID:???

>>87
他のスタイルとは何ですか？

89 ：Name_Not_Found：04/03/21 19:52 ID:???

>>85
優先度・上書きの問題と仮定して、下記参照。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cascade.html#cascade
http://hp.vector.co.jp/authors/VA022006/css/cascade.html#cascade

90 ：Name_Not_Found：04/03/21 20:43 ID:xyghWMvi

>>1のFAQにもある、「WinIEでボックス要素をfloat化したときに
次のボックス要素に高さや幅を指定してしまうと2px程度の隙間が
空いてしまうバグ」って、何かquick fix的なしのぎ方はあるのでしょうか？
隙間から覗く親要素のbackgroundを工夫して隙間の見た目を消す、
という方法は思いついたのですが、どうにもエレガントでないので…。

テーブルを使ったデザインなどをfloat要素を使ってCSSベースに
置換していくときにはよく直面する状況だと思うのですが、何か
コツみたいなものがあれば、と思って質問させていただきました。

91 ：Name_Not_Found：04/03/21 23:37 ID:???

>>84
どうして style="margin-left:auto;margin-right:autoはインラインで指定するのか。
なんでdiv{position:absolute;}なんだよ。
position:absoluteを指定したらleft:0;が初期値になるのは知れたこと。これ前スレッド既出。
必要のないdivにまでpositionを指定してはいかん。
そもそもpositionの意味、margin:auto;の意味、わかってないのかな。

92 ：Name_Not_Found：04/03/21 23:44 ID:???

>>90
これか。
http://cssbug.at.infoseek.co.jp/detail/winie/b054.html

div囲みとか。
<div style="float:left; width:50px; height:50px; border:2px solid blue;"></div>
<div><div style="height:25px; border:2px solid red;"></div></div>

93 ：Name_Not_Found：04/03/22 02:14 ID:???

>>84
position:absolute; は left:*; (もしくは right:*; ) , top:*; (もしくはbottom:*;) と併せて使うってことくらいリファに載ってるはず。
本の一冊くらいケチらず買おーよ…。

>>91
大変だろうけどｶﾞﾝｶﾞﾚ。影ながら応援してるぞっ(`・ω・´)

94 ：Name_Not_Found：04/03/22 02:25 ID:???

>>93
>position:absolute; は left:*; (もしくは right:*; ) , top:*; (もしくはbottom:*;) と併せて使う

いや、それ位はいくら>>84でもわかってるさ。
>で{}内はtop,right,bottom,left,それに

もっとも、position:absolute;の意味はわかってないみたいだがね。
#left, #contents, ... {position:absolute;}と指定する智慧も無かったらしいし。

95 ：Name_Not_Found：04/03/22 05:34 ID:???

複数のインライン要素（たとえばli id=1,2,3をdisplay: inline化したもの）を
画面の広さ分にわたって均等割付するにはどうすればいいのでしょう？
右下隅に進むボタン、真ん中にナントカボタン、左下隅に戻るボタン、という風に
レイアウトしたかったのでtext-align: justifyとtext-justifyを試してみましたが
だめでした…。

96 ：Name_Not_Found：04/03/22 05:44 ID:???

>>95　新規質問は上げよう。
text-justifyの値は何を指定したのか書いて。それにWinIE5以降しか効かないよ。
display: inline;でなくfloat:left;とfloat:right;を使ったらどうか。

97 ：Name_Not_Found：04/03/22 08:25 ID:???

>>95
それ、フロートの方がたやすくない？

98 ：Name_Not_Found：04/03/22 08:58 ID:???

>>96-97
どもサジェスチョンありがとうございます。floatでもやってみましたが
要素が増えていったときにもcss/htmlを大規模に修正する手戻りなしで
そのまま均等距離にボタンが増やせるようにできるといーなーと思って…。

text-justifyにはdistributeやらdistribute-all-linesやらを指定してみました。
IE6とSafariで検証してたんですが、そうか、Safariはそもそも未対応
なんですねぇ。

99 ：Name_Not_Found：04/03/22 09:01 ID:???

>>98
ようするに、そういう激しくダサいデザインをしようと思わないことが最善ってことか。

100 ：Name_Not_Found：04/03/22 09:10 ID:???

一言多いよ。>>99

101 ：Name_Not_Found：04/03/22 09:11 ID:???

>>100
気づかない所為で苦労してるなら、それを示唆するのも優しさ

102 ：Name_Not_Found：04/03/22 09:12 ID:???

>>99　そんなの別によくあるデザインだろ。

103 ：Name_Not_Found：04/03/22 09:15 ID:???

>>102
あろうがあるまいが、そんな「知恵の到達していない次元のこと」を「出来もしないくせに無理までして」やりたいと望むほどのデザインじゃないじゃん。
むしろクソ。ダサいし。

104 ：Name_Not_Found：04/03/22 09:18 ID:???

どうでもいいけど、必死になるほどのデザインじゃないだろ。
出来る範囲でやる、で不満なら知識蓄えればいいだろうが、って思うけど菜。

105 ：Name_Not_Found：04/03/22 09:22 ID:???

>>103-104
イソップ寓話を想起してしまった。あの葡萄は酸っぱい――てか。

106 ：Name_Not_Found：04/03/22 09:30 ID:???

>>105
いや、漏れは独学で実現してるから。
「できなーい。でも、（勉強する気はないけど）やりたーい」バカを相手にするスレだっけ？ここ

107 ：Name_Not_Found：04/03/22 09:36 ID:???

>>98はfloatでもやってみたと言ってるのだが。できないわけではあるまい。
要素が増えた場合、>>106はどんな方法で実現するのか？

108 ：Name_Not_Found：04/03/22 09:43 ID:???

>>107
バカ？　「ダサいデザインなので、しない」が正論だ、って言ってるんだけど。
文盲は逝ってよね。ほんとに気持ち悪いから。

＞そのまま均等距離にボタンが増やせるように
　そもそも均等云々なんて気にしてるあたりがキモイ。それぞれの要素の幅が等しけりゃ問題ないわけじゃん。
こいつ結局「センタリング厨」だろ。

109 ：Name_Not_Found：04/03/22 09:45 ID:???

デザインの善し悪しは一旦棚上げにして訊きたい。
要素が増えた場合、>>106はどんな方法で「実現」するのか。
できるんだろ？

110 ：Name_Not_Found：04/03/22 09:48 ID:???

>>106　イケてるとかダサいとか議論するスレッドだっけ、ここ？

111 ：Name_Not_Found：04/03/22 09:49 ID:???

>>109
だから文盲は嫌いなんだよ。
「あの葡萄は酸っぱい」の意味分かってる？
人間が数人でもいいから集まるところにでも行って会話とかしたほうがいいよ。

112 ：Name_Not_Found：04/03/22 09:49 ID:???

>>110
自分でできないことをﾋﾄに教わるｽﾚでもないわけで。

113 ：Name_Not_Found：04/03/22 09:50 ID:???

（´-`）.｡oO（イケてるとかダサいとか議論はどこにあるのでつか？

114 ：Name_Not_Found：04/03/22 09:50 ID:???

>>112
おいおい、それこそ質問スレッドの本旨ではないのか？

115 ：Name_Not_Found：04/03/22 09:52 ID:???

>>111
葡萄は酸っぱいの意味なんてどうでもいいから、
>>106がどうやって「実現」するのかご教示いただきたいと思った。

116 ：Name_Not_Found：04/03/22 09:52 ID:???

>>114
「やってみたけどできなかった」と「こんな（とちくるった）デザインやりたいからやり方教えろ」は同じなの？
こういうバカが別のバカを助長してるんだよ。（まあ、回答が欲しい本人様なんだろうけど）

117 ：Name_Not_Found：04/03/22 09:53 ID:???

>>115
どうやって「実現」するのかなんてどうでもいいから、
人間が数人でもいいから集まるところにでも行って会話とかしたほうがいいと思った。

118 ：Name_Not_Found：04/03/22 09:53 ID:???

たぶん>>111も意味を誤解してるね。

119 ：Name_Not_Found：04/03/22 09:53 ID:???

>>115
そうやってやり方教えてもらおうとしても無駄

120 ：Name_Not_Found：04/03/22 09:54 ID:???

>>118
まあ、一番誤解してるのはお前なんだが

121 ：Name_Not_Found：04/03/22 09:56 ID:???

>>118
誤解してるかどうかなんてどうでもいいから、
葡萄は酸っぱいの意味をご教示いただきたいと思った。

122 ：Name_Not_Found：04/03/22 09:57 ID:???

>>116
よくわからんな。
「やってみたけどできなかった」、だから「やりたいからやり方教えろ」。
……これって「自分でできないことをﾋﾄに教わる」のと何が異なるの？

123 ：Name_Not_Found：04/03/22 10:00 ID:???

>>122
　わからんならお前が懇切丁寧に教えてやればいいよ。
教えてる最中に漏れの言ってる意味が分かるから。

124 ：Name_Not_Found：04/03/22 10:00 ID:???

http://www.asahi-net.or.jp/~mf4n-nmr/kotoba4.html
6. 酸っぱいブドウ（イソップ）
欲しいものの入手に失敗したとき「あんなのしょうもない、酸っぱい葡萄や」と言ってあっさりあきらめることが多い。

125 ：Name_Not_Found：04/03/22 10:01 ID:???

>>124
欲しくなけりゃ酸っぱくもねえし、
欲しいものはそんなデザインじゃねえ、ってこった。

引用ご苦労

126 ：Name_Not_Found：04/03/22 10:03 ID:???

>>123
は？　>>116の言ってるのはどっちにしろ「自分でできないことをﾋﾄに教わる」にしか受け取れないんだけど。
日本語ヘンかな。

127 ：Name_Not_Found：04/03/22 10:04 ID:???

結局誰もわかんねえから俺の知恵を借りたい、ってことだろ？
バカみてえに煽ってねえで素直に懇願すりゃいいのによ。バカにもほどがあるぜ。

128 ：Name_Not_Found：04/03/22 10:05 ID:???

>>126
言葉尻か。矮小な人間のやりそうなことだ。
やろうとしてできない、とやりたい教えろは違う、すら理解も出来んのか。つまらんガキだ。

129 ：Name_Not_Found：04/03/22 10:06 ID:???

http://www.asahi-net.or.jp/~mf4n-nmr/kotoba4.html
このことばは、取ろうとして取れなかったブドウを「あれは酸っぱいブドウ
だ」と言ってあきらめたイソップ物語に出てくる狐の話に由来する。このよ
うに自分に不都合なことが起こると、自分の都合のいいように理由づけをし
て、正当化してしまうことを心理学では「合理化」と呼んでいる。

130 ：Name_Not_Found：04/03/22 10:07 ID:???

>>128
ところでそもそも>>98を見ると「やろうとしてできな」かったみたいだが？

131 ：Name_Not_Found：04/03/22 10:08 ID:???

>>129
＞このよ
うに自分に不都合なことが起こると、自分の都合のいいように理由づけをし
て、正当化してしまうことを心理学では「合理化」と呼んでいる。

繋がってないけど。
「欲しい」のに「欲しくない」という前提を無視してこの言葉を使うのは、おかしいよ。もうちょっと勉強してみたら？　ほんのもうちょっとだけでいいから。

132 ：Name_Not_Found：04/03/22 10:08 ID:???

>>130
そんなに>>98ﾏﾝｾｰしてえならてめえがおしえてやれよ。
俺に頼りたいならいちいち煽るな。

133 ：Name_Not_Found：04/03/22 10:10 ID:???

（´-`）.｡oO（結局>>98は回答をもらえませんでしたとさ

134 ：Name_Not_Found：04/03/22 10:11 ID:???

よくあるよね、ウィンドウの真ん中に表示させたいって質問すると、
やり方を示すのが面倒だから、そんなデザイン無意味とか話をそらす奴。

135 ：Name_Not_Found：04/03/22 10:12 ID:???

>>129の言い分だと、
「おまえは食いしん坊だなあ」
「成長期なんだもん」
「「葡萄は酸っぱい」だな」
ってことになる。

136 ：Name_Not_Found：04/03/22 10:13 ID:???

>>134
　>>4

137 ：Name_Not_Found：04/03/22 10:13 ID:???

>>132
>俺に頼りたいなら

あんた誰？

138 ：Name_Not_Found：04/03/22 10:14 ID:???

よくいるよね、教えて欲しいだけの分際で、
「やり方を示すのが面倒だからだ」とか煽る香具師

139 ：Name_Not_Found：04/03/22 10:14 ID:???

>>136
　>>8

140 ：Name_Not_Found：04/03/22 10:15 ID:???

>>137
お前には関係ない人だヨ。一生気にかける必要もない。
つかお前、俺に興味示しすぎ。キモイ。

141 ：Name_Not_Found：04/03/22 10:15 ID:???

（´-`）.｡oO（結局>>98は回答をもらえませんでしたとさ

142 ：Name_Not_Found：04/03/22 10:15 ID:???

>>136
http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm
そもそも、「縦横中央」を実現することによって誰が利益を得ますか。
著者の自己満足ですか。ユーザにとっては、どうでもいいことです。
「縦横中央」に執着せずに、もっと広い視野でウェブデザインを考えて下さい。

143 ：Name_Not_Found：04/03/22 10:19 ID:???

酸っぱいブドウてのは、何か目的がある場合、それを達成する価値の無いものと見做すことで抛棄すること、だろ。

144 ：Name_Not_Found：04/03/22 10:20 ID:???

>>142
その通り

145 ：Name_Not_Found：04/03/22 10:20 ID:???

>>143
じゃあそう思っててくださいな

146 ：Name_Not_Found：04/03/22 10:21 ID:???

で、デザインの善し悪しを議論するスレッドだっけ、ここ？

147 ：98：04/03/22 10:23 ID:???

うひゃー。すごいことになってる。すみません。

均等割付であれこれ試行錯誤してたのは、知り合いに
「できるだけ解像度耐性の高いwebを作ってくれー」って
頼まれて、fontサイズの増減やウインドウサイズの変更を
受けても基本的に配置領域内の各要素が同じような位置に
あるようにしたかった、というのが一番の理由でした。
この仕様通りだと両端以外のボタンは要素の増減により
movable target的な挙動をしてしまうことになるので
あまり筋がよくないUIかなぁという気も確かにしますが…

もうちょっと考えてみます。ヒントくれたみなさん
ありがとうございました。

148 ：Name_Not_Found：04/03/22 10:24 ID:???

>>140　単にレス番号を挙げればいいだけでは？　自意識過剰だよ。

149 ：Name_Not_Found：04/03/22 10:30 ID:???

>>148
まだ俺に粘着するのか。しつこいから嫌い。

150 ：Name_Not_Found：04/03/22 10:30 ID:???

自意識過剰↑

151 ：Name_Not_Found：04/03/22 10:34 ID:???

>>148
> >>140　単にレス番号を挙げればいいだけでは？
　漏れは>>149　これでマンゾク？　しつこいよ。

>>150
　お前まで相手にするつもりはない。　いわゆるストーカーってやつか？

152 ：Name_Not_Found：04/03/22 10:34 ID:???

いきがって他人を罵りたいお年頃なんだよ、きっと。

153 ：Name_Not_Found：04/03/22 10:36 ID:???

プラス被害妄想だな。みんなが俺を気にしてるぅ、てね。

154 ：Name_Not_Found：04/03/22 10:37 ID:???

>>152
だろうな。この粘着ストーカーっぷりは見るに耐えかねる。
で、>>98はお前が答えろよ。ちょーしこいて出てきたんだからよ。

155 ：Name_Not_Found：04/03/22 10:37 ID:???

>>153
イソップ寓話を想起してしまった。あの葡萄は酸っぱい――てか。

156 ：Name_Not_Found：04/03/22 10:40 ID:???

折角だがうまく意味が通じてないな。>>155

157 ：Name_Not_Found：04/03/22 10:41 ID:???

>>154　俺にはできないからお前やれ、か。やれやれ。

158 ：Name_Not_Found：04/03/22 10:41 ID:???

>>156
みんなが気にしてる人が羨ましいけど、それを蔑むことで自尊心を守る、ってことでしょ。

159 ：Name_Not_Found：04/03/22 10:41 ID:???

>>157
できないのか(ﾌﾟｹﾞﾗ

160 ：Name_Not_Found：04/03/22 10:42 ID:???

>>155
ふむ、どれが葡萄なのかな？

161 ：Name_Not_Found：04/03/22 10:45 ID:???

>>158
みんなが……って、誰も気にしてないだろ。その解釈、無理があるよ。

162 ：Name_Not_Found：04/03/22 10:45 ID:???

>>160
>>158読んで理解できないのか。ハッピーな脳みそだね。

163 ：Name_Not_Found：04/03/22 10:46 ID:???

>>161
少なくともあんたが気にしてるし。
つまり、みんなが放っておけない彼（彼女？）がにくい！ってことなんだろ。

164 ：Name_Not_Found：04/03/22 10:46 ID:???

>>159
間接話法って知ってるか？

165 ：Name_Not_Found：04/03/22 10:47 ID:???

>>164
股関節とか鳴らして話するアレだろ？

166 ：Name_Not_Found：04/03/22 10:48 ID:???

>>163
ン、誰が気にしてるって？
それに、かりに誰かさんが気にしてたとして、それが「みんなが放っておけない」になるのかいな。

167 ：Name_Not_Found：04/03/22 10:49 ID:???

>>166
え？　じゃあ反応してるの全部おまえ？

168 ：Name_Not_Found：04/03/22 10:50 ID:???

もう何だか、意味わからん。

169 ：Name_Not_Found：04/03/22 10:50 ID:???

スレ違い。つかいい加減にしろ

170 ：Name_Not_Found：04/03/22 10:52 ID:???

大漁でした。

171 ：98：04/03/22 11:02 ID:???

>>165
筒井康隆だ。なつかしー

172 ：Name_Not_Found：04/03/22 11:03 ID:???

>>171
知っててくれて嬉しいが、よりによって貴様とは！

173 ：Name_Not_Found：04/03/22 12:36 ID:???

はい、それでは何事も無かったかのように
「CSS・スタイルシート質問スレッド」をお楽しみ下さい。

174 ：Name_Not_Found：04/03/22 12:38 ID:???

質問です。
スタイルシートで、文字の色を変えるにはどうしたらいいですか？
教えてください

175 ：Name_Not_Found：04/03/22 12:58 ID:???

(　´Д｀)ばーろ

176 ：Name_Not_Found：04/03/22 13:02 ID:???

もうそんな時期か

177 ：Name_Not_Found：04/03/22 13:55 ID:???

どのスレにも春厨が大量発生しております！！

178 ：Name_Not_Found：04/03/22 14:03 ID:???

メール欄で話すのもいいけど、sageろよ。

179 ：Name_Not_Found：04/03/22 14:08 ID:yFPfpg0M

　<body>
　　<h1>～</h1>
　　<div class="contents">
　　　～
　　</div>
　　<div class="menu">
　　　～
　　</div>
　　<address>～</address>
　</body>
こんな感じのhtmlがあるとして、これを
+---------------+
| h1要素
+----+----------+
|div.　 | div.
|menu| contents
+----+----------+
| address要素
+---------------+
このように表示したいです。そこで
div.menu{
　position: absolute;
　left: 0;
　top: 2em;
　width: 10em;
}
div.contents{
　margin-left: 11em;
}
こんなスタイルを適用すると、div.contentsがdiv.menuよりも下方向に長くなる際は
ちゃんとできるのですが、短くなる際にdiv.menuとaddressが重なってしまいます。
どうしたらよいでしょう？

180 ：Name_Not_Found：04/03/22 14:29 ID:???

div.menu {
width: 20%;
float: left;
border-width: 1px;
border-color: #999999;
border-style: solid;
}
div.contents {
width: 70%;
float: left;
border-width: 1px;
border-color: #999999;
border-style: solid;
}
div.address {
width: 90%;
clear: left;
}

　<body>
　　<h1>～</h1>
　　<div class="contents">
　　　～
　　</div>
　　<div class="menu">
　　　～
　　</div>
　　<div class="address">
　　 <address>～</address>
　　</div>
　</body>
こんな感じじゃ駄目?

181 ：179：04/03/22 14:50 ID:???

>>180
これだと、menuのwidthはパーセント指定じゃなきゃダメですよね・・・
それは仕方ない事なのでしょうか。

関連質問。
address{
　position: absolute;
　bottom: 1px;
}

とした場合、ページまたは親要素の下端にくっつくのではなく、
その瞬間のウィンドウの下端に来てしまいます（IE6で確認）。
これって仕様どおりなのでしょうか？ページを上下にスクロールさせると
address要素もそのおかしな位置のままスクロールされてしまうし、
ウィンドウのサイズを変えたときだけもう一度再描画される。
こんなの使い道があるとは思えません。

182 ：Name_Not_Found：04/03/22 15:02 ID:???

>>181
＞これだと、menuのwidthはパーセント指定じゃなきゃダメですよね・・・
パーセンテージ指定でなくてもいいですよ。

＞これって仕様どおりなのでしょうか？
仕様通りです。

183 ：179=181：04/03/22 15:26 ID:???

>>182
たとえばmenuのwidthを200pxってやった場合、
contentsの方のwidthはなんて指定すればいいんですか？
「ウィンドウの幅 - 200px」みたいな指定ができれば最高なんですが。

184 ：Name_Not_Found：04/03/22 15:32 ID:???

>>183
widthは指定せずに、
margin-left:menuの幅プラスアルファ;であなたの理想になるかと。

185 ：Name_Not_Found：04/03/22 15:47 ID:???

>>184に追記。
floatも指定しない。
プラスアルファ＝menuのパディングとかボーダーの分。

186 ：Name_Not_Found：04/03/22 21:03 ID:???

<div class="menu">～</div>にあるリンクとして、
A:active.menu
A.menu:active

どちらの記述が正しいのですか？

187 ：56：04/03/22 21:11 ID:???

>>186
どちらでも構わないが、後者の方が一般的。
>単純セレクタ（simple selector）とはタイプセレクタあるいは全称セレクタのことを指し、ゼロ個以上の属性セレクタ、一意セレクタ、疑似クラスが任意の順序で続く。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/selector.html#q2

188 ：Name_Not_Found：04/03/22 22:01 ID:???

div.menu a:active
のように思えるのは私の間違いですか？

189 ：Name_Not_Found：04/03/22 22:08 ID:???

以下のサンプルソースのように高さの違うボックスを float:left で並べた時に，
横にふたつまで並ぶようにウィンドウサイズを調節すると，BOX3 が BOX1 ではなく BOX2 の下に来ますよね．

このようなレイアウトで，どのボックスがどのくらいの高さになるか予想できない場合に，
BOX3 がうまく BOX1 の下に来てくれる方法ってないものでしょうか．

途中で clear:left すると，当然そこで並んでくれますが，
ボックスの横幅は固定で画面サイズのある限り横に並んでくれて，
かつ縦にもぴしっと揃ってほしいなぁ……というわけなのですが．

何かアドバイスいただけるとありがたいです．

----------- サンプルソース -----------

<style>
.box
{
border: solid;
float: left;
margin: 20em;
width: ;
}
</style>

<div class="box" style="height:6em"> BOX1 </div>
<div class="box" style="height:5em"> BOX2 </div>
<div class="box" style="height:5em"> BOX3 </div>
<div class="box" style="height:5em"> BOX4 </div>
<div class="box" style="height:5em"> BOX5 </div>

----------- サンプルソース -----------

190 ：Name_Not_Found：04/03/23 06:18 ID:???

>>189
>途中で clear:left すると，当然そこで並んでくれますが，
いやIEとOperaではなりません。バグですが。
　先行するフロートの上方に後続のフロートが置かれる
　　http://cssbug.at.infoseek.co.jp/detail/winie/b093.html
　　http://cssbug.at.infoseek.co.jp/detail/opera/b044.html

191 ：Name_Not_Found：04/03/23 06:26 ID:???

>>189
誰かさんがこんなこと言ってくるヨカン……

99 ：Name_Not_Found ：04/03/22 09:01 ID:???
>>98
ようするに、そういう激しくダサいデザインをしようと思わないことが最善ってことか。

↑酸っぱいブドウ

192 ：Name_Not_Found：04/03/23 07:12 ID:oZKpwyjx

<ul>でインデントされる幅を変更することは可能でしょうか？

193 ：Name_Not_Found：04/03/23 07:18 ID:???

可能です。

http://is.vis.ne.jp/lab/ua_default_css/index.xhtml
ol, u
margin-left, padding-left
Windows版IE, Opera のデフォルトスタイルでは、左マージンが 40ピクセル。
Mac版IE のデフォルトスタイルでは、左マージンが 2.5em。
Netscape のデフォルトスタイルでは、左パディングが 40ピクセル。

194 ：Name_Not_Found：04/03/23 07:36 ID:???

HTML 4.0におけるスタイルシートの例
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/sample.html
OL, DL, DIR,
MENU { margin: 1.33em 0 }

195 ：Name_Not_Found：04/03/23 09:49 ID:???

>>191
だから文盲は嫌いなんだよ。
「あの葡萄は酸っぱい」の意味分かってる？
人間が数人でもいいから集まるところにでも行って会話とかしたほうがいいよ。

196 ：Name_Not_Found：04/03/23 10:19 ID:???

で、>>189に回答できる人～？

197 ：Name_Not_Found：04/03/23 13:58 ID:???

>>189
無理だと思う。CSSの仕様上。

198 ：189：04/03/23 14:55 ID:???

>>197
やぱ無理ですかね……
CSS の色々を見回しても，この欲しい高さを算出できる基準となる値がどこにもないですね．
height とかに「id=hoge の height」なんて指定が出来ればｻｲｺｰなんですが（IE だと出来るみたいだけど）

ひとまず height に「たぶんどのボックスでも入るだろう適当な高さ」を指定して誤魔化しています．
今のページだと，すごい長い名前の人がすごい長い住所に住んでるとアウトです(w

199 ：Name_Not_Found：04/03/23 17:40 ID:???

>>198
＞すごい長い名前の人がすごい長い住所に住んでるとアウトです(w

京都市民が出てこないことを祈れｗ

200 ：Name_Not_Found：04/03/23 20:18 ID:alCLWVzI

まだ初心者なんですが、cssで作ったbox中に、番号付きリストつくると、番号がでないんですが？どうすればよいのでしょうか？自分が持ってる辞典には載ってないので、お願いします。

201 ：Name_Not_Found：04/03/23 20:27 ID:alCLWVzI

200ですが、ソースは cssは .list { float:left; width:250px; padding:5px; } それで <ol class="list"> <li>あいうえお</li> <li>かきくけこ</li> <li>さしすせそ</li> </ol> って、やってるんですが。ご指導ねがいます。

202 ：Name_Not_Found：04/03/23 20:28 ID:???

>>200
それが再現するソース貼れ。

203 ：Name_Not_Found：04/03/23 20:43 ID:???

>>201
ぐはぁ。遅かった。
表示確認したブラウザも書いた方がベター。

paddingが小さくて番号が画面からはみ出していると思われ。
padding大きくするか　list-style-position:inside;　にでも汁。　

204 ：Name_Not_Found：04/03/23 21:07 ID:???

指定したクラスのテーブルにあるAタグのリンクにマウスを当てると色が変わるようにするにはどうすれば良いのでしょうか？

a:hover.a{ background-color:blue; }
これをclass="a"のテーブルのみに反映させたいのですが、この場合、クラス指定はAタグにしかつけれません。
(<table class="a">は不可能、<a class="a">は可能)
どのように組めばできるのでしょうか？それとも、元々できないのでしょうか？

205 ：Name_Not_Found：04/03/23 21:19 ID:???

>>204
子孫セレクタ

206 ：Name_Not_Found：04/03/23 21:19 ID:???

>204　table.a a:hover
class名を「a」とするのはおすすめしない。
（ここに書くためだけの便宜であれば問題ないけれど）

207 ：Name_Not_Found：04/03/23 21:27 ID:???

>>204
classの値がaであるa要素の擬似クラス:hoverは、
a.a:hover{background-color:blue;}

208 ：Name_Not_Found：04/03/23 21:29 ID:???

>>205-207
ありがとうございました。全く問題無く動作しました。
classをaにしたのは>>206さんの言うとおりで、あくまでここに書くための便宜でした。紛らわしくてごめんなさい。

209 ：Name_Not_Found：04/03/23 21:35 ID:alCLWVzI

>>203 できました！ありがとうございます。リストのpaddingって内容からの位置なんですね。勉強になりました。list-style-positionは普通に知らなかった。まだまだ勉強です。とりあえず、padding増やしてやります。ちなみに確認は、IE6です。

210 ：207：04/03/23 21:35 ID:???

どっちでもいいはずと思いながら途中で書きこんで、失敗。

211 ：Name_Not_Found：04/03/23 21:55 ID:E1uM2i8E

bodyに背景を表示させてそのうえに

div.text1{
background-color: #333333;
filter: Alpha(opacity=60);
}

としたDIV要素をおいたんですけど、背景画像が半透過されず、完全に#333の色になってしまいます。
どうすればできるんでしょうか？

212 ：：04/03/24 03:01 ID:???

環境を書け。てかfilterはIEでしか効かないだろ。

213 ：Name_Not_Found：04/03/24 04:35 ID:???

初心者ｽﾚの466へ　一応貼っておく
cssの擬似フレームな
http://www.fromdfj.net/html/overflow.html

214 ：63：04/03/24 06:06 ID:???

>>91 >>93 >>94
すいません、レスするのがかなり遅れてしまいましたが、
皆さんのおかげでなんとかなりそうです。
ありがとうございました。

215 ：Name_Not_Found：04/03/24 07:38 ID:???

>>211
positionか何かを指定しなきゃダメなんじゃね？

ただ、ここの住人は（オレも含め）独自拡張に冷たい。

216 ：211：04/03/24 10:09 ID:???

フィルターってIE独自拡張だったんですか！？
知らなかった・・・OTL

使うのやめますｗ

217 ：Name_Not_Found：04/03/24 11:19 ID:???

タイムリーに、Mozilla 1.7b で opacity に対応したという話題が。

……でも使うのやめるを推奨(w

218 ：Name_Not_Found：04/03/24 15:48 ID:???

<td>の表示について質問です。

<td>の中の要素が長い場合、要素の文字列を全て表示するために、セルの横幅が
広がったり、行折り返しになってセルの上下の幅が広がったりします。

これを、セルが広がったり、内容が折り返されたりせず、規定のセルのサイズのままの
固定にしたいのです。表示できなかった内容は、他のセルの下に隠れるようにしたいのです。
どうしたらよいでしょうか？

今は、
<table sytle='table-layout: fixed>
…
<td nowrap style='word-break: keep-all'> ○○○○○○ </td>

としています。ほとんどの場合うまくいくのですが、表示内容にカッコが出現する場合、
そこで強制的に折り返されてしまうのです。

<tr>の高さを固定にすればうまくいくかと思いましたが、<td height='30px'>などとしても
縦に広がってしまいます。

対応ブラウザは IE のみで、5.5 以降です。
Mozilla ならうまくいくようで、残念なのですが。

219 ：Name_Not_Found：04/03/24 18:07 ID:???

overflow使えない？

220 ：Name_Not_Found：04/03/24 18:51 ID:M/FEyrFL

<div class="unko">
<h2 style='border-left:2px solid #339933; border-bottom:1px solid #339933;background-color:#ccffcc;'>
<a name="tracks" style="color:#000000">うんこ</a></h2>
<span id="unko"><img src="unko.gif" alt="unko" width=100 height=100 align="left"><p>あほあほあほあほあほあほあほ</p></span>
</div>

とすると「あほあほあほあほあほあほ」が改行されずに表示されます。
ボックスに合わせて改行させるにはどうすればいいでしょうか。

221 ：Name_Not_Found：04/03/24 18:58 ID:???

>>220
まずHTMLを覚えようね。

222 ：Name_Not_Found：04/03/24 19:23 ID:???

>>221
すみません。実際「あほあほ・・・」と書いていたところを
「jfalksdfjlwfj」という半角文字で書いていたのが原因だったようです。
全角文字を入力すると問題なく改行されました。

223 ：218：04/03/24 20:44 ID:???

>>219
ありがとうございます。
overflow:hidden としてみましたが、目的にかないませんでした。

というのも、すみませんが実は、先に書いた内容は一部、間違っていたのです。

<td height='30px'> とすると、実は行の上下の幅は広がらなくなりました。
しかし、セルの中身が改行されてしまい、内容の上下が切れてしまうのです。

望ましい表示は、中身が折り返されずに1行で表示され、内容の後半が右側の
境界線で隠れるような状態なのです。

どなたか、良い方法をご存知ではありませんか？

224 ：Name_Not_Found：04/03/24 21:22 ID:i5KEBhzy

すみません、質問です。
よくホームページのイラストの一部にリンクが張られているものがあるのですが、
（一部というのは1枚絵イラストの中の背景の星だけなど、一部範囲のこと）
どのような仕組みになっているのでしょうか？
スタイルシートと関係ないことだったらすみません。
分かる方は詳細を教えていただけると嬉しいです。

225 ：Name_Not_Found：04/03/24 21:23 ID:???

sage忘れました…。

226 ：Name_Not_Found：04/03/24 21:35 ID:???

>224
CSSとは無関係です
とりあえずこっちへどうぞ
ttp://www.google.co.jp/search?hl=ja&ie=UTF-8&oe=UTF-8&q=%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%83%9E%E3%83%83%E3%83%97+%E3%83%AA%E3%83%B3%E3%82%AF+%E6%96%B9%E6%B3%95&lr=

227 ：Name_Not_Found：04/03/24 21:35 ID:???

>>224
イメージマップですね。
http://www.tg.rim.or.jp/~hexane/ach/awht/awht01.htm

228 ：Name_Not_Found：04/03/25 00:04 ID:???

>223　overflow-x :hiddenではどうか？

229 ：おこがましいのですが：04/03/25 00:46 ID:???

>>223
藻れは初心者なので人に教えるどころではないのだが
面白そうなので、ちょっとやってみた

<style TYPE="text/css">

</style>

<table width="400" height="20" border="1">
<tr><td width="200"><div class="hoge">なんでこうなるのか
はわからないが、とにかくやってみよう</div></td>
<td width="200"><div class="hoge">ほげ</div></td></tr>
</table>

Mac OS8.6+IE5.1.7 or Mozilla1.0.1では<td>の中の文でtdをはみだした
部分は途中で切れて表示されない。

まちがっていたらすまんのだが・・・

230 ：Name_Not_Found：04/03/25 00:59 ID:???

>>226 >>227
ご丁寧にありがとうございます。
出来ればイメージマップについて質問できるスレッドは無いでしょうか？
教えて君で申し訳無いです…。

231 ：223：04/03/25 01:31 ID:???

>>228
overflow-x も、overflow と結果は同じでした。セル右端で折り返されてしまいます。

>>229
これもやはり折り返されています。
そのままでは分かりませんが、style を height:30px とすれば分かります。
今回の案件は、セル上下の境界と、内部の文言の間に、空白を必要とするので、
このやり方が使えないのです。

もともと IE では、 word-break:keep-all を使うことで、ほとんどの場合
折り返しを抑制できるわけですが、
今回の案件は、文言にカッコが含まれていて、そこでどうしても折り返されて
しまうのです。

やはり無理なのでしょうか…。

232 ：Name_Not_Found：04/03/25 01:33 ID:???

cssとあまり関係がないかもしれないのですが質問です
どの環境にもほぼ確実にあるfont(英数)を羅列してください
(font-family弄りの参考にしたい)

233 ：Name_Not_Found：04/03/25 01:44 ID:???

>>230
Webサイト制作初心者用スレ Vol.86
http://pc2.2ch.net/test/read.cgi/hp/1079712912/l20

234 ：223：04/03/25 01:47 ID:???

補足です。
<td> に、padding: 5px -100px 5px 0px と指定してみても、やはり折り返されて
しまいました。

235 ：Name_Not_Found：04/03/25 04:23 ID:???

>234　何を目的にそうしたいのか書いてみるとよいかも。
tdの中に書く必要がなければ、別の解決策も考えられる。

236 ：Name_Not_Found：04/03/25 04:44 ID:???

>>232
http://aor.ktplan.jp/fonts/allfonts.html

237 ：223：04/03/25 09:22 ID:???

>>235
目的ですか…。
e コマースサイトの、商材の検索結果の表示です。
仕様は別の社で決められたので、目的はうちではよく分からないのです。
以下は推測ですが、

商材の種類も、各商材について一行に表示すべき項目の数も多いので、
全体の見た目を崩さないよう、小さなセルにたくさんの文字を表示させたい、
隠れた文字については、範囲選択してコピペすればすべての文字を確認できるし、
専門的な商材であり、顧客も専門業者なので、文字列の前半だけでも顧客には
ある程度、内容は推定できるだろう、ということなのだろうと思います。

どうしてもダメなら、セルの中での折り返しは避けられない、と相手先に
交渉するつもりです。

238 ：Name_Not_Found：04/03/25 12:26 ID:???

求めているのとは違うと思うが、
IE6の独自拡張でtext-overflowプロパティがあるらしい

239 ：223：04/03/25 13:08 ID:???

>>238
ありがたいですが、やはり違うようです。
overflow した部分をどう処理するかではなく、
折り返さずに表示させることが目的なので。

ちなみに、
white-space:pre;
white-space:nowrap;
も試してみましたが、ダメでした…。

240 ：Name_Not_Found：04/03/25 13:18 ID:???

もうそこだけは <td nowrap> でいいんんじゃないの？
無理に CSS だけでやらんでも。

241 ：223：04/03/25 13:22 ID:???

>>240
実は、<td nowrap> はすでに指定しております。
<td nowrap> と word-break:keep-all を併用しているのです。
そうしないと、望ましい結果に近づかないのです…。

242 ：Name_Not_Found：04/03/25 13:48 ID:???

div厨モードで。

<td nowrap><div>商品名みたいなあれ</div></td>

/* CSS */
td div { width:5em; overflow:hidden/*autoでも良くない？*/;}

243 ：Name_Not_Found：04/03/29 08:56 ID:???

pc5(ﾟ∀ﾟ)

244 ：Name_Not_Found：04/03/29 10:13 ID:???

質問どうぞ

245 ：Name_Not_Found：04/03/29 12:38 ID:???

ﾃｽﾄ

246 ：Name_Not_Found：04/03/29 12:39 ID:???

ﾃｽﾄ

247 ：Name_Not_Found：04/03/29 12:43 ID:???

test

248 ：245=246=247：04/03/29 12:53 ID:???

すまん、MacMoeからだとうまく書込めないと思って
3回もしてもうた
もじらで見たら書込まれてた、鬱だ氏んでくる

249 ：Name_Not_Found：04/03/29 13:10 ID:???

こんにちは

250 ：Name_Not_Found：04/03/29 13:13 ID:???

>>240-242
おいおい、CSSなら white-space:nowrap; だろが。

251 ：Name_Not_Found：04/03/29 13:24 ID:???

243 名前：223 sage 投稿日：04/03/25 14:21 ID:???
>>242
ありがとうございます！うまくいきそうです！

<td> と <div> の入れ子は、すでに >>229 さんに提案していただいていたのですが、
そのときはうまく行きませんでした。
実はさらに、<td> に nowrap を付ければ良かったのでした。

（ちなみに、overflow:auto だと、スクロールバーが表示されてしまって、望ましく
　ありませんでした）

それにしても、本当に助かりました。何もかも、今までアドバイスをいただいた皆さんの
おかげです。ありがとうございました。

244 名前：Name_Not_Found sage 投稿日：04/03/25 17:43 ID:???
下記URLの左に表示されるバー+ロゴを作りたいと思っています。
ttp://www.wiredope.com/csstemp/css_staticlogo_demo.html

改行を入れずとも、下に背景色を出さずに、常にブラウザのウィンドウサイズに
合わせてさせるにはどうすれば良いのでしょうか？

よろしくお願いいたします。

252 ：Name_Not_Found：04/03/29 13:24 ID:???

245 名前：Name_Not_Found sage 投稿日：04/03/25 20:21 ID:???
>>236
感動した
激しくありがとうを
ぃいたいです

246 名前：Name_Not_Found sage 投稿日：04/03/25 20:38 ID:???
>244　「改行を入れずとも」なんて書いているうちは実現不可能じゃないの？
答えもかんたんに見つかるし。

247 名前：244 投稿日：04/03/25 20:51 ID:sEgkhFdD
>>246
すみません。確かにそうかもしれません。
私なりに考えてみたのですが100%で伸びるテーブルを入れれば
回避出来るかと思ったのですが
WIN IE 6にて23inchモニタで最大に伸ばしてみるとテーブルが伸びず
背景色が出て来てしまったので質問しました。
これは間違いでしょうか？

ご教授いただけましたらこれ幸いであります。
どうぞよろしくお願い致します。

253 ：Name_Not_Found：04/03/29 13:25 ID:???

248 名前：Name_Not_Found sage 投稿日：04/03/25 21:31 ID:???
>247　とりあえず、テーブルを使っているうちはだめ。
テーブルは一種の呪いのようなものだ。

「答え」がどこにあるかを見つけられるくらいの
知識をつけてからでもおそくないよ。

249 名前：Name_Not_Found sage 投稿日：04/03/25 23:21 ID:???
>>244
そのページのリンク先にあるソースがダメな理由は?

250 名前：Name_Not_Found 投稿日：04/03/26 18:01 ID:hiNUIAyl
他のページは文字サイズが固定されているのに
なぜかトップページだけがされていません。
他のページと同じスタイルシートを使ったのですが･･･。
どうしてなのか御教授ください。

ttp://ww71.tiki.ne.jp/~hina/

251 名前：Name_Not_Found sage 投稿日：04/03/26 18:12 ID:???
>>250
ひとまずビルダーとテーブルレイアウトやめとけ

254 ：Name_Not_Found：04/03/29 13:25 ID:???

252 名前：Name_Not_Found sage 投稿日：04/03/26 18:33 ID:???
>>250

ww71.tiki.ne.jp/~hina/
<meta NAME="keywords" content="福岡県,北九州市,黒崎,写真,画像>
<STYLE type="text/css>

この2行で>の前で「"」が抜けてるゾ

255 ：Name_Not_Found：04/03/29 14:55 ID:???

251+252+253+254
乙です!!

256 ：Name_Not_Found：04/03/29 20:57 ID:WyWhBksY

style.cssの中で、
「曜日によって背景を変える」というようなことがしたいんですが、
できますでしょうか。どのように書けばできるのでしょうか。

一応検索はしてみましたが見つかりませんでした。
よろしくお願いします。

257 ：Name_Not_Found：04/03/29 21:19 ID:???

曜日を出力するJSでclass値を出せばいいんじゃないの。

258 ：Name_Not_Found：04/03/29 21:24 ID:???

>>254
スタイルシートでは出来ません。
JavaScriptを使ってください。
<html>
<head>
<title></title>
</head>
<script type="text/JavaScript">

</script>
</body>
</html>

スタイルシートで背景指定するべきだったな・・・
ま、いいや。

259 ：256：04/03/29 22:06 ID:???

>257、258
ありがとうございます。
そうですね、JSで曜日ごとのcssを指定する、という方法をとろうかと思います。

なんとかひとつのスタイルシートで済まないかな～と、手抜きな方法を考えてしまっていました。

260 ：Name_Not_Found：04/03/29 23:14 ID:???

http://www.scottandrew.com/
http://www.hssh.jp/~hssh/
http://thefool.fc2web.com/
http://www.1point.jp/~book_2ch/index.html
http://red.ciao.jp/fantasy/
http://www.aquaplace.com/
http://starry.night.nu/
http://www.macintoybox.com/
http://www.d1.dion.ne.jp/~hirosi_s/index.html
http://www.annie.ne.jp/~sheepers/komain.html
http://3110.sunnyday.jp/
http://cheser25.hp.infoseek.co.jp/
http://phoenity.com/
http://www.users.yun.co.jp/~souichi/
http://radicli.net/rr/
http://d-o-b.ciao.jp/^o^/
http://www.windfarm.co.jp/
http://www.deadbydesign.com/
http://www006.upp.so-net.ne.jp/Initialz/index.html
http://chankaz.cside4.jp/
http://raku-gaki.com/
http://www1.odn.ne.jp/~cce60200/
http://www.muffy.jp/
http://www.ritsumei.ac.jp/kic/~tyv07679/index-j.html
http://tr.vis.ne.jp/
http://www.kapowaz.net/?showarticle=13032003
http://akiko.kuhndesign.com/
http://www.clagnut.com/
http://www.interq.or.jp/orange/nori/
http://www10.plala.or.jp/psychedelic-text/

261 ：Name_Not_Found：04/03/29 23:42 ID:???

JavaScriptを使って読み込む外部CSSを変えてしまうこともできるだろう。
そうすれば、曜日ごとに全く違うデザインということもできる。
CSS切り替えスクリプトを改造したら？
代替スタイルシートについて知っている人なら
自分で好きなデザインも選べるしNA

262 ：256：04/03/30 07:10 ID:???

>261
ありがとうございます。

「JSで読み込む外部CSSを変える」「代替スタイルシート」ということですが、
代替スタイルシートはIE未対応ということで、残念ながら･･･
あと適応させるすべてのページで
曜日ごとに違う外部CSSを指定するタグが面倒だった、というのと、
幾つもCSSを作らず、一つにしたかった。
という、ただ面倒だったと言う理由だけで皆様にお聞きしてしまって
申し訳なかったです。
ひとつのCSSのファイルの中だけで
BODY,p,td
{
font-size: 12px;
line-height: 20px;
letter-spacing: ;
color: #ffffff;
background-color : #000000 ;
background-image:url(border.gif);
background-attachment : fixed ;
}
この辺りだけいじって、というのはやはり無理なのかな･･･
面倒がらずに、JavaScriptで頑張ってみます。

お答えくださった皆様に感謝します。ありがとうございました。

263 ：Name_Not_Found：04/03/30 07:15 ID:???

>>262
代替スタイルシートに萌え～
http://pc5.2ch.net/test/read.cgi/hp/991400015/l50
>スクリプトでＩＥ対応させてるサイトが密かに急増中。

264 ：Name_Not_Found：04/03/30 08:34 ID:???

んなもん<body id="変数">にしてJavaScriptなりで制御させればいいじゃん
したら用意するシートも一枚で済むし

265 ：256：04/03/30 09:28 ID:???

>264
お答えいただきありがとうございます。
しかし、ごめんなさい、具体的にどのようにしていいのかわかりません。。
そのやり方だと、CSSだけの操作でできますか？

266 ：256：04/03/30 09:30 ID:???

>263
ありがとうございます。
参考にさせていただきます＾＾

267 ：Name_Not_Found：04/03/30 09:56 ID:???

なにするにしろ、JavaScriptは必要だぞ
PHPやCGI制御でもいいが

268 ：Name_Not_Found：04/03/30 12:33 ID:???

だけどJavaScriptに頼りすぎて、JavaScriptOnでないと正常に閲覧できないサイトは勘弁

スレチガイなので、次のCSSの質問ドゾー

269 ：Name_Not_Found：04/03/30 14:05 ID:???

JavaScriptは、使い手によって良し悪しが凄い変わるな。

どうでもいいがJavaScriptって略称あるのか？JSかな。

270 ：Name_Not_Found：04/03/30 17:25 ID:???

検索してみたけど全く情報が無かったので質問させてください。
geocitiesに自分のサイトアップロードしてＩＥ６にてオンラインで見ると勝手に横スクロールバーが表示されるのだか。
この横スクロールバーを消す解決方法無いですか。
原因は
1.アップロードする際に付け加えられる広告タグ（これは不可避）
2.スタイルシートのA{ padding: 1px;} によるもの
だと分かっているのだけれど対処方が分かりません。
詳しくは↓に書いています。どうか親切な方教えてください。
http://www.geocities.jp/motomiyachii/index2.html

271 ：Name_Not_Found：04/03/30 17:33 ID:???

>>270
AとA:hover を padding で調整するのをやめて、
A 以外には背景色と同じ色の border を指定すればよいかと思われ

272 ：271：04/03/30 17:34 ID:???

ごめん間違えた
A以外には→×
Aには　　→○

273 ：Name_Not_Found：04/03/30 17:37 ID:???

新規質問は上げなさい。
A{ padding: 1px;} をA{ border: 1px solid #fff;} にしたらどうなる？
広告に対して div table a {padding:0; border:0;}とか。

274 ：Name_Not_Found：04/03/30 18:10 ID:???

>>271　すみません分からないです。こういうことですか？
A{
border: #FF00FF;
}
A:hover{
border: 1px dashed #FF00FF;
background: #FCC8FF;
}
横スクロールバーは消えるけどリンクはカクカクしますわ。
>>273
>A{ padding: 1px;} をA{ border: 1px solid #fff;} にしたらどうなる？
全く変化なしだった。
>広告に対して div table a {padding:0; border:0;}
すげ～これで完璧に解決しました。有り難うございました。

275 ：Name_Not_Found：04/03/30 18:14 ID:???

>>274
A{
border: #FF00FF;
}
ではなくて
A{border:1px solid #fff;}
つまり>>273と同じだよ。
だから「全く変化なし」てのはヘンだ。

276 ：270：04/03/30 18:28 ID:???

>>275
あれ、全く変化しない。ごめん
でもスタイルシート部分に
div table a {padding:0; border:0;}（←全く意味は分からない）
を挿入するだけで無事解決しました。いずれにしても有り難うございますた。

277 ：Name_Not_Found：04/03/30 18:37 ID:???

意味わからないこと、すな。
理解してからにしようね。
広告はどんなHTMLが挿入されるか、考へてみたまへ。

278 ：270：04/03/30 19:02 ID:???

>>277
すみません勉強不足ですわ。
div table a {padding:0; border:0;}
挿入しても
広告にポインタ合わせると横スクロールバー出てしまうな。
http://www.geocities.jp/motomiyachii/index2.html
別にこれくらいならいいかな。もし解決方法あったら教えてくださいな。
あまりにもくだらない質問のため期限は今日までとさせていただきます。

279 ：Name_Not_Found：04/03/30 19:03 ID:???

CSSに革命が！？質問です！！
body
{
background-image:url(1.gif);
}

html
{
background-image:url(2.gif);
}

ってやれば背景画像2個指定できますよね！
もし出来るんなら凄くないですか！？

280 ：Name_Not_Found：04/03/30 19:07 ID:7lGA5k69

>>279
それぐらい当り前。知らない方が恥。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/colors.html#q2

281 ：Name_Not_Found：04/03/30 19:09 ID:OZ+sp0UE

背景画像2個か…
した光景が具体的に思い浮かばないな…。

282 ：Name_Not_Found：04/03/30 21:03 ID:???

ひとつは、シンプルな壁紙。
もうひとつは、ページのコーナーにカットイラスト。
みたいな使い方かな？

283 ：Name_Not_Found：04/03/30 23:35 ID:???

・・・古式か？

284 ：Name_Not_Found：04/03/31 00:26 ID:???

まあ、そうですわ・・・る

285 ：Name_Not_Found：04/03/31 06:34 ID:???

>>278
>>4で勉強しろ。

286 ：Name_Not_Found：04/03/31 12:36 ID:50NAc+1+

質問です。
<select name=icon class=f>
<option value="0">A
<option value="1">B
～～～～～～～～～～～～～～
</select>
のタグで
ttp://members.at.infoseek.co.jp/voiddd/cgi-bin/uploader/img-box/img20040331123029.jpg
こういう選択欄を作ったのですが右のスクロールバー（？）の色が返る事が出来なくて悩んでます。
どういうスタイルシートを使えばいいのか教えてもらえないでしょうか。
なるべく<select>の中に入るスタイルシートがいいです（CGIの掲示板に入れたいので）

どうかご教授お願いします。

287 ：Name_Not_Found：04/03/31 12:38 ID:???

もう、その質問も秋田

288 ：Name_Not_Found：04/03/31 13:07 ID:cPCP5iik

質問させてください。
ソース
http://www.hikky.info/
CSSのアドレス
http://www.hikky.info/css/index.css
ページ中央のUpdating historyの下の枠二線が

2pxになるように、CSSでheight: 2px;と指定してみたんですが、
太く表示されうまい具合にいきません。
どこがおかしいのでしょうか？

289 ：Name_Not_Found：04/03/31 13:11 ID:???

>>288
IEが糞。DOCTYPEをstrictに変えてみたらどうなる？

290 ：Name_Not_Found：04/03/31 13:12 ID:???

OperaとNNでは期待通りの表示だったぞ。

291 ：288：04/03/31 13:41 ID:cPCP5iik

>>289
strict宣言しても変化ありませんでした。
>>290
NN7.1で確認しました、期待通りです。
IEが糞なんですかね。それともやはりhtml・cssの記述におかしいところがあるのでしょうか？

引き続きご指導のほどよろしくお願いします。

292 ：Name_Not_Found：04/03/31 14:01 ID:???

>>288
<div class="upd2"></div>
<p id="upd1" class="upd1"></p>
<div class="upd2"></div>
ナニコレ？
IEも糞だが、空divなんてやるのも糞だぞ。
borderでやれないのか？

293 ：Name_Not_Found：04/03/31 14:04 ID:???

>>288
>.row1 { float: left; }
ＦＡＱの>>7を見なさい。
A4: floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。

294 ：Name_Not_Found：04/03/31 14:08 ID:???

>>288
.upd2 { margin-top: 0px; width: 214px; height: 2px; background: #D5DBE2 url(../img/upd2a.gif) repeat; }
なんで線を引くのに背景画像でやるのかねえ。
わけわからん。

295 ：Name_Not_Found：04/03/31 14:37 ID:???

>>288
たぶんWinIEのバグ。
http://pc5.2ch.net/test/read.cgi/hp/1078463560/96

296 ：288：04/03/31 14:43 ID:cPCP5iik

>>295
コメントを入れたらうまくいきました！
IEのバグだったんですね。
ご指導いただいた皆様、どうもありがとうございました。

297 ：Name_Not_Found：04/03/31 14:46 ID:???

>>296
だから、コメント入れただけの空divを作るのがそもそも間違ってるんだよ。
まだわかってないのか。
なぜborderでやらないんだ？

298 ：Name_Not_Found：04/03/31 14:51 ID:???

>>288
<div class="upd2"></div>
は二つとも削除しろよ。
その代り
#upd1 {border:2px solid #000; border-width:2px 0;}
で、出来るだろが。
中身のない無意味なマークアップは止せ。

299 ：288：04/03/31 14:52 ID:cPCP5iik

>>297
やり方が分からないからです。
もし宜しければ気が向いたらでいいので
下記スレッドに質問しましたので、回答をよろしくお願いします。
http://pc5.2ch.net/test/read.cgi/hp/1079712912/

300 ：Name_Not_Found：04/03/31 14:57 ID:???

>>299
単なる黒い線を出すのになぜ画像でなければいけないのか、理解に苦しむ。
どうしても画像で枠線を出したいなら
<div class="upd2">
<p id="upd1" class="upd1"></p>
</div>
として、CSSを
.upd2 {padding:2px 0; width:214px; background:#000 url(../img/upd2a.gif) repeat;}
とすればよいだろ。
応用力を利かせようね。

301 ：288：04/03/31 15:04 ID:cPCP5iik

いえ、分かりにくいかもしれませんが
黒線ではなく、縞模様です。

302 ：Name_Not_Found：04/03/31 15:05 ID:???

>>301
縞模様だからナニ？
>>300の方法でできるだろ。
書き込む前に読み直して熟考してからにしような。

303 ：Name_Not_Found：04/03/31 15:10 ID:???

>>286
select要素ではz-indexやborderなどのプロパティを無視する(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b112.html

304 ：288：04/03/31 15:18 ID:cPCP5iik

>>302
borderはどこでしょうか・・？

305 ：Name_Not_Found：04/03/31 15:21 ID:???

>>288　ひどいソースだな……。
.upd2 { margin-top: 0px; width: 214px; height: 6px; background: #D5DBE2 url(../img/upd2a.gif) repeat; }
<div class="row1">
<p class="upd1"><img src="img/upd1.gif" alt="更新履歴"></p>
<div class="upd2"></div>
<p id="upd1" class="upd1"></p>
<div class="upd2"></div>
</div>
↓
↓もっと簡潔にすると
.upd2 { padding:6px 0; width:214px; background:#D5DBE2 url(../img/upd2a.gif) repeat; }
<div class="row1 upd2">
<p class="upd1"><img src="img/upd1.gif" alt="更新履歴"></p>
<p id="upd1" class="upd1"></p>
</div>

306 ：Name_Not_Found：04/03/31 15:26 ID:???

>>302
見てわからんか？　試せばすぐわかることを訊くな。とにかくやってごらん。
ヒント：上下paddingに注意。

307 ：Name_Not_Found：04/03/31 15:29 ID:???

>>304
むやみに質問しないで、少しは自分の頭も使ってね。
>>300か>>305の通りにやってみ。

308 ：Name_Not_Found：04/03/31 15:52 ID:???

>>4のテンプレURL変更あったので報告。

> ・『スタイルシートWebデザイン』ボランティアHTML化版。
> 　http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
　　　　　　　　　　　　　　　　↓
http://www.asahi-net.or.jp/~jy3k-sm/css1/2004maki/

309 ：Name_Not_Found：04/03/31 15:58 ID:???

>>308
了解、こちらは変更した。
http://web2ch.s31.xrea.com:8080/?CSSRelated

310 ：Name_Not_Found：04/03/31 17:57 ID:???

さｇ

311 ：Name_Not_Found：04/03/31 18:17 ID:???

あg

312 ：初級者：04/03/31 23:45 ID:Ul2SKtsA

>>308
そこすごい勉強になったわ。
ただでこれぐらいの勉強できるんだったらこの手の本はいらないね。

313 ：Name_Not_Found：04/03/31 23:53 ID:???

>>312
妙な日本語だ

314 ：Name_Not_Found：04/04/01 00:35 ID:???

自分のサイトをリニュウアルしようとXHTML+CSSで製作中なんですが、問題が発生したので質問させていただきます。

こちらのURLを見てください。
http://be-net.xrea.jp/file/

メニューの一番最初の項目が思いもよらない表示になるんですが、この解決策はないのでしょうか？
なぜかローカル上で見ると普通に見えます。
自分はFirefoxを使っているんですが、どうやらMozilla系は全部このように表示されるようです。

CSSにバグがあると、よく聞くのですが
http://members.at.infoseek.co.jp/cssbug/detail/mozilla/b018.html
このバグでしょうか？

315 ：Name_Not_Found：04/04/01 01:02 ID:???

>>314
とりあえずIEで見た感じの通りにしたいと過程するとして、このままだと
IEはXML宣言を含むXHTMLを互換モードでレンダリングするバグがあ
るので互換モードでレンダリングされてるのが1つ。

後はいじくってみる。

316 ：315：04/04/01 01:21 ID:???

添削してて気がついた。
<a id="top" name="top" />
↑これなんだ？もう一度仕様書読んで出直してこい。

あとこういうメニューはliにfloat:leftしてaをdisplay:blockするほうがやり
やすいと思われ。
Listamaticとか見てくれ。

317 ：Name_Not_Found：04/04/01 02:26 ID:???

>>316
><a id="top" name="top" />
スレ違いだけど、指摘しておく。

XHTML 1.0文書だから、XML文書としては整形式なマークアップ。
ただし HTML適合UA との互換性に支障を来たすので、不許可。
Content-Type が text/html として提供される場合も、不許可。
それよりも、body の直接下位にa要素を記述するのが invalid。

>>314
<h1><a id="top" name="top">Cat&me</a></h1>
このように記述しておくのが無難。

>encoding="Shift-JIS"
Shift-JIS という符号化方法は IANA に登録されていない。
正しくは Shift_JIS と指定しなければならない。
meta要素では正しく指定できているから、ケアレスミスか。

318 ：Name_Not_Found：04/04/01 02:31 ID:???

>314　HTMLもCSSもつっこみどころが多いよ。
まずはlintやCSS Validatorでチェックすることをおすすめする。

319 ：Name_Not_Found：04/04/01 03:18 ID:???

>>317
お前書き方がめちゃめちゃキモい
度が過ぎる信者はﾏｼﾞﾃﾞ死んでくれ
吐き気がするんだ。

320 ：Name_Not_Found：04/04/01 03:46 ID:???

>>318
CSS を検証したら Valid だったよ。

>>314
>メニューの一番最初の項目が思いもよらない表示になるんですが
やはり CSS 以前の <a id="top" name="top" /> が原因。

スタイルシートの設計の仕方だけど、ピクセル厨を直した方がいいよ。
em単位とか割合値を使えばもっと柔軟なレイアウトを実現できるはずだからさ。

>>319
キモいかどうかは知らないけど、
仕様書と照らしあわせてただ間違いを指摘しただけの
真っ当な回答者も「度が過ぎる信者」と極め付けですか。
根拠もなく感情的に煽ってるキミのほうが、吐き気がするよ。

321 ：Name_Not_Found：04/04/01 04:32 ID:???

スルーできないあたりがキモイ

322 ：Name_Not_Found：04/04/01 19:26 ID:4oMtCT5V

background-attachment: fixed;と指定しても
背景が一緒にスクロールしちゃうんですががｇ(´･ω･`)

<BODY STYLE="background-image:url(　　);
background-repeat:no-repeat;
background-position:left center;
backround-attachment:fixed;
scrollbar-base-color:#FFFFFF;
scrollbar-arrow-color:#FFFFFF;
scrollbar-face-color:#FFFFFF;
scrollbar-track-color:#FFFFFF;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
"></BODY>

こんな感じです・・・
どうしてもスクロールバー消せなかったから
色を白にして誤魔化したのが原因ですか？＿|￣|○

323 ：Name_Not_Found：04/04/01 20:06 ID:???

スクロール・バーを消すなよ、迷惑な奴だな。

http://cssbug.at.infoseek.co.jp/detail/winie/b065.html

324 ：Name_Not_Found：04/04/01 20:16 ID:???

やれやれ、今度はピクセル厨という新語か。
そういうのは他のスレでやって欲しいもんだが。

325 ：Name_Not_Found：04/04/01 20:27 ID:???

新語はともかく、px単位は濫用すべきでないことはたしかだ。

326 ：Name_Not_Found：04/04/01 20:50 ID:4oMtCT5V

>>323
え？迷惑なんですか(；´д`)？

327 ：Name_Not_Found：04/04/01 20:53 ID:???

>326　スクロールバーを消されてうれしい奴はいないだろう。
そのページのどのへんを読んでいるのかわからなくなる。
たいへん迷惑だ。

328 ：315：04/04/01 21:11 ID:???

落ちてる間にすごい進んでてたので遅レスｽﾏｿ

>>317=320?
いや、だから>>314に対して<a id="top" name="top" />はなんだ？
仕様書見てこいって返してるんだが？

ちなみに<a id="top" name="top" />削ったら手元じゃきちんと(？)表示
されたところまで確認してレスを書いたんだがうまく読んでもらえなかった
ようで…。

で、>>320は回答の仕方がきもいと言われてるのに気づいてくれ。
ネチネチと女の腐ったような回答は不快感を与えるだけ。
<body>直下に<a>要素を配置してはいけません。
くらいでよかったのに。

329 ：Name_Not_Found：04/04/01 21:13 ID:4oMtCT5V

>>327
なるほど

330 ：Name_Not_Found：04/04/01 21:26 ID:???

で、背景画像が固定できないのは直ったのか？

331 ：Name_Not_Found：04/04/01 21:28 ID:fdBfkCWo

質問です。
横スクロールバーだけ透明色にすることは可能でしょうか？

332 ：Name_Not_Found：04/04/01 21:32 ID:???

やめろ。なんでそんなことしたいんだ？　>>331
そもそも不可能。

333 ：Name_Not_Found：04/04/01 21:39 ID:4oMtCT5V

>>330
まだ(´Д⊂

334 ：Name_Not_Found：04/04/01 21:42 ID:???

>>333
HTMLとCSSのソースをチェッカーにかけた方がいい。
それでもわからなかったら、ここにソースを出すよろし。

335 ：331：04/04/01 21:43 ID:fdBfkCWo

>>332
そうですか･･････。
すいません、ありがとうございました。

336 ：Name_Not_Found：04/04/01 21:45 ID:???

で、なんでそんなことしたかったんだ？　ン？　>>335

337 ：Name_Not_Found：04/04/01 21:57 ID:???

>>334
お風呂入ってからがんがるよ
またお世話になるかもしれないけど色々ありがとう（´▽｀）ﾉ

338 ：Name_Not_Found：04/04/01 22:06 ID:???

>314です。

>315さん、>318さん、>320、>325さんレスありがとうございます。
すでに確認された人もいるでしょうが、言われた事をざっと直していったらなぜか正しい表示になりました。
これで正確な記述がどれだけ重要かがわかりました。

CSSの仕様書を見直して、リンクのボタンの大きさをem単位で指定してみようと思います。

とても参考になりました、ありがとうございます。

339 ：Name_Not_Found：04/04/02 00:08 ID:???

質問です。
http://www.asahi-net.or.jp/~jy3k-sm/css1/2004maki/7.html#h714p2

上記のサイトのサンプルを試しているのですが、うまく動きません。
マウスカーソルをかざしてもリンク先が現れないのです。
なぜでしょうか。 Mozilla 1.7b と IE 6.0 です。

<style type='text/css'>
DIV.HIDE A:link{visibility: hidden}
DIV.HIDE A:hover{visibility: visible}
</style>

<DIV CLASS="HIDE">
<P>あなたを
<A HREF="http://www.asahi-net.or.jp/~jy3k-sm/i_net/books.html">アヤシイ世界</A>
に案内します。
</P>
</DIV>

340 ：Name_Not_Found：04/04/02 00:25 ID:Q2JuN/DO

WEBをCSSで記述したほうが、通常のHTMLで記述するより
SEO対策になりますか？

341 ：Name_Not_Found：04/04/02 00:36 ID:???

>>339
自信は無いが，ブラウザのCSSの実装が不完全なために，
意図した通りに表示されないのでだと思う。

ttp://www.zspc.com/documents/css2/index.html

342 ：Name_Not_Found：04/04/02 00:50 ID:???

>>340
CSSはデザインを扱うものです。

343 ：Name_Not_Found：04/04/02 00:53 ID:???

>339　細かいことはおいておくとして、
それだとリンクがどこにあるかわからないだろう。
入口がどこにあるかわからないサイトがよくあるけれど、
そういうサイトを見るたびに、その程度の配慮もできないのかと落胆する。

>340　漠然としすぎているよ。
ただ、HTMLとCSSをわけたほうが、それぞれのソースをきれいにしやすい。

344 ：339：04/04/02 01:28 ID:???

ご回答ありがとうございます。

>>341
バグということでしょうか？ならばバグ辞典スレッドに行ったほうが良いのでしょうか？

>>343
私には、リンクを隠そうという目的は特にないのですが、CSS の勉強中で、
何が間違っているのかわからないので質問させていただきました。

ただ、私はプログラマなので、見かけよりも、操作性を変える属性に
興味があるのは事実です。かなりトリッキーな仕様を要求されることが
多いもので。

345 ：Name_Not_Found：04/04/02 01:46 ID:???

>>344
Bugzillaをパっと見てきた程度で見当違いかもだけど
http://bugzilla.mozilla.org/show_bug.cgi?id=33736
これに関連してるんじゃないかなぁ？
visibilityに関するバグは多いようなので使わない方が無難な気がします。

あとトリッキーな動作だと、IEの疑似要素のサポートはへぼいんで
JavaScriptとか使う方がいいかもしれんです。

346 ：Name_Not_Found：04/04/02 02:07 ID:???

>>344
色でやっちゃえば？
DIV.HIDE A:link{ color: #FFFFFF }
DIV.HIDE A:visited{ color: #FFFFFF }
DIV.HIDE A:hover{ color: #0000FF }

347 ：339：04/04/02 02:27 ID:???

>>345
どうやら、Mozilla はこれのようですね。IE にも同じようなバグがあるのでしょう。
ありがとうございました。
>>339 のリンク先は、CSS2 を実装したブラウザが出る前に書かれたものなので、
こういうことがあっても不思議ではないかもしれません。

>>346
それでは、TAB でフォーカスを移動させたら、カーソルが移ってしまいます。

348 ：339：04/04/02 02:32 ID:???

ためしに JavaScript で書いてみました。

<A HREF="http://www.asahi-net.or.jp/~jy3k-sm/i_net/books.html"
onMouseOver='style.visibility="visible"'
onClick='style.visibility="visible"'
onMouseOut='style.visibility="hidden"'>アヤシイ世界
</A>
に案内します。

これ、一度マウスがリンクから離れると、もう一度マウスをかざしても
二度と復活しません。クリックも効きません。

どうやら現状は、こういうもののようですね。

349 ：Name_Not_Found：04/04/02 02:37 ID:???

>>348
TABなんか移動しないようにすればいいだけじゃん。
それにJavaScriptならいくらでもできるし。

350 ：339：04/04/02 03:15 ID:???

>>349
確かに、JavaScript でたくさん書けば、何でもできます。しかし、
複雑なコードは干渉を起こしやすいので、大規模なアプリケーションでは
できるだけ避けたいのです。

今回、style の visibility に興味があったのは、従来、大量のコードを書いて
実装していた機能を、もっと簡潔に実現する手段の一つとして使えないかという
試みでした。

残念ながら、現状のブラウザでは信頼性が低く、諦めたほうが良いようです。

351 ：Name_Not_Found：04/04/02 04:35 ID:???

>350　いまひとつ目的がはっきりしないようなんだけど、
具体的にどんなことをするのか、何かねらいはある？
「大規模なアプリケーション」とあるから、
何か大きなことをしているように見えるんだけれど。

352 ：Name_Not_Found：04/04/02 08:26 ID:???

この手合いは「あー言えばジョウユウ」だから進展はせんだろな

353 ：Name_Not_Found：04/04/02 14:06 ID:???

古っ！

354 ：Name_Not_Found：04/04/02 16:36 ID:???

>>339
<style type='text/css'>
DIV.HIDE A{position:relative; z-index: -1;}
DIV.HIDE A:hover{z-index: 1;}
</style>

<DIV CLASS="HIDE">
<P>あなたを
<A HREF="http://www.asahi-net.or.jp/~jy3k-sm/i_net/books.html">アヤシイ世界</A>
に案内します。
</P>
</DIV>

試してみそ

355 ：339：04/04/02 19:13 ID:???

遅くなりました。まず２点ほど、お詫びをしなければなりません。

まず、私の目的ですが、今回は単なる勉強で、なぜサンプルコードが
動かないのかを知ることができればよかったのです。
そのことをきちんとお伝えしていませんでした。すみません。

次に、下の Bugzilla ですが、
http://bugzilla.mozilla.org/show_bug.cgi?id=33736
読んでみたところ、結局、バグとも正常とも決着していない、
保留状態のようです。バグというのは、私の勘違いでした。
少なくとも現在は、visibility:hidden はこういう挙動だと
考えて良いようです。

最後に、>>354さん
Mozilla では見事に動きました。ありがとうございました。
z-index をこういう使い方をするのは、思いつきませんでした。

ただし、IE6 では z-index に負の値を与えると動かないそうで、
http://www.zspc.com/documents/css2/display/zindex.html
これはまさにバグだということです。

ということで、いろいろありがとうございました。

356 ：Name_Not_Found：04/04/02 21:16 ID:???

>>355
終わらそうとしているところにこんなこと書くのもなんだけど、CSSはW3Cが
"勧告"してるだけで強制力はありません。
挙動はブラウザに依存します。
プログラマであればわかると思いますが、例えばサイトや本のサンプルコード
をそのまま入力してもコンパイラによってはコンパイル出来ないことがあるのと
にています。
全てのブラウザ(コンパイラ)がW3C勧告(仕様)に従えばクリエイターやデザイ
ナー(プログラマ)にとっての理想ですが、悲しきかなこの世は理想とはかけ離れ
ています。

といったことを念頭に勉強されるのがよろしいかと。
ましてや実務に使おうと思うのであれば仕様のみでは無駄かと。

357 ：Name_Not_Found：04/04/02 23:36 ID:???

>>355
>IE6 では z-index に負の値を与えると動かないそうで、

そんなこたぁない。誤解してるよ。
>>354に
DIV.HIDE {position:relative; z-index:0;}
を追加するとかさ。

358 ：Name_Not_Found：04/04/02 23:52 ID:???

質問させていただきます。
OSはWin2000、ブラウザはIE6.0、NN7.1で確認しています。

フレームを組んでいて、インラインスタイルで下記のように指定しています。

<FRAME name="right" src="menu.html"style="border-left:solid;border-left-width:1px;border-color:#000000;"scrolling="AUTO" frameborder="NO" noresize>
</FRAMESET>

IEではボーダーが表示されるのに、ネスケでは表示されません。
内部スタイルシートで指定すれば表示されるんでしょうか…
そうであるなら、どの様に記述すれば良いのでしょうか？
初心者で申し訳ありませんが、ご教授お願いします。

359 ：358：04/04/02 23:54 ID:???

申し訳ありません、追記です。

外部スタイルシートの場合の記述も教えて頂きたいです。
お願いします。

360 ：Name_Not_Found：04/04/03 00:10 ID:???

>>358
×　border-left:solid;
○　border-left-style:solid;

スタイルが設定されていないのに表示するIEの方がちょっと変。

361 ：Name_Not_Found：04/04/03 00:21 ID:???

>358　
インラインスタイルとか内部スタイルシートとか、
わけのわからない単語で書かれても意味が通じない。
>358だと単にstyle属性を使っているだけだから、
font要素などで見栄えを記述しているのと大差ない。

CSSを別のファイルで読み込ませる場合は、
各フレームにclassをつけるとよいと思う。
詳しいことを聞く前に、とほほなどを見ながら一度やってみるといいと思う。

362 ：Name_Not_Found：04/04/03 00:50 ID:???

>>360
それは間違いではないだろう。

>>361
"インラインスタイル"は、HTML4.01の"Inline style information"だと思われ。

363 ：358：04/04/03 00:57 ID:???

レスありがとうございます。

>360
早速直してみましたが、ネスケでは表示されないです。。

>361
解り難い書き方をして、すみません。
あまり理解していないので、そういう言い方をした方が意味が通じるのかなと
思っていたのですが、かえっていけなかったんですね。

CLASSは試しましたが、フレームに適用されないで読み込ませたページの端に
ボーダーが表示されたりしたので、出来ないのかなと思って。。
とほほも見ましたし、検索などもしてみたのですが、どうにも解決しそうになかったので
ここで聞いてみました…
自分が何か間違っていたのかも知れませんので、もう一度よく調べてやってみます。
ありがとうございました

364 ：Name_Not_Found：04/04/03 01:10 ID:???

frameborderの値は"0"か"1"かのどちらかではないのか。

365 ：354：04/04/03 05:32 ID:???

色々試したけどMozとIEじゃ親子・兄弟でz-indexの値の解釈がバラバラだな
仕様読んでこよっと

366 ：Name_Not_Found：04/04/03 09:08 ID:???

>>365
ここに解説があるって。
http://cssbug.at.infoseek.co.jp/detail/mozilla/b038.html

#「バグ辞典」は必読です。

367 ：Name_Not_Found：04/04/03 12:41 ID:???

　質問させてください。
　HTMLで
<p><a href="http://nantoka">あいうえお</a></p>
とし。CSSにて
p{line-height:2em;width:200px;}
と、line-heightを1emより大きな値などにした後、
InternetExplorer6.0でブラウズしているとき、activeの状態、
というよりマウスでクリックしている状態にすると、
破線で囲われる範囲が本来の文字の縦幅よりも下に伸び、
はみ出てしまうのです。
　Netscape 7.1でははみ出しません。
　IEではみ出さない為にはどうしたらいいのでしょうか。
そもそも、なぜはみ出してしまうのでしょうか。
お教えください。

368 ：Name_Not_Found：04/04/03 13:03 ID:???

>>367
バグです。諦めましょう。

369 ：Name_Not_Found：04/04/03 13:29 ID:???

>>367
>line-height:2em;
line-heightは単位無しの実数値指定がおすすめ。line-height:2.0;とかね。
過去ログ既出。

370 ：Name_Not_Found：04/04/03 16:21 ID:???

何故？

371 ：Name_Not_Found：04/04/03 16:44 ID:K6J57upr

質問させていただきます。
OSはWin2000、IE6.0、NN7.1で確認しています。

リンクを指定しています
a:link{color:#666666;text-decoration:none;}
a:visited{color:#666666;text-decoration:none;}

a:hover{color:#000000;border-bottom: 2px dotted #FFFF00;font-weight: bold;}

a:active{color:#FFFF99;text-decoration:none;font-weight: bold;}
ソースは
<a href="×"><IMG SRC="×.gif" ALT="×"border="0"></a>
border-bottom: 2px dotted #FFFF00;が表示されます。これを一箇所だけ回避したいのですが
どのようにすればいいか教えてください。ど素人な質問ですが宜しくお願いします。

372 ：367：04/04/03 16:59 ID:???

　返答ありがとうございます。　バグなんですか…！
続けての質問で申し訳ないのですが、
このバグの説明などを載せているサイトはありますか、
自分なりに「http://cssbug.at.infoseek.co.jp/index.html」や
過去ログやGoogleで調べたのですが、見つかりませんでした。
　後、>>369さんの助言はとても参考になりました。どうも。
　>>370さんは…>>367の「そもそも、なぜはみ出してしまうのでしょうか。」という発言の
「なぜ」という部分を疑問に思ったということでしょうか。
　返答お待ちしてます。

373 ：Name_Not_Found：04/04/03 17:11 ID:???

>>371
回避したい箇所にclass属性をつけ、classセレクタでスタイル指定を上書きする。
>>4を読むとワカル。

374 ：371：04/04/03 19:15 ID:K6J57upr

>>373
回答ありがとうございます。
http://cssbug.at.infoseek.co.jp/detail/winie/b040.htmlの事でしょうか？
実は質問するまえに試してみました、結論から言うとダメでした
「<em style="text-decoration:none;">」や
「a.sample1{color:#000000;text-decoration:none;}」など。表記が間違えている
可能性はありますが、もし宜しければもう少し詳しくご教示ください。
宜しくお願いします。

375 ：Name_Not_Found：04/04/03 19:49 ID:???

>>374
>http://cssbug.at.infoseek.co.jp/detail/winie/b040.htmlの事でしょうか？
いいえ。バグは関係ありません。なぜそんな見当外れな参照をするのか？
そもそもborder-bottomを消すのにtext-decorationをいぢっても無意味。
border-bottomを消したいなら、border-bottomを指定し直して上書きするべし。
border:none;とかborder:0;とか。
意味がわかってないみたいだから>>4でCSSのイロハから勉強し直しませう。
　http://msugai.fc2web.com/web/index.html

376 ：371：04/04/03 20:28 ID:???

>>375
回答ありがとうございます。
確かに、その上記のサイトを参照するのは無理がありすぎですね。
border:none;　border:0の上書きは一番始めにやった事で、もちろんダメでした
たぶんstylesheetの記述の仕方がどこか根本的に間違えているのでしょう。
もう一度勉強します。ありがとうございました。　

締め切り間に合わないやー

377 ：Name_Not_Found：04/04/03 21:11 ID:???

>>376
ソース（HTMLもCSSも）出せば直せるけど、
ソースを出さずに質問されても誤りを指摘できぬ。

378 ：Name_Not_Found：04/04/03 21:45 ID:IrRKTnol

下のようにボックスの内容を下揃えするにはどうすればいいでしょうか。
┏━━━━━━━━┓
┃　　　　　　　　 ┃
┃　　　　　　　　 ┃
┃　　　　　　　　 ┃
┃こんにちは。　　　　┃
┗━━━━━━━━┛
vertical-align:bottomと指定してみましたが、うまくいきませんでした。

379 ：Name_Not_Found：04/04/03 22:06 ID:???

>>371
私が質問を理解できていないのかな？こう書けば必ずうまくいくんだけど。

<style type='text/css'>
a:link{color:#666666;text-decoration:none;}
a:visited{color:#666666;text-decoration:none;}
/* ↓色が見づらいので #000000 black に変更 */
a:hover{color:#000000;border-bottom: 2px dotted #000000;font-weight: bold;}
a:active{color:#FFFF99;text-decoration:none;font-weight: bold;}
</style>

<a href="×" ><IMG SRC="×.gif" ALT="×"border="0" ></a>
<a href="×" ><IMG SRC="×.gif" ALT="×"border="0" ></a>

<a href="×" style='border-bottom:0px'><IMG SRC="×.gif" ALT="×"border="0" ></a>
<a href="×" ><IMG SRC="×.gif" ALT="×"border="0" ></a>

380 ：Name_Not_Found：04/04/03 22:07 ID:???

>>378
どんなソース（html/CSS）を書いて、何に対してvertical-alignを指定したか書いた方が良いです。

381 ：Name_Not_Found：04/04/03 22:31 ID:IrRKTnol

>>380

<h1 id="midasi">見出し</h1>

#midasi {
width: 200px;
height: 100px;
vertical-align: bottom;
}

このような感じです。

382 ：Name_Not_Found：04/04/03 22:38 ID:???

行内の文字の位置を指定するのが vertical-align
行の高さは line-height であって height ではない

383 ：Name_Not_Found：04/04/03 22:38 ID:???

>>381 こんなんじゃダメかしら？高さが px じゃなくなってるけど、
適当に小数で調節すると言うことで。

<style type='text/css'>
h1#midashi { border: 1px solid black; }/* ボーダーが見えるように */
h1#midashi { max-height: 2.3em; padding-top: 1.3em; }
</style>

<h1 id='midashi'>
下寄せの文字下寄せの文字
</h1>

384 ：Name_Not_Found：04/04/03 23:23 ID:IrRKTnol

>>382
やはりvertical-alignは行内の位置ですか。
http://deztec.jp/site/tips/page/p0037.html#table
のvalign属性の置き換えをヒントにたのですが。

>>383
ありがとう。
でも、h1に背景を入れるので、pxで指定しているんです。

385 ：Name_Not_Found：04/04/03 23:23 ID:EP/dNx2D

table全体のテキストにインラインでline-heightを設定したいのですが、どう書けばいいのでしょうか？

386 ：385：04/04/03 23:35 ID:???

ごめん自己解決しました。

387 ：Name_Not_Found：04/04/03 23:41 ID:???

こんどから質問する前に１２分間考えような。

388 ：Name_Not_Found：04/04/03 23:45 ID:/mN2QLZJ

div厨っぽいとか色々ダメなソースなのですが、
MacOS10.3&Safari1.2、MacOS10.3&IE5.2で
p.bigboxが何も内容が無いかのような
borderの表示になります。
回避策は特に求めていませんが、なぜそうなるのか知りたいので、
わかる方がいたら知恵をお貸し下さい。

<html>
<head>
<meta http-equiv="content-style-type" content="text/css">
<title>float実験</title>
<style type="text/css">

</style>
</head>
<body>
<p class='bigbox'>
<div class='floatbox'>インラインなdiv
<br>～<br>
インラインなdiv</div>
<div class='floatbox'>インラインなdiv</div>
</p>
</body>
</html>

389 ：388：04/04/03 23:49 ID:???

すみません、『インラインなdiv』ってのは気にしないで下さい…。
意味不明。

390 ：Name_Not_Found：04/04/03 23:59 ID:???

>>388
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#floats
>このプロパティの対象となる要素には，何らかの方法で幅を明示しなければなりません（widthプロパティなどで割り当てるか，置換要素の場合は内在する幅が流用される）。
>CSS2仕様では，幅が明確ではないフロートの幅は「0」とみなされます。

391 ：390：04/04/04 00:05 ID:???

>>388
うっかりスルーしちゃったけど、p要素の中にdiv要素は配置できません。
適当な匿名の（インライン）要素だと解釈した。

392 ：388：04/04/04 00:15 ID:???

>>390
レスありがとうございます。
floatのwidthの件は、私も後で気づいて修正してみました。
pの子にdivはだめなのですね。勉強不足でごめんなさい。

ソース8行目を
.floatbox{float:left;border:solid 2px #0000ff;width:20%;}
にして、pをdivにしてみました。
でもやはり先程とおなじでした。
とにかく、「適当な匿名の（インライン）要素だと解釈した。」っぽいかもしれません。

393 ：Name_Not_Found：04/04/04 00:53 ID:???

>>388
＞<br>～<br>
ここが意味不明。実際はどうしてるの？

仕様では、ボックスサイズを算出する際にはフロート化された子孫要素は除外されます。
cf.
http://cssbug.at.infoseek.co.jp/detail/winie/b053.html
http://cssbug.at.infoseek.co.jp/detail/winie/b079.html

394 ：388：04/04/04 00:53 ID:???

自己レスです。
http://cssbug.at.infoseek.co.jp/detail/winie/b053.html
float化された子孫要素の分は、幅や高さの算出に除外されるのが正しいんですね。

私が考えていた回避策で、親の.bigboxの中に直接文字を入力するのがあったのですが
それができた理由がわかりました。
2番目の.floatboxをfloatさせないか、.bigboxにheight等のプロパティを指定すれば
OKでした。
結局回避策の話しになってしまいました。ってか、スレを俺メモにしてしまって
すみませんでした…。

395 ：Name_Not_Found：04/04/04 00:58 ID:???

>>7に全部書いてありましたとさ。
http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2

396 ：388：04/04/04 01:00 ID:???

>>393
ありがとうございました。私もちょうどカキコを見る前にわかって
かぶってしまいました。ごめんなさい。
<br>～<br>はソースをカキコ用にはしょった際に残してしまった残骸です。
意味はありませんです。では、今度こそ消えます。

397 ：Name_Not_Found：04/04/04 01:13 ID:???

>>378
・まず、font-size:100px のインライン要素を置き、その次に見出しの文言を vertical-align:bottom で置く。
・h1 の height:m px; padding-top: n px; と書き、m + n = 100px となるよう調整。
・h1 の中にセルが一つだけの table を置き、td に vertical-align:bottom を指定。

いろいろ試したけど、tableがいちばん結果が良かった…。
何かないでしょうかねえ、他に。

<style type='text/css'>
h1.midasi3 { border: 1px solid black; }/* ボーダーが見えるように */
h1.midasi3 { width:200px; height:100px}
table.midasi3 {border-collapse: collapse}
table.midasi3, tr.midasi3, td.midasi3 { height:100px; vertical-align: bottom; border-width:0px; font-size:25px;}
/*フォントサイズは自由に変更可能*/
</style>

<h1 class='midasi3'>
<table class='midasi3'><tr class='midasi3'><td class='midasi3'>見出し３</td></tr></table>
</h1>

398 ：Name_Not_Found：04/04/04 01:21 ID:???

きったねーｗ

399 ：397：04/04/04 01:31 ID:???

あと一つ、（透明）GIF をインライン要素として使う方法。
これも寸法がぴったり出る。しかし、こんなの CSS でやることじゃないよね。

<style type='text/css'>
h1.midasi { border: 1px solid black; }/* ボーダーが見えるように */
h1.midasi { width:200px; height:100px;}
span.midasi {vertical-align:bottom; font-size:50px;}/*フォントサイズは自由に変更可能*/
img.midasi {width:0px; height:100px;}
</style>

<h1 class='midasi'>
<img class='midasi' src='firefox.gif'/><span class='midasi'>見出し</span>
</h1>

>>398 つくづく同意だけど、なんか他にない？

400 ：Name_Not_Found：04/04/04 01:35 ID:???

>>397
h要素にブロックレベルはいｒ

401 ：Name_Not_Found：04/04/04 01:43 ID:aBQZ+z9/

>>378
こんなのはどうでしょう？

#midasi{width:200;height:100;background-color:#ff6600;position:relative;}
span{position:absolute;bottom:0;}

<div>
<h1 id='midasi'><span>見出し</span></h1>
</div>

402 ：397：04/04/04 02:15 ID:???

>>401
素晴らしい！正直、感動しました。私が言ってもしょうがないのだけど。

403 ：Name_Not_Found：04/04/04 02:16 ID:???

>401
width と height、0 以外は単位がいるぞ。

個人的には

<div id="midasi">
<h1>見出し</h1>
</div>

で、span のスタイルは h1 に振る方が好きだな。
ちょっとばかし、論理的に見える気がする。気がするだけ。

404 ：Name_Not_Found：04/04/04 02:17 ID:???

ああ、見栄えありきのマーク付けするんならテーブル使えようぜー

405 ：Name_Not_Found：04/04/04 03:23 ID:???

んな、あほな

406 ：Name_Not_Found：04/04/04 03:49 ID:???

>>405
逆説的、って言葉は知らんか。

407 ：Name_Not_Found：04/04/04 08:15 ID:RDHhfrW2

xpを使っています。IE6.0です。
printが何行にもわたっている中にボタンを組み込みたいのですが、
エラーが表示され、うまくいきません。

print "";
print "";
print "";
print "";
print "<form>
<input type=button value="戻り" class=s onClick="history.back()">
</form>";

408 ：Name_Not_Found：04/04/04 09:16 ID:???

>>407
それ
cgi

409 ：Name_Not_Found：04/04/04 09:26 ID:???

>>408
ありがとうございます、なぜかスタイルシートと間違えてました。
今度こそcgiのところいってきます。

410 ：Name_Not_Found：04/04/04 11:58 ID:???

>>407
一応言うけど、属性値とかに使う"は\"って書こうな。

411 ：Name_Not_Found：04/04/04 12:04 ID:???

print <<EOH;

<form>
<input type=button value="戻り" class=s onClick="history.back()">
</form>

EOH

ってヒアドキュメントにしちまえよ。

412 ：378：04/04/04 13:28 ID:mXkeieN5

みなさん、いろいろ考えてくださり、ありがとうございました。
考慮した末、>>401-403にしようと思います。

<style type="text/css">
#midasi {
width: 200px;
height: 100px;
background-color: #ff6600;
position: relative; /* 基準ブロック化 */
}
h1 {
position: absolute;
bottom: 0;
}
</style>

<div id="midasi">
<h1>見出し</h1>
</div>

413 ：Name_Not_Found：04/04/04 13:31 ID:jGPKDSCy

ページでエラーが発生しました
と、出たり出なかったりするの何ですか？
あと、ライン9とか文字6とかってどこでしょうか

414 ：ｽｰﾊﾟｰﾏｶｰ ◆MacPRJestI ：04/04/04 13:36 ID:noRyT17Y

>>413
出たり出なかったりってよくわからんけど
一番上の行から９行目の６文字目辺りに問題があるってことじゃない

415 ：Name_Not_Found：04/04/04 13:46 ID:jGPKDSCy

>>414
うーん、6行目はtitlle・・・。おかしくないはず。。。
http://ryu-purity-tube.hp.infoseek.co.jp/03as01.html
見てください。エラーが発生しなかった場合は、
下にある「次へ」押してもらって､下の「前へ」押してもらえば出ると思います。
ってか1～3ページまでエラーが発生するんですが；；

416 ：Name_Not_Found：04/04/04 13:58 ID:???

バカヤロー <body ...onload="...."> の最後の「"」も「>」もないぞ!
こんなエラーも見つけられない奴はWeb製作する資格なし!
しかも糞重い画像満載、二度と見たくない。

417 ：ｽｰﾊﾟｰﾏｶｰ ◆MacPRJestI ：04/04/04 13:58 ID:xar21+A0

僕の環境ではエラー出なかったんですけど(Mac・IEとSafariで確認)
Line9っていうと
<div align="center">
に問題があるってことなんで、もしかしたらisweb側に問題があるかもしんないです
一度サポート掲示板とか、サポートの方にメールしてみてはいかが。

実際のエラー見てないので具体的に回答できないですごみんなさい

418 ：Name_Not_Found：04/04/04 14:06 ID:???

そんなことより前にブラウザでview sourceしてiswebが加工した後の
実際にブラウザに載っている状態のHTMLを確認すれ! それが先決だろ!

419 ：Name_Not_Found：04/04/04 14:18 ID:jGPKDSCy

>>416
">付けたらよけいにエラー発生してしまいましたが。
>>418
。。。スイマセンよく分からないのですが・・・

420 ：Name_Not_Found：04/04/04 14:27 ID:???

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<link rel="stylesheet" href="dat.css">
<title>2003東京オートサロンレポート</title>
<body bgcolor="#000000" text="#CCCCCC" vlink="#666666" topmargin="0" leftmargin="0" onLoad="MM_preloadImages
<div align="center">
<div align="center">
<center>
<center>
<div align="center"> 03/01/12 <p>2003東京オートサロンレポート</p>
<p>その２</p>
<table border="1" cellpadding="0" cellspacing="2" width="590">
<tr>
<td><img src="img/event/03autosalon/P1120020.jpg" width="320" height="240" border="0"></td>
<td><a href="http://www.s-2.co.jp/nkb/" target="_blank">NKB
POWER</a>のゴルフカブリオレ</td>

……ひどいソースだな。<HEAD>も<BODY>も閉じてない。致命的だぞ。
他にもツッコミどころ満載。まずHTMLを直せ。

421 ：Name_Not_Found：04/04/04 14:33 ID:???

もうHTMLも記述できねーやつはプレーンテキストで情報配信しろよな。

422 ：Name_Not_Found：04/04/04 14:34 ID:???

どうして初心者にそういうこと言うんですか･･･

423 ：Name_Not_Found：04/04/04 14:57 ID:???

onLoad="MM_preloadImages"はいいが、肝心のscriptはどこよ。
見当たらないんですけど。

424 ：Name_Not_Found：04/04/04 14:58 ID:???

>>422
初心者の為に言ってるんだ、正しいHTMLを書かないと、CSSだって思惑通りには効かない。

425 ：Name_Not_Found：04/04/04 15:17 ID:jGPKDSCy

>>423
多分消しました。
他の所のｿｰｽ改造(？)してたんです。
で、そこはフレームのぺージで、
僕のは普通のページだったんで、横にフレームとか出たままで､
どうやって消すのか分からず、ちょｚつとづつ消していた所､
こうなってしましました。。。

426 ：Name_Not_Found：04/04/04 15:29 ID:???

>>425
なるほどわかったよ。まずはHTMLの文法をどっかの入門サイトで
学ぼうね。タグの <...> の「>」だけ消すとか "..." の閉じる「"」
だけ消すとかしてたら見せられた方が怒って当り前だろ。ちょっと
ずつ消せば直せるっていうもんじゃないの。それ以上言うことはない。

427 ：Name_Not_Found：04/04/04 16:06 ID:???

＞多分消しました。
はぁ。そうですか。じゃあScriptはリンクさせて無いんですね。
じゃあ何処からMM_preloadImages関数は沸いてでてくるんでしょう。

428 ：Name_Not_Found：04/04/04 16:06 ID:???

関数じゃなくてクラスか。

何にしろ、一からソース直しましょうね。

429 ：Name_Not_Found：04/04/04 16:35 ID:???

なにこのスレ＿|￣|○

430 ：Name_Not_Found：04/04/04 16:48 ID:???

CSS以前に文書の書き方が間違ってる。
Web制作初心者スレにでも行って勉強しなおしてください。

(はちゃめちゃな)論文書いて提出しても認められませんでした。
なんででしょう？

って聞いてるのと同じだ。

431 ：Name_Not_Found：04/04/04 16:57 ID:???

>>428
関数だよ、単に関数呼び出しの「(...)」も全部消してみたんだろう(笑)
そもそもあのソース、関数が未定義とかいう指摘をするはるか以前の
状態でしょ。

432 ：Name_Not_Found：04/04/04 17:45 ID:???

>>422
まるで、初心者運転なら人をひき殺しても許されると思ってるような言い方だな。

433 ：Name_Not_Found：04/04/04 17:57 ID:???

なんかとんでもないのが現れてるね。
みなさんの心中お察しします。

434 ：Name_Not_Found：04/04/04 18:40 ID:???

>>420
ﾜﾗﾀ

435 ：Name_Not_Found：04/04/04 18:56 ID:???

あれだ、413はビルダーでも使えｗ

436 ：Name_Not_Found：04/04/04 19:04 ID:???

>>417 の「エラーの出なかったブラウザ」もかなり（ｒｙ

437 ：Name_Not_Found：04/04/04 19:05 ID:???

IE6で
p:first-line {color:red;}は効いて
p:first-line{color:red;}は効かないんですが、バグでしょうか？

438 ：413・415：04/04/04 20:09 ID:jGPKDSCy

戻してみました・・・。
http://ryu-purity-tube.hp.infoseek.co.jp/01as.htmｌ
ここの左側のフレーム外すのにはどこをどう変えればいいですか･･･
本当にスミマセン。
宜しくお願いします

439 ：Name_Not_Found：04/04/04 20:26 ID:???

>>420
ひどいソースなのは同意だが、ツッコミどころを間違っているぞ。
HEAD要素もBODY要素も終了タグ省略可。

440 ：Name_Not_Found：04/04/04 20:27 ID:???

>>437
バグ

だと思ったら自分で確認してから言え。

441 ：Name_Not_Found：04/04/04 20:34 ID:???

>437　セレクタと{（左中括弧）の間に空白を入れればよい。
たぶん、その方が安全。

>438　ここはCSSスレで、スレ違い。
せめてもうすこしまともなhtmlを書けるようになってから。

442 ：Name_Not_Found：04/04/04 20:50 ID:???

>>438
はスレ違いであることも分からないわけなんだろう。
ともかく、この状態で教える奴はいないと思う。
自分である程度は勉強しないと鼻つまみになるだけ。

443 ：Name_Not_Found：04/04/04 20:57 ID:???

下記のHTML文書を IE6 で観ると、リストアイテム間にマージンが生じてしまいます。
Opera7 では、ちゃんとくっついて見えるのですが、何が原因なのでしょうか？

http://cssbug.at.infoseek.co.jp/detail/winie/b071.html
この辺りに関連があるかな、と思いましたが、imgはもともとblock要素ですし、
補足で示されている回避方法を試してみましたが、やはり直りませんでした。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=shift_jis" />
<meta http-equiv="content-style-type" content="text/css" />
<title>CSS テスト</title>
<style type="text/css">
* { margin: 0; padding: 0; }
</style>
</head>
<body>
<ul>
<li><img src="hoge1.png" width="200" height="20" alt="hoge1"></li>
<li><img src="hoge2.png" width="200" height="20" alt="hoge2"></li>
<li><img src="hoge3.png" width="200" height="20" alt="hoge3"></li>
<li><img src="hoge4.png" width="200" height="20" alt="hoge4"></li>
</ul>
</body>
</html>

444 ：443：04/04/04 20:59 ID:K5FqgsUZ

失礼、age忘れたのでageます。

また、<img>要素の閉じ（/>）を書き忘れていました。すみません。
（書き足してもスペースは消えませんでした）

445 ：438：04/04/04 21:17 ID:jGPKDSCy

>>442
すいません。勉強してきます。
それから何故どこもあんなに難しく書いてあるんですか？
初心者には分からないのですよ､全く。
それは頭が悪いからと言われればそれまでですが、
初心者のためのページで作られたんじゃないんかな？
ってつくづく思います。
とほほ以外で1番オススメんは所を教えて欲しいです。
テンプレのﾄｺﾛは難しいです。

446 ：Name_Not_Found：04/04/04 21:20 ID:???

>>445
スレ違いです。

447 ：Name_Not_Found：04/04/04 21:23 ID:???

>>445
あの程度で難しいと思ってるなら素直にホームページビルダーなりなんなり
使ってる方が幸せ。
最初はみんな初心者だ、理解力があるかどうかなだけで言い訳にはならない。

とりあえずあれだ、入門書でも1冊買ってこい。

448 ：371：04/04/04 21:30 ID:???

遅レスですが
>>379
style='border-bottom:0px'うまくいきました。
あまりにアホな質問なのに、レスありがとうございました。
精進します。

449 ：Name_Not_Found：04/04/04 22:01 ID:???

>>445
国語から勉強し直して「読解力」を身に付けたらどうだ。
国語能力が乏しい人間は HTML を理解することができない。
HTML を理解することができない人間は CSS も理解できない。

450 ：Name_Not_Found：04/04/04 22:04 ID:???

style=はｼﾝｸﾞﾙｸｫｰﾄでいけたんだ。
知らんかった。

451 ：Name_Not_Found：04/04/04 22:11 ID:???

>>445
ごめんね。ここの住人は、プログラミングができるぐらいの人が中心だから、
本当の入門者にどう接したらいいか、分からないんだと思うよ。
初心者に教えるには、単に技術に詳しいのとは違う、別の能力が要るから。

↓のスレッドの方が、いいアドバイスがもらえるかもしれない。
Webサイト制作初心者用スレ Vol.87
http://pc5.2ch.net/test/read.cgi/hp/1080742469/l20

452 ：Name_Not_Found：04/04/04 22:22 ID:???

>>445

>>4の上から5個目はどう?
Academic HTML
ttp://www.tg.rim.or.jp/~hexane/ach/
ここはかなり解り易いと思うが

情報がかなり古く、HTML3.2の説明だが
ttp://www.zaidan.iris.or.jp/ihpc/index.html
初心者向けには古すぎの問題もあると思うが、HTMLの
「しくみ」の理解にはなるかもしれない。

すれ違いsage

453 ：Name_Not_Found：04/04/04 22:25 ID:???

>>451
>>430で既に誘導してるのにそれすら読まずに初心者を盾に駄文を綴って
いる屑になんでそこまで優しくしてやらなきゃならんのかわからん。
おまいさんは優しいな。
ただ、どっちにしろHTMLがマークアップ言語である以上、日本語すら読
めないようじゃどこ行っても同じだろうけど。

さて次の質問ﾄﾞｿﾞｰ

454 ：Name_Not_Found：04/04/04 22:29 ID:???

>>445
はじめてのWebドキュメントづくり
http://www.asahi-net.or.jp/~sd5a-ucd/www/index.html
あたりが初心者向けでかつまっとうなHTML入門と思うが、どうか。

455 ：437：04/04/04 22:36 ID:???

>>441　の親切に感謝します。

456 ：Name_Not_Found：04/04/04 22:43 ID:???

>455
p.first-line { color:red } だけじゃなくて、
p.first-letter { color:red } も、同じ現象が出ますね。

これはバグだろうなあ。

457 ：Name_Not_Found：04/04/04 22:45 ID:???

いかん、訂正。
× p.first-line, p.first-letter
○ p:first-line, p:first-letter

いずれも IE6 です。

458 ：437：04/04/04 23:00 ID:???

>>441 >>456-457の方、真に申し訳ない…！
今、探していたら
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/selector.html#pseudo-elements
にて既知のバグだったことがわかりました。
すいませんm(_ _;)mこれからはもっと幅を広げてチェックします。
終わりにですが、レスしてくれてありがとうございました。

459 ：Name_Not_Found：04/04/04 23:08 ID:???

バグかなと思ったら、バグ辞典。

Internet Explorer (Windows) CSSバグリスト
擬似要素名称の直後に空白類文字を置かないと擬似要素が認識されない(6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b055.html

460 ：Name_Not_Found：04/04/04 23:15 ID:???

　>>372の質問をした者ですが、
これで回答をいただけない場合にはあきらめようと思います。
　よろしくお願いします。
　そして、今までの返答ありがとうございました。

461 ：Name_Not_Found：04/04/05 00:14 ID:???

[2004-04-02] [機能追加] 「JUGEMではじめるスタイルシート講座」スタート

http://jugem.cc/?mode=SUPPORT&page=css
http://www.yasuhisa.com/could/entries/000457.php

462 ：Name_Not_Found：04/04/05 00:15 ID:???

>>460　？　何が訊きたいのやら。

463 ：460：04/04/05 00:29 ID:???

>>462 えーと、
「HTMLで
<p><a href="http://nantoka">あいうえお</a></p>
とし。CSSにて
p{line-height:2;width:200px;}
と、line-heightを1より大きな値などにした後、
InternetExplorer6.0でブラウズしているとき、activeの状態、
というよりマウスでクリックしている状態にすると、
破線で囲われる範囲が本来の文字の縦幅よりも下に伸び、
はみ出てしまう。」
というバグらしき現象の説明かなにかを載せているサイトはありませんか？
ということなんですが。

464 ：Name_Not_Found：04/04/05 00:45 ID:???

>>463
バグ辞典スレッドに書き込んできたら？
http://pc5.2ch.net/test/read.cgi/hp/1078463560/l50

例に
p a:active {background:red;}
とか追記した方がわかりやすいかも。
それともWinIEの対応だと :focus かな。
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/selector.html#pseudo-classes

465 ：Name_Not_Found：04/04/05 00:53 ID:???

>461　それ、応用力がぜんぜん身につきそうにないね。
>463　とりあえず、ソースがないと検証のしようがないよ。

466 ：Name_Not_Found：04/04/05 00:57 ID:???

>>465　？ >>463にソースあるぢゃない。
＞<p><a href="http://nantoka">あいうえお</a></p>
＞とし。CSSにて
＞p{line-height:2;width:200px;}
＞と、line-heightを1より大きな値などにした後、

467 ：Name_Not_Found：04/04/05 01:02 ID:???

>>464
>それともWinIEの対応だと :focus かな。
読み間違えてないか？　WinIE は:focus疑似クラス
に対応してないけど、a:active {} と記述すると何故か
a:active, a:focus {} みたいに解釈されるってことでしょ。

468 ：Name_Not_Found：04/04/05 02:21 ID:???

>>461
豆字固定してる奴がえらそうにCSS教えるなよなあ。

469 ：Name_Not_Found：04/04/05 03:00 ID:???

>>468
漏れもそう思った。
>プロパティと呼ばれるレイアウトのどの部分の見た目を変えたいのか指定するコマンド
とかイタ過ぎ。
「見た目」「レイアウト」とかってヽ(´ー`)ﾉ
初心者には音声スタイルシートの存在は隠蔽かね。
「コマンド」って、CSS は命令なんてできねぇよ。

470 ：Name_Not_Found：04/04/05 03:08 ID:???

>>469
やけに上に空白があると思ったらflashのメニューか
css使い=ちゃんとアクセシビリティ考えてるって思ったんだがな

471 ：Name_Not_Found：04/04/05 03:27 ID:???

>>438
404なんだが

472 ：Name_Not_Found：04/04/05 03:28 ID:???

そして思いっきりリロードを忘れていたわけだが

473 ：443：04/04/05 13:34 ID:???

（´Д｀；）…　質問の仕方が悪かったのかしらん

474 ：Name_Not_Found：04/04/05 14:03 ID:???

>>473
たぶんバグ。
li{ margin-bottom : -3em }
なんてふざけた事やったら丁度よくなったけど、他のUAで死ぬだろうな。

475 ：Name_Not_Found：04/04/05 14:10 ID:???

>>443
>imgはもともとblock要素ですし
いいえ。imgは置換インライン要素です。

476 ：Name_Not_Found：04/04/05 14:17 ID:???

>>443
>* { margin: 0; padding: 0; }
これ、一体何がやりたいんだ？
ul, li {margin:0; padding:0;} ではいかんのか。

そもそも、「リストアイテム間にマージンが生じてしまいます」っての、再現しないし。
だから>>474も意味不明。当方、IE6で確認。

477 ：Name_Not_Found：04/04/05 14:24 ID:???

>>476
再現する。お前の確認が糞。

478 ：Name_Not_Found：04/04/05 14:39 ID:???

>>443=>>473
img のvertical-alignの値がbaseline以外(bottomやtopやtext-bottomとか）なら、
大体（多分）意図通りに整形される様子。

479 ：Name_Not_Found：04/04/05 14:39 ID:???

わざとIEで崩れるページ作ってOperaマンセーしようとするカスが
居るよね。

480 ：Name_Not_Found：04/04/05 14:41 ID:???

>>477
煽らんでいいよ。本当に、再現しないものはしないんだから。
Netscape7.1とIE6.0とで同じ表示だった。Win98SEだ。
>>474の通りli{margin-bottom:-3em}としたら、リストが重なるだけで全然「丁度よく」なかったし。

img {background:red;}と指定して見たら、たしかに赤と赤の間に細い隙間が空くが、
もしかしてこれのこと言ってるの？
しかしこんなの>>443が「ちゃんとくっついて見える」と言ったOpera7.23でも空くしなあ。

481 ：476=480：04/04/05 14:46 ID:???

>>478
……？
img {vertical-align:baseline;}としてIE6で見ても、何も変化ないよ？
ソースは>>443のを丸ごと貼り付けただけだから、差異は無いはず。

482 ：Name_Not_Found：04/04/05 14:48 ID:???

>>481
「baseline『以外』」と書いたのですが。

483 ：Name_Not_Found：04/04/05 14:55 ID:???

>>478　Mozillaではそれやってもおんなじ。

あと、>>474の「丁度よくなった」てのは結局何だったんだ？

484 ：Name_Not_Found：04/04/05 14:57 ID:???

>>476
＞>* { margin: 0; padding: 0; }
＞これ、一体何がやりたいんだ？
＞ul, li {margin:0; padding:0;} ではいかんのか。
確認のための全称セレクタだろうが。そのくらい気づけ。

485 ：Name_Not_Found：04/04/05 15:03 ID:???

下記のソースで試してみ。
WinIE6 だと画像の下に「4px」ぐらい隙間ができるから。
Opera 7.2 や Mozilla だと隙間は発生しないからさ。

<style type="text/css">
li {
margin: 0;
padding: 0;
border: solid 1px;
}
img { display: block; }
</style>

<ul>
<li><img src="foo.png" width="200" height="20" alt="foo"></li>
<li><img src="foo.png" width="200" height="20" alt="foo"></li>
<li><img src="foo.png" width="200" height="20" alt="foo"></li>
<li><img src="foo.png" width="200" height="20" alt="foo"></li>
</ul>

>474の「丁度よくなった」てのは結局何だったんだ？
WinIE6 で margin-top: -4px で「丁度よく」なると思うけどどうよ。

486 ：Name_Not_Found：04/04/05 15:04 ID:???

確認のためなら、この場合 li {margin:0; padding:0;} だけで済むな。

487 ：Name_Not_Found：04/04/05 15:06 ID:???

>>485
px指定だと、閲覧者側が文字サイズ変更するとずれる予感だ

488 ：Name_Not_Found：04/04/05 15:06 ID:???

>>486
元の>>443には
img { display: block; }
なんて無かったぞ。それは別件のバグでしょ（>>443も引いてるけど）。

489 ：Name_Not_Found：04/04/05 15:06 ID:???

結局>>480の使ってるIEは特別せいなんだろ

490 ：488：04/04/05 15:08 ID:???

「>>486」は「>>485」の誤記。すまぬ。

491 ：Name_Not_Found：04/04/05 15:09 ID:???

>>489
たぶん>>474のが特別製かと。

492 ：Name_Not_Found：04/04/05 15:12 ID:???

>>485
>WinIE6 で margin-top: -4px で「丁度よく」なると思うけどどうよ。
でも>>474はli{ margin-bottom : -3em }だぜ？　指定も結果も全然ちがふ。

493 ：Name_Not_Found：04/04/05 15:15 ID:???

>>487
px単位はem単位ではないのだから、文字サイズ変更と関係なく一定ではないのか――少なくともWinIEでは。

494 ：Name_Not_Found：04/04/05 15:18 ID:???

>>493
俺はpx単位だと、文字サイズ最大で1px空くけど。WinIE6。

495 ：493：04/04/05 15:22 ID:???

ああ、その意味か。>>494
margin-top: -4px は一定だけど、
IEバグ（#）で空く隙間は文字サイズによって一定でないからだね。

# http://cssbug.at.infoseek.co.jp/detail/winie/b071.html

496 ：Name_Not_Found：04/04/05 15:26 ID:???

-3emじゃなく、-0.25emなら-4pxと同等の効果が得られた。

497 ：Name_Not_Found：04/04/05 15:28 ID:???

ttp://ptba2.hp.infoseek.co.jp/cgi-bin/up/obj/obj2671_1.jpg

498 ：Name_Not_Found：04/04/05 22:17 ID:EvE6VKc2

win IE6
CSSで段組レイアウトしています。全体のセンタリング以外は狙いどおり
表示されています。ここでセンタリングをしようと思いまして、

<body>
<div>でここにマージン左右をオートにしたid追加
「段組のタグ（センタリング以外は狙いどおり）」
</div>閉じます
</body>

こんな感じでやってみましたがセンタリングされません。
なにか足りないのでしょうか？
センタリングさえ出来れば完成なんですけど、アドバイスお願いします。

499 ：Name_Not_Found：04/04/05 23:07 ID:???

ソースを略さず書こうよ

500 ：Name_Not_Found：04/04/06 00:20 ID:???

>>498

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html401/loose.dtd">
などをHTMLソースの一番上に入れ、標準準拠モードにして、
スタイルシートを
div { margin:auto;
width:50%;}
p { text-align:center;}
などと指定すればできませんか？

間違っていればどなたか指摘をお願いします。

501 ：Name_Not_Found：04/04/06 01:26 ID:???

>>498

502 ：Name_Not_Found：04/04/06 01:28 ID:???

↑
>>499
て書こうと思ったんだけどね＾＾;

503 ：Name_Not_Found：04/04/06 08:06 ID:???

OK、つまりはCSSを使ったブロック要素のセンタリングだな？
>>1

504 ：Name_Not_Found：04/04/06 11:35 ID:???

誘導されました。
http://pc5.2ch.net/test/read.cgi/hp/1080742469/

どうしても、ほんの少しスペースを空けてから文字を書きたい時に、
＆ｎｂｓｐ；を使う以外に、CSSでのスペースの空け方がある、
という事を聞いたのでこっちで質問します。

<p>
要素　スペース　要素　スペース　要素
</p>
と言う風にやるには、どうすればいいのでしょうか。

505 ：Name_Not_Found：04/04/06 11:36 ID:???

FAQ(>>5)
ブロックレベル要素をセンタリングする方法
http://www.mozilla.gr.jp/standards/webtips0004.html

506 ：Name_Not_Found：04/04/06 11:36 ID:???

>>504
512 名前：Name_Not_Found ：04/04/06 11:32 ID:???
要素ならタグで括る、これ当り前。
要素でなくて要素内の文字列なら、括らない。
word-spacingとかとかでスペースを調整する。

507 ：Name_Not_Found：04/04/06 12:24 ID:???

おい　礼儀正しく書いてるんだから、きちんと答えてやれよ。

508 ：Name_Not_Found：04/04/06 12:31 ID:???

>>504
ここの連中はちょっとひねくれてるから根気よくな。
それから、自分でも調べような。

509 ：Name_Not_Found：04/04/06 12:54 ID:???

>>507　word-spacingプロパティーか でやれってのは答にならんの？

510 ：Name_Not_Found：04/04/06 13:39 ID:???

自分が駆け出しだった頃を思い出してみようぜ。

511 ：504：04/04/06 13:42 ID:???

CSSスレの人たちはいい人ばかりでつね。
感動しますた。どうもありがとうございました。

512 ：Name_Not_Found：04/04/06 14:04 ID:???

すんません、CSSのON/OFFボタンの作り方って、どっかに解かりやすいのないですか？

513 ：Name_Not_Found：04/04/06 14:14 ID:???

>>512
WWWブラウザでも作るんか?

514 ：Name_Not_Found：04/04/06 14:49 ID:???

さすがに板違いだな

515 ：Name_Not_Found：04/04/06 15:06 ID:???

>>512
http://pc5.2ch.net/test/read.cgi/hp/991400015/l50

516 ：Name_Not_Found：04/04/06 16:11 ID:???

自分が駆け出しだったころは必死にネット這いずり回って勉強したもんだけどな

517 ：Name_Not_Found：04/04/06 16:40 ID:???

俺が昔駆け出しだったとき、弟は情報を小出しにしてた。
お母さんはかつおだしで味噌汁を作り、お父さんは中田氏で妹を作った。
わっかるかなぁ、わっかんないだろうなぁ、イェーイ。

518 ：Name_Not_Found：04/04/06 16:53 ID:???

>>517
松鶴家千とせがわからねえよ

519 ：Name_Not_Found：04/04/06 17:57 ID:???

>>518
知ってんじゃんｗ

520 ：Name_Not_Found：04/04/06 18:43 ID:???

>>512
昔このスレで拾ったもの
javascript:var i=0;if(document.styleSheets.length>0){cs=!document.styleSheets[0].disabled;for(i=0;i<document.styleSheets.length;i++) document.styleSheets[i].disabled=cs;};void(cs=true);

521 ：Name_Not_Found：04/04/06 18:51 ID:???

スタイルシートをオフにするボタンを作る方法
http://members.jcom.home.ne.jp/jintrick/Personal/d20022l.html#d17_35

522 ：Name_Not_Found：04/04/06 18:58 ID:???

523 ：443：04/04/06 20:40 ID:???

皆様ありがとうございました。
これはつまり、IEのバグという事でよろしいのでしょうか…？

>>478 の方法を採り、vertical-alignにtopを指定したところ、
IE6, Opera7, MozillaFirebird0.7 共に理想の表示になりましたので、
この方法でいきたいと思います。ありがとうございます。

全称セレクタ（*）についてですが、もともとのスタイルシート記述で
一番最初にこれを書く癖がついていまして、それをそのまま写した次第であります。
また、なるべく状況を再現しようとした、という意味もあります。
紛らわしい書き方をしてすいませんでした。

>>475 そうでした… orz

524 ：Name_Not_Found：04/04/07 09:48 ID:???

プルダウンがたのメニューの横の矢印の色を変えたいんですけど……

525 ：Name_Not_Found：04/04/07 09:50 ID:???

>>524
しつこい

526 ：Name_Not_Found：04/04/07 10:05 ID:???

実は本気です。ネットでやり方を探しているんですが載っていません。できないのでしょうか？

527 ：Name_Not_Found：04/04/07 10:14 ID:???

出来ない！！

528 ：Name_Not_Found：04/04/07 10:16 ID:???

いい加減この質問もテンプレに入れろ

529 ：Name_Not_Found：04/04/07 10:19 ID:???

ネットに載っていないというのは斬新な切り口だ。

530 ：Name_Not_Found：04/04/07 12:15 ID:???

なんで UI の体裁まで制御したがるかね。
認識しづらいスクロールバーの色変更とか、
意味もなくカーソル変更とか迷惑なんだよ。
ユーザビリティを知らない厨房が多すぎる。

531 ：Name_Not_Found：04/04/07 13:25 ID:vUq0mg6a

おぬしゃぁ　音声ブラウザに対応させちょるか？

532 ：Name_Not_Found：04/04/07 13:27 ID:???

えっらそうに・・　　　と自分でsageでつっこんでおく。

533 ：Name_Not_Found：04/04/07 13:27 ID:???

>>531
いんや。そのうち。

534 ：Name_Not_Found：04/04/07 14:09 ID:???

>>531
そこまでできる知識も技術も気力もない

535 ：Name_Not_Found：04/04/07 14:46 ID:???

>>531
W3C仕様や WCAG に沿って素直に作っているんで、
自然と対応できてしまっていたりしますが。何か。

536 ：Name_Not_Found：04/04/07 15:05 ID:???

パチパチ・・・・

537 ：Name_Not_Found：04/04/07 15:30 ID:???

>>535
文句なし

538 ：Name_Not_Found：04/04/07 16:47 ID:???

ページが色で囲まれた感じになるスタイルシートを
忘れてしまったので、誰か知っている
人いたら教えてください。

539 ：Name_Not_Found：04/04/07 16:49 ID:???

意味不明。

540 ：Name_Not_Found：04/04/07 16:49 ID:???

ヤ～ッホ～～　　次の方　お小水を先に取ってくださいね。

541 ：Name_Not_Found：04/04/07 17:05 ID:???

>>538
>>1

542 ：Name_Not_Found：04/04/07 17:08 ID:???

>>538
body { border: solid 1em #000000 ; }

543 ：Name_Not_Found：04/04/07 20:58 ID:???

>530　それも「デザイン」とやらのひとつだと考えているからでしょう。

スクロールバーの色をデフォルトで固定したいと思うものの、
デフォルトの設定が何なのかわからず・・・。
カーソルは
* {cursor: auto !important;}
でよいのですが。

544 ：Name_Not_Found：04/04/07 21:35 ID:???

で・・？

545 ：Name_Not_Found：04/04/07 22:06 ID:???

ユーザビリティは専用スレあるんでそっちで

546 ：Name_Not_Found：04/04/07 22:42 ID:???

はいよ。

547 ：Name_Not_Found：04/04/08 00:00 ID:???

div{width: 450px;}
span{position:absolute; bottom:15px;}で、

<div>
文章1
<span>文章2</span>
</div>

とすると、NN7で表示した時に文章2がdivで指定した横幅からはみ出てしまいます。（IEだとはみ出ないけど）
はみ出させないための方法がありましたら教えていただけると助かります。
（訳あってspanの幅指定はしたくないので、それ以外の方法で…）

548 ：Name_Not_Found：04/04/08 00:07 ID:???

どんな訳？

549 ：Name_Not_Found：04/04/08 00:09 ID:???

>>547
新規質問は上げて。

position:absolute;の意味はわかってますか。
通常フローを無視するんですよ。
何のために絶対配置してるんですか。

550 ：Name_Not_Found：04/04/08 00:38 ID:???

>>547
横槍余談ですが、spanのようなインライン要素はwidthプロパティは指定できないです。
IEでできてしまうのは、バグです。

551 ：547：04/04/08 00:38 ID:???

>>548
別の場所にも多量にspan使用してるので、ここで幅指定してしまったら
色々と直さなきゃいけなくなるのがめんどくさかっただけです、すいません…

>>549
わかってませんでした…。

ええと、divのほうにposition:relative追加すればいいのでしょうか？

552 ：547：04/04/08 00:40 ID:???

>>550
うわそうなんですか、知りませんでした。もっとしっかり勉強します。

553 ：Name_Not_Found：04/04/08 03:03 ID:???

>>543
システムカラーを!importantで設定する
設定する箇所がやたら多いがまぁ面倒くさがらずやっとけ

554 ：Name_Not_Found：04/04/08 04:29 ID:???

scrollbar-3dlight-color: ThreeDHighlight !important;
scrollbar-arrow-color: ButtonText !important;
scrollbar-base-color: Scrollbar !important;
scrollbar-darkshadow-color: ThreeDDarkShadow !important;
scrollbar-face-color: ThreeDFace !important;
scrollbar-highlight-color: ButtonHighlight !important;
scrollbar-shadow-color: ThreeDShadow !important;
どっかで見てそのままｺﾋﾟﾍﾟしてたんだが、これで合ってんの?
あと scrollbar-track-color が分からん。
たしか Scrollbar になっていて、明らかに違和感があったので消した気がする。

555 ：554：04/04/08 04:46 ID:???

すみません。Jane のログ漁ってたら、こんなのを見つけました。
/* CSS、スタイルシート質問スレッド【11】 */
http://pc5.2ch.net/test/read.cgi/hp/1031773943/410
全部 transparent でいいみたいです。

556 ：Name_Not_Found：04/04/08 06:31 ID:EJjZyt2+

http://goldnet.ii2.cc/~akt/tenp.html
UPしてみたのですが。。「文字に影をつけています（影の透過あり）」の
下の行とその二つ下の行に改行が入ってしまいます。
入らないようにするにはどうしたらいいでしょうか。
あと他にも明らかにおかしな点があればお願いします。
CSSかHTML、どちらが原因かわからないのでこちらに書かせてもらいました。
宜しくお願いします。

557 ：Name_Not_Found：04/04/08 08:09 ID:???

むしろ正しい所を探した方が早いな

558 ：Name_Not_Found：04/04/08 08:14 ID:???

>>550
position: absolute を設定すると、強制的に display: block; に設定されるはずので
widthを指定しても問題なし

559 ：Name_Not_Found：04/04/08 08:24 ID:???

ソース見たけど・・・・
改行がどうのというより、根本的に理解出来ていないような気がします。
　　どこで習ったの？

560 ：Name_Not_Found：04/04/08 09:47 ID:???

>>551
>別の場所にも多量にspan使用してるので、ここで幅指定してしまったら
>色々と直さなきゃいけなくなる

classやIDで絞り込み指定できるのを知らないのかな？

561 ：Name_Not_Found：04/04/08 10:04 ID:???

>>556
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

http://goldnet.ii2.cc/~akt/tenp.html を HTML4.0 Transitional としてチェックしました。
18個のエラーがありました。このHTMLは -33点です。タグが 20種類 24組使われています。

562 ：Name_Not_Found：04/04/08 10:16 ID:???

>>556
ブロックレベル要素とインライン要素
http://www.mozilla.gr.jp/standards/webtips0015.html
「CSSを勉強し始めた人はまずこの概念を覚えなくてはいけません。」

563 ：Name_Not_Found ：04/04/08 11:25 ID:???

スクロールバー変えたらなんでいけないの？
デザインのうちじゃん。
カーソル変えるのはさすがにウザいけど。
なんのひねりもないただのページよりよっぽどいいや。

564 ：Name_Not_Found：04/04/08 11:28 ID:???

そんなとこばかりひねってもな……。

565 ：Name_Not_Found：04/04/08 11:34 ID:???

>>563
お前が思ってる以上にスクロールバーの色変えるのダサいよ。

566 ：Name_Not_Found：04/04/08 11:39 ID:???

おいらテーマごとにページの色調変えて、
スクロールバーもそれに合わせて変えてる・・・ orz

567 ：Name_Not_Found：04/04/08 11:42 ID:???

スクロールバーとステータスバーはいじって欲しくない２大要素だな。

あとブラウザサイズ。
勝手に最大化すんな。
揺らすな。

568 ：Name_Not_Found：04/04/08 12:07 ID:???

>>565
あなた自分のサイト持ってますか？
よっぽどデザインもセンス抜群なんでしょうねぇ。

569 ：Name_Not_Found：04/04/08 12:19 ID:???

スクロール・バーをセンス良く配色したページって滅多に無いね。
挙句の果ては、見にくかったりつかみづらかったり。

570 ：Name_Not_Found：04/04/08 12:30 ID:???

>>568
うん　抜群だよ。
中身が無くてスクロールバーとステータスバーをいじっているのは
自己満足が多いな。

571 ：Name_Not_Found：04/04/08 12:37 ID:???

>>570のサイトは中身がないがセンス抜群ということで

そろそろ次の質問どぞー

572 ：Name_Not_Found：04/04/08 12:39 ID:???

質問しにくいな。

573 ：Name_Not_Found：04/04/08 12:40 ID:???

なんで知ってんだ？

574 ：Name_Not_Found：04/04/08 12:50 ID:Wo1W+qZK

君たち。

<body bgcolor="white">
<table width="100%" height="100%" border="1" bordercolor="black"><tr align="center"><td>
<font size="3"><b>ぼくのぺえじ<br>いりぐち</b><br><br><br>
<a href="index.html">えんたあ</a></font>
</td></tr></table>
</body>

をCSSで実現するのはどうすればいいの？
つまり「えんたあ」を画面のサイズに関わらず真中に置きたいわけだけど。
CSSだとテーブル使っちゃいけないんだべ？え？いいんですか？

575 ：Name_Not_Found：04/04/08 12:54 ID:???

>>574
>>8

576 ：Name_Not_Found：04/04/08 12:57 ID:???

>>574
君。
なんでFAQを見ないで質問するの？　>>8に書いてあるわけだけど。

577 ：Name_Not_Found：04/04/08 12:59 ID:???

>>574
table要素にはheightなんて属性は無いしな。
http://www.ne.jp/asahi/minazuki/bakera/html/reference/table#table

578 ：Name_Not_Found：04/04/08 13:06 ID:???

>>574
というか今時スプラッシュページはかなりダサイ。
下らない体裁を考える前に、内容を充実させろよ。

579 ：Name_Not_Found：04/04/08 13:12 ID:???

多分　宿題じゃない？

580 ：Name_Not_Found：04/04/08 13:14 ID:???

>>574
表ならばtableでよい。
線形化してあれば、レイアウトにも可。推奨はしないが。

581 ：Name_Not_Found：04/04/08 13:21 ID:???

すんませんでした。
後から気付いたけど後の祭り…。

582 ：Name_Not_Found：04/04/08 13:41 ID:???

>>578
人のサイトに文句つける権利はお前にはない。

583 ：Name_Not_Found：04/04/08 13:41 ID:???

何言ってるんだこいつは・・・

584 ：Name_Not_Found：04/04/08 13:57 ID:???

ダサいとは思うけど、ダサいかどうかを判定するスレじゃないだろここは。

585 ：Name_Not_Found：04/04/08 14:30 ID:???

ダサイというか無駄。邪魔

586 ：Name_Not_Found：04/04/08 14:36 ID:???

お約束

　　お前モナー

587 ：Name_Not_Found：04/04/08 14:52 ID:???

何でも邪魔邪魔いう奴のサイトが見てみたい。

588 ：Name_Not_Found：04/04/08 15:02 ID:???

何でもじゃないよ、邪魔なものだけしか邪魔って言わないよ

589 ：Name_Not_Found：04/04/08 15:10 ID:???

>>1の１行目を10回嫁
で、質問スレで議論にもなっていない雑談でスレを浪費する
おまえらのレス自体が邪魔だと言うことに気づけ

590 ：Name_Not_Found：04/04/08 15:56 ID:???

そういうのが１番邪魔。

591 ：Name_Not_Found：04/04/08 16:44 ID:???

まあまあ・・
助さん格さん納めてきなさい。　ハハー

592 ：Name_Not_Found：04/04/08 19:26 ID:???

リンクをボーダーで囲みたいのですが、

A:link{ font-size: 14px; border-width: 4px; border-style: outset;
border-color: black; padding-left: 12px; padding-right: 12px;
text-decoration: none; color: white;
}

と書いてもボーダーがでません。
対象ブラウザはIE4以上ですよね？IE5でテストしています。

すみません、よろしければ教えてください。

593 ：Name_Not_Found：04/04/08 20:22 ID:???

visitedとか確認した？

594 ：Name_Not_Found：04/04/08 20:29 ID:???

div

595 ：Name_Not_Found：04/04/08 20:39 ID:???

>>593
レスありがとうございます。
A:visitedもA:linkと全く同じにしています。
それが問題なのでしょうか？

596 ：Name_Not_Found：04/04/08 20:48 ID:???

非置換インライン要素のボーダーは5.5以上

597 ：Name_Not_Found：04/04/08 20:50 ID:???

>>594
レスありがとうございます。
divですか？
<a href="#">ENTRANCE</a>じゃだめなんですか？

598 ：Name_Not_Found：04/04/08 20:54 ID:???

>>596
レスありがとうございます。
そうなんですか？
すみません、勉強不足でした。

593、594、596
ありがとうございました。

599 ：512：04/04/09 04:58 ID:???

スタイルシートON/OFFで質問した者です。遅レス申し訳ないです。
スタイルシートの切り替えなんて根気ないし、だったらON/OFF付けてみようかな？ってカンジでした。
意味は？と聞かれるとつらいですが

600 ：↑：04/04/09 05:35 ID:???

そぉー　つらいこと　お姉さんに話してごらん。

601 ：Name_Not_Found：04/04/09 11:29 ID:5QZ1FEeG

質問です。CSSファイルにスクロールバーカラーを書いているのですが、反映されません。
しかし、HTMLファイルの２行目にある"h**p://www.w3.org/TR/html4/loose.dtd">を消すと反映されるのです。
"h**p://www.w3.org/TR/html4/loose.dtd">は検索エンジン対策で重要と聞き、なるべく消したくないのですが…。
どなたか解決策知っていたら教えていただきたいです。

602 ：Name_Not_Found：04/04/09 11:32 ID:???

モードの違いをお勉強しましょう。

603 ：Name_Not_Found：04/04/09 11:44 ID:???

>>601
文書型　DOCTYPE　宣言

あと>>602のキーワード

604 ：601：04/04/09 11:56 ID:???

>>603

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
これではだめなんですか？

605 ：Name_Not_Found：04/04/09 11:57 ID:???

>>604
かまわんよ。

606 ：Name_Not_Found：04/04/09 12:04 ID:???

602 603を使って検索してごらん。

　モードの勉強すれば理由がわかるよ。　つーか調べてから出直してこい！！！

607 ：601：04/04/09 12:07 ID:???

>>605

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

でわ何が悪くてスクロールバーカラーが反映されないのでしょうか？
ちなみにCSSには

body {

scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #FFFFFF;

}
こう書いてます。

608 ：Name_Not_Found：04/04/09 12:12 ID:???

>>607
>>606嫁
手っ取り早く言うと"http://www.w3.org/TR/html4/loose.dtd"があるのと無いのとでは
IEの挙動が変わる。無いのが糞モードで、あるのが正しいモード。
つまりスクロールバーの色を変えるってのは、糞ってこと。
糞を承知で変えるなら何も言わん。

609 ：Name_Not_Found：04/04/09 12:17 ID:???

>>601
本来なら >>1読め　で終わるところを検索のヒントまでだした602と603は
おまいの事を妙齢な美女と思っているに違いない。

610 ：Name_Not_Found：04/04/09 12:19 ID:???

>>609
見抜かれたかorz
昼飯の準備終わった主婦だろうがな。

611 ：Name_Not_Found：04/04/09 13:46 ID:???

>>601
html, body { /* 宣言 */ } と設定する。
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp

612 ：Name_Not_Found：04/04/09 15:09 ID:???

(´ι _` 　)

613 ：Name_Not_Found：04/04/09 15:16 ID:???

もっと釣ってくれ(；´Д｀)ﾊｧﾊｧ

614 ：Name_Not_Found：04/04/09 15:17 ID:???

メル欄会話なんかで質問スレのレスを消費しないで欲しい

615 ：Name_Not_Found：04/04/09 15:17 ID:???

↓再開

616 ：Name_Not_Found：04/04/09 20:18 ID:???

>>611　そりゃ～601には無理だわ。

617 ：Name_Not_Found：04/04/10 00:03 ID:???

CSSでルビを表示する事はできませんか？

618 ：Name_Not_Found：04/04/10 00:22 ID:XHbfeFO4

内容がないときにそのボックスをdisplay:noneと同じように扱わせるような指定があったと覚えろげに記憶してるのですが、
どんな命令でしたでしょうか・・・。

619 ：Name_Not_Found：04/04/10 01:18 ID:???

>>617　http://www.akatsukinishisu.net/itazuragaki/id/ruby_style_in_opera_20031226
>>618　visibilityのことか？

620 ：Name_Not_Found：04/04/10 10:44 ID:???

まて、覚えろげって何だ？
つか、野次を飛ばす訳じゃないんだが
何をﾐｽﾀｲﾌﾟして「覚えろげ」になったんだ？

621 ：Name_Not_Found：04/04/10 10:49 ID:???

>>620
普通に考えて
「おぼろげ」→「おぼえろげ」
だろ。

Ｒの隣にＥがあるからそう鬼の首を取ったようにはしゃがれてもな。
しかも１０時間越しか。
そんな餌に俺様がク（ｒ

622 ：Name_Not_Found：04/04/10 11:20 ID:???

まあ　あれだ 618 の頭にエロゲーがこびりついていて
思わず書いてしまったというのが真相のようだ。

623 ：Name_Not_Found：04/04/10 11:38 ID:???

おぼろげ→朧気

どう考えても「覚えろげ」を変換して朧気にはならないだろ。

624 ：Name_Not_Found：04/04/10 11:39 ID:???

>>623
>>621

625 ：Name_Not_Found：04/04/10 11:58 ID:???

ものわかえりのわえるいやつめ。>>623

626 ：Name_Not_Found：04/04/10 13:24 ID:???

やっばり >>622 じゃね？

627 ：Name_Not_Found：04/04/10 13:57 ID:???

なんの得にもならない自分のレスの正当化に
貴重な週末のひとときを費やせる>>620が羨ましい

628 ：Name_Not_Found：04/04/10 14:24 ID:ireEzOc8

IE3はlinkタグ2つ以上書けば最後のlinkタグだけ読みに行くってあるじゃないっすか、
1つ目に普通のrel="stylesheet"のlinkタグ
2つ目に代替のrel="alternate stylesheet"のlinkタグ
にしたらIE3はどういう挙動をするのでしょうか？
2つ目を読むのか、代替未対応なので1つ目を読むのか、2つ目を読もうとして失敗するのか？
もしくはIE3がDLできるとこ知りませんでしょうか？

629 ：Name_Not_Found：04/04/10 14:30 ID:???

http://pc5.2ch.net/test/read.cgi/hp/1081487905/98

630 ：628：04/04/10 14:43 ID:???

>>629
ありがとうございます。IE3 DLできました。
自己レス：2つ目を読もうとして失敗したみたいですた。

631 ：Name_Not_Found：04/04/10 16:28 ID:Ot03j47u

スタイルシートを学校で習わされたが結局忘れてしまった。
何かと便利だった気がしたなあ

632 ：Name_Not_Found：04/04/10 16:37 ID:???

>>631
ageてるから釣りか？

まあHP作っている人にはCSSは必要だから
今後HPを作るときに今まで勉強してきたことが
役に立つと思うよ。

633 ：Name_Not_Found：04/04/10 17:37 ID:???

HPダサイ。

634 ：Name_Not_Found：04/04/10 18:27 ID:???

ホムペ　ホムパゲ　マルハゲ

635 ：Name_Not_Found：04/04/10 18:31 ID:???

ホムペ(・∀・)ｲｲ!!

636 ：Name_Not_Found：04/04/10 18:37 ID:???

>>635
？

637 ：Name_Not_Found：04/04/10 18:41 ID:???

マルハゲ　呼んだ？

638 ：Name_Not_Found：04/04/10 19:37 ID:3rKO0mk9

xsltでRSS(mine-typeはapplication/xml)を変換すると
変換先のCSSのbackground-imageがMozillaのみ効かないのですけど
これはバグなんでしょうか?
ちなみに規則性はわかりませんが、効く場合と効かない場合があるようです。

639 ：Name_Not_Found：04/04/10 20:54 ID:???

変換後のHTML（or XML）は間違ってないか。CSSは間違ってないか。チェッカで確認汁

あと mine-type じゃない

640 ：Name_Not_Found：04/04/10 21:13 ID:???

パスの問題かもね。

641 ：638：04/04/10 22:47 ID:???

>>639
HTMLは問題ないです。
CSSは基本的にはvalidですがmozilla独自拡張が混ざってます。
やはり問題になってくるでしょうか?

>>640
絶対パスで指定しているので問題ないと思います。

642 ：Name_Not_Found：04/04/10 23:03 ID:???

携帯ってCSSに対応してないのでしょうか？
<center>とか<font>といったタグを使わないといけないのでしょうか？

643 ：Name_Not_Found：04/04/10 23:04 ID:???

試してみればいい

644 ：Name_Not_Found：04/04/10 23:10 ID:???

>>643
自分の持ってる携帯（ドコモムーバ、iモード）ではCSS書いても反映されないんですけど、
携帯は一般的にそうなのかな～と思い質問させてもらいました。

645 ：Name_Not_Found：04/04/10 23:13 ID:???

>>644
各キャリアの技術資料みればいいじゃん。
vodafoneはW型端末ならXHTML+CSSに対応してる。
他はしらね。

646 ：Name_Not_Found：04/04/10 23:18 ID:???

>>645
あっ、そうなんだ。
レス、サンクス。

でもCSSに対応してない機種があるから、結局、非推奨タグを使わないと
いけないっていうことか。

647 ：Name_Not_Found：04/04/10 23:50 ID:???

>>646
そもそも非推奨とか云々以前に一応DTDらしきものもあるぞ。
vodafoneの全機種用HTML1.20もきちんと仕様が定められてるし、
同じくW型用XHTMLはXHTML Basicだったはず。
単純に携帯キャリアとPCのHTMLを比較して非推奨云々とは言えない
と思われ。

648 ：Name_Not_Found：04/04/10 23:50 ID:???

>>644
auの比較的新しい機種(型番が1100以上の機種)は
ある程度CSSを解釈できるよ。

ただ、この辺はエミュレータを使って実際に見てみたほうが早いかもな。

649 ：Name_Not_Found：04/04/11 00:07 ID:???

>>647
>>648
分かりました。
サンクスです。

650 ：Name_Not_Found：04/04/11 00:13 ID:???

>646
> でもCSSに対応してない機種があるから、結局、非推奨タグを使わないと
> いけないっていうことか。
　それ以前に、<center>とか<font>といったタグを使う必要がない。
真ん中にしなくていいし、色変えなくていい。

651 ：Name_Not_Found：04/04/11 01:01 ID:???

良く考えたら、携帯の広告スレは乱立してるのに
以外にも携帯サイト制作の質問スレは無いんだな。

通りでこういうスレに携帯系の質問がたまる訳だ。

652 ：Name_Not_Found：04/04/11 01:12 ID:???

>>651
といって、DTDごとにスレ立てるのもなぁ。
まあどっちみちこのスレの役目ではないけど。

653 ：Name_Not_Found：04/04/11 01:16 ID:???

携帯端末用Web制作2
http://pc5.2ch.net/test/read.cgi/hp/1068355992/
これじゃねーの？
いい加減すれ違い。

654 ：Name_Not_Found：04/04/11 02:15 ID:???

>>653
本当にそれかな？
なんか質問スレのような空気が漂ってない。

655 ：Name_Not_Found：04/04/11 07:32 ID:???

>>646
タグ増やすとパケットも増える罠。

656 ：Name_Not_Found：04/04/11 10:39 ID:???

XSLTつかってケータイ向けにはloose.dtdで。
つーかパケ代も気にする時代じゃなくなってきているな

657 ：Name_Not_Found：04/04/11 11:09 ID:???

パケ代というよりも、むしろ転送量。軽い方がいい

658 ：628：04/04/11 18:24 ID:???

自己レス。skyzyx.comのIE3はcssできない仕様でした。
そんでﾘｻｲｸﾙｼｮｯﾌﾟのｺﾞﾐCDROM売場でIE3を100円でｹﾞﾄ。
正解は代替未対応なので1つ目を読むという動きでした。
それにしてもIE3ってEUCｺｰﾄﾞ自動判別できないのね。
yahoo・goo行っても文字化けでした。

659 ：Name_Not_Found：04/04/11 19:56 ID:???

で、何故IE3の挙動の理解が必要だったの？

660 ：Name_Not_Found：04/04/11 22:36 ID:???

http://www.katch.ne.jp/~aok/

このサイトの右上にあるフォームとボタンデザインをそろえるのって
どうやったらいいんでしょう？

widthで区切って、borderでフォームとボタンデザイン統一して、
ってのはわかるんですが、（border: 1px solid #999999;とか

幅がうまくそろわないんです。
（ボタンがちっさくなってしまう。

ご回答よろしくですます。

661 ：Name_Not_Found：04/04/11 23:00 ID:???

>660　positionを使っているもよう。CSSを直接見ればわかる。

どうでもいいことだが、あれはボタンに見えないな。

662 ：Name_Not_Found：04/04/12 17:38 ID:???

>>660-661
頑張れ

form input {
display: block;
width: 10em;
}

<form>
<input type="text" value="text">
<input type="submit" value="submit">
</form>

663 ：Name_Not_Found：04/04/12 23:34 ID:???

各OS(win mac)、
各ブラウザ(IE NN OPERA Safari)、
各version

のfont size line-height letter-spacingの違いをまとめてるサイトってないの？
あったら　おせーて（；´д｀）またはそれに関連するサイト

CSSによる振り分けをたくらんでるですが、
各環境をどのように振り分けたらよいかわからなくて。

CSSによる振り分けのスクリプトを知りたいんじゃなくて、
どの環境でもならべく同じ「見た目」を保つための「値」を知りたいんです。

664 ：Name_Not_Found：04/04/13 00:05 ID:???

どの環境でも同じ見た目を保とうと考えるのはやめた方がﾖﾛｼ
無理だから。

665 ：Name_Not_Found：04/04/13 01:05 ID:???

>>663
cssバグ辞典

これじゃ、ちょっと調べないとだめかな

666 ：663：04/04/13 01:28 ID:???

すいません、質問を変えます。

企業サイトをつくってるコーダーさんは、
どのプロパティーをどの程度まで調整しているんでしょうか？

667 ：Name_Not_Found：04/04/13 01:30 ID:???

>>666
雑談すれじゃねえですよ

668 ：Name_Not_Found：04/04/13 02:09 ID:???

>>666
必要とあらば、なんだって調整しますよ。
逆に不要ならば、触れませんが。

669 ：Name_Not_Found：04/04/13 02:10 ID:???

px指定だろ
だせーけどｗ

670 ：Name_Not_Found：04/04/13 02:46 ID:???

>>669
おうよ、仕事だからね。
アクセシビリチ <<< 見た目　なモノだし、企業サイトは。

漏れもよく px やめれ、って書いたりするけど、
IE の px で指定されたフォントの大きさを変更できないバグが
直っちゃったら、どうしよう。

671 ：Name_Not_Found：04/04/13 03:54 ID:???

IE以外のブラウザがもっとがんばってくれれば
アクセシビリチ >>> (IEの)見た目
になるかな？なるといいな。

672 ：Name_Not_Found：04/04/13 04:55 ID:???

>IE の px で指定されたフォントの大きさを変更できないバグが直っちゃったら、どうしよう。
ユーザー補助とか、ユーザースタイルシートなんて眼中にないってことか。
未だにウェブの特性を知らない糞企業ばかりだから反吐が出る。
クライアントが無知で馬鹿だから、ウェブデザイナーの仕事も一向に進化しない。

673 ：Name_Not_Found：04/04/13 08:12 ID:???

だから雑談スレじゃねぇつったのにな・・・

674 ：Name_Not_Found：04/04/13 09:06 ID:???

>>672
　　んだ。

雑談スレじゃねぇけど・・・

675 ：Name_Not_Found：04/04/14 03:02 ID:JpNlhn0J

テーブルの1セルの中に、１つづつ写真をいれて、
手抜き段組レイアウトをしました。

この写真を、セルの左上にぴったり合わせようと、
<td style="padding-top:0px; padding-left:0px;"><img・・・・></td>
としましたが、
左端にはぴったりつくのに、上下は真ん中にとどまったままです。

なんでだろう…。

676 ：Name_Not_Found：04/04/14 03:20 ID:???

>>675
line-height: 1.0; とかか？

677 ：Name_Not_Found：04/04/14 03:45 ID:???

>>675
vertical-align: top; かと。

678 ：Name_Not_Found：04/04/14 03:46 ID:???

>675　CSSは「継承」する。
親の要素に指定されたpaddingなどが影響していないとも限らない。
関係のありそうなソースを晒したほうがよろしいかと思う。

679 ：Name_Not_Found：04/04/14 04:00 ID:???

またぴったり厨か

680 ：Name_Not_Found：04/04/14 05:18 ID:???

>>678
CSSという仕様が「継承」するということか(w
CSSのプロパティは継承性を持つものがあるけど、
持たないものもある。padding は継承しない。

基本的知識のない人は、質問も、回答もしないで。

681 ：Name_Not_Found：04/04/14 11:15 ID:???

紙メディアでもスクリーンでも、
高さ関連もうちっと強くなってほしいなあ、CSSは。

682 ：Name_Not_Found：04/04/14 11:29 ID:???

なんで？

683 ：Name_Not_Found：04/04/14 13:49 ID:???

紙ならpdf、スクリーンならFlash使えばいいんじゃねーの
それぞれの特性を理解すべし

684 ：675：04/04/14 17:47 ID:JpNlhn0J

みなさんありがとうございます。

>>676
書いてみたのですが変わりませんでした。

>>677
ありがとうございます。うまくいきました。

ただ、上に寄せるだけであれば>>677さんの方法でも大丈夫なのですが、
同じものを右上に寄せたい場合、padding-right:0px;がやはり効かないため、
できません。
根本的な問題は同じなのだろうと思ったので…。

685 ：675：04/04/14 17:48 ID:JpNlhn0J

上で質問した部分とCSSを取り出したファイルを作ったところ、
問題が再現されましたので、そのソースをうpします。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>テスト</title>
<style type="text/css">

</style>
</head>
<body>
<table>
<tr>
<td><img src="getreader.gif"></td>
</tr>
</table>
</body>
</html>

よろしくお願いします。

686 ：Name_Not_Found：04/04/14 17:59 ID:???

>>675
画像をセルの右上にくっつけるんだったら
td
{
padding: 0;
vertical-align: top;
text-align: right;
}

だべ。

687 ：Name_Not_Found：04/04/14 18:05 ID:???

body{****
body {**** するよろし　他の全部
　　と当てずっぽうで書いてみる。

688 ：678：04/04/14 18:30 ID:???

ただの思い上がりだったということか。
初心に帰ってやり直すことにするよ。

689 ：Name_Not_Found：04/04/14 18:49 ID:???

で、>>675はどうなった？

690 ：675：04/04/14 20:54 ID:JpNlhn0J

>>686
できました！　どうもありがとうございます。
ところで、text-alignって画像に使ってもいいんですか？

>>678
変化なしでした…。
折角答えてもらったのにごめんなさい。

というわけで、
vertical-alignとtext-alignを使うことにします。
ありがとう。

それにしても、私のpaddingの使い方って間違ってるんでしょうか。
使い方がおかしいのか、何かミスがあるのか、仕様なのか…。

691 ：Name_Not_Found：04/04/14 21:18 ID:???

cssがどうたら抜きで htmlだけでtable組む場合を思い浮かべてみたらどやさ。

<table cellpadding="0">
<tr>
<td valign="top" align="right"><img src="～"></td>
</tr>
</table>

の、cellpaddingがこのばやい cssの td { padding: xx; } に相当するわけだから…
まあ、あとは自分で考えれ。

いちおうこのスレ的には、そういうtableの使い方自体が間違いです、
という話になると思われ。

692 ：Name_Not_Found：04/04/14 23:02 ID:FzsPRbrS

OS　WinXP　ブラウザ　IE6.0　です。

外部スタイルシートを読み込んで文字サイズ・文字色などを
指定しております。
テーブル内の文字はそのスタイルを読み込めないのでしょうか？

テーブルの１行目は適用されるのに、２行目以降は適用されない
現象がおきております。

よろしくお願いいたします。

693 ：Name_Not_Found：04/04/14 23:05 ID:???

>テーブル内の文字はそのスタイルを読み込めないのでしょうか？
そんなことはない。何かヘンなことやってるね？
でも、ソース出してくれないとわかりませんよ。>>692

694 ：Name_Not_Found：04/04/14 23:07 ID:PR9pXxWn

http://headlines.yahoo.co.jp/hl?a=20040413-00000001-imp-sci

695 ：Name_Not_Found：04/04/14 23:34 ID:FzsPRbrS

693さん、ご返答ありがとうございます。
やはりヘンタイなことをしていたようです。
本当に基礎的な間違いでお恥ずかしいのですが、
２行目の文字を<p></p>で囲っていませんでした。

ヘンな質問してごめんなさい。

694さん、参考になりました。早速使ってみようと思います。

696 ：Name_Not_Found：04/04/15 00:51 ID:???

</head>
ってやつはネスケ4.Xでも対応しよるんですかね
ネスケ4.x無視して使うか、bodyで<font size=..>使うか迷ってるんですけど
どっちが良いですかね

697 ：Name_Not_Found：04/04/15 00:55 ID:???

>>696
ネスケ4.xはmedia="all"でcss無効にしる。

698 ：Name_Not_Found：04/04/15 00:56 ID:???

>697
レスありがとうございます
無効にしちゃったらネスケで見たとき文字サイズ指定できてないんですよね？

699 ：Name_Not_Found：04/04/15 00:59 ID:???

>>698
指定できないけど、変にCSSを適用されるよりマシと思う。
てか、俺もその辺りで迷ってるorz

700 ：Name_Not_Found：04/04/15 01:01 ID:???

>699
言われてみればそうかもしれない…
今は<font size>で指定してるんですが、一括でやったほうが楽だし
迷いますよね
もうちょっと迷ってみます(;´Д`)

701 ：Name_Not_Found：04/04/15 01:03 ID:???

っていうか，下記の記事読んでみて。
http://su.que.jp/slazsi/web/netscape4.html

702 ：Name_Not_Found：04/04/15 01:05 ID:???

>>701
（･∀･）!!

703 ：Name_Not_Found：04/04/15 01:09 ID:???

>>696
Netscape Navigator 4.x CSSバグリスト
フォント名に2バイト文字が含まれるフォントを指定するとスタイルが無効になる
http://cssbug.at.infoseek.co.jp/detail/nn4x/b001.html

704 ：696：04/04/15 01:48 ID:???

うわー、ありがとう！>701 >703
これは参考になります。どうもありがとう～

705 ：Name_Not_Found：04/04/15 02:25 ID:???

>>704
あのな、>>703が挙げたバグ辞典は>>2-10に掲げてあるのよ。
何で質問する前に見ておかないんだ？

706 ：Name_Not_Found：04/04/15 08:06 ID:???

ゆえに！

707 ：Name_Not_Found：04/04/15 08:46 ID:???

我思う、故に我あり

708 ：Name_Not_Found：04/04/15 08:51 ID:???

最近枯れたよ。

709 ：Name_Not_Found：04/04/15 09:01 ID:???

>>696
>body,tr,td,th { font-size:13px; font-family:"MS UI Gothic, Osaka, ＭＳＰゴシック"; }
なんか根本的なモノが抜けているんだが

710 ：Name_Not_Found：04/04/15 10:05 ID:???

禿げてるよ。""

711 ：Name_Not_Found：04/04/15 11:49 ID:???

ここみれ
　ttp://hp.vector.co.jp/authors/VA022006/css/fonts.html#font

712 ：Name_Not_Found：04/04/16 02:00 ID:???

掲示板について質問良いでしょうか。
元祖質問スレで書いたのですが、
廃スレといわれましたのでこちらで伺えればと思いまして。
もし板＆ｽﾚ違いでしたら誘導お願いします。

作ったものは↓です。
ttp://box.elsia.net/~inauta/cgi-bin/bbsnote.cgi

cgiは　ttp://www.mytools.net/cgitools/note4.html　から借りました。

掲示板のテスト書き込みにあるように一行あけると<P>タグが入ってしまって
罫線がずれてしまいます。

今はテーブルの背景に罫線画像を入れて、フォントサイズと行間をcssで指定しています。
cssの指定をどうにかしてうまく表示できるでしょうか？
ネスケでの表示崩れに関しては目をつぶる方向で考えています。

713 ：Name_Not_Found：04/04/16 02:45 ID:???

>>712
<p>が入らないようにすればいいだろ。
それに背景画像と前景の文字を位置合わせするなんてバカバカしい。
罫線自体をCSSで表示させればいいじゃないか。

714 ：Name_Not_Found：04/04/16 02:51 ID:???

>>712

うちの環境じゃ

>普通の書き込みだとおっけーです。
>ちゃんと罫線通りいけます。

のところとか、取消し線が入ってるみたいにど真ん中に線入ってますが何か?

715 ：Name_Not_Found：04/04/16 03:08 ID:???

>>712
基本的には>>713にﾄﾞｳｲ。
あえて今の方向で行くなら、<P>のmargin-topとmargin-bottom、
padding-topとpadding-bottomを0にして行間の調整をやり直してみたらどうかな？

716 ：Name_Not_Found：04/04/16 05:35 ID:???

>>712
話は変わるが上部の投稿フォームの記事部分の罫線は
なんか野暮ったい。

717 ：Name_Not_Found：04/04/16 06:57 ID:???

P { margin: 0; }　を追加して表示確認しました
OSはWindows2000SP4

IE6 SP1：OK
NN7.1：最初の「2004/04/16 04:41」からずれる
Opera7.23：NN7.1と同様
NC4.78：罫線がなくてすっきり表示。ただし本文入力欄が表示されない

さらに
BODY,TD, { font-size : 11pt ; line-height : 12pt ; }　を
BODY { font-size : 11pt ; line-height : 12pt ; } TD { font-size : 14px ; line-height : 16px ; }　に
変更したら、IE、NN、Operaでうまく表示できました

ただし、基本的に>713に強く同意

718 ：Name_Not_Found：04/04/16 10:37 ID:???

TD { font-size : 14px ; line-height : 16px ; }　
これじゃー　すんげー読みにくくねーか？

719 ：Name_Not_Found：04/04/16 10:39 ID:???

>>718
人それぞれ

720 ：Name_Not_Found：04/04/16 10:44 ID:???

まあ、読んでもらいたくなけりゃ釜ワンけど差。

721 ：Name_Not_Found：04/04/16 11:22 ID:???

そうだね、中にはそれが読みやすいんだと言い張る人も居るかも知れないからそれでオッケー

722 ：Name_Not_Found：04/04/16 12:08 ID:???

なぜ、「文字固定すな　アホ」ってのが出てこないのか不思議だ。

723 ：Name_Not_Found：04/04/16 12:15 ID:eEeLyq4O

番号無しリストで、リストのドットと文字列の間を
CSSで調節できたりしませんでしょうか。
WinXP IE6 です。

<ul>
<li>あいうえお</li>
<li>かきくけこ</li>
</ul>

とすると、普通は

・　あいうえお
・　かきくけこ

となるわけですが、

・あいうえお
・かきくけこ

このくらいに調整できないものかなぁと。
宜しくお願いいたします。

724 ：Name_Not_Found：04/04/16 12:18 ID:???

>>723
text-indent:

725 ：723：04/04/16 13:26 ID:???

>>724
レスどうもです。
text-indent: も試したんですが、変わらないんです。
・　あいうえお
が
　・　あいうえお
のように、ドットの左のインデントが変わるだけで

726 ：Name_Not_Found：04/04/16 13:45 ID:???

>>725
IEではそうなるな。俺Mozillaだったわ。

727 ：Name_Not_Found：04/04/16 13:58 ID:???

margin-left

728 ：Name_Not_Found：04/04/16 14:00 ID:???

>>723 padding

729 ：Name_Not_Found：04/04/16 14:01 ID:???

三人寄れば文殊の知恵みたいだね

730 ：Name_Not_Found：04/04/16 14:04 ID:???

船頭多くして舟山に登る　>>729

731 ：Name_Not_Found：04/04/16 14:11 ID:???

>>727,728
レスどうもです。
マーカー（ドット）は<li>のボックス領域に含まれず、
ボーダーの外側にあるため、これも変わらないようです・・・。

marker-offset なる属性が存在するようですが
対応しているブラウザがないため（？）意味無し・・・

マーカーと文字列の間隔を調整するのはやはり無理なんでしょうかね

>>730
山にも登れす沈みかけてます・・・

732 ：Name_Not_Found：04/04/16 14:18 ID:???

>>731
liではなくulのmarginやpaddingを調節しなさい。たぶん0.5em位で。
ブラウザのデフォルトスタイルシート
http://is.vis.ne.jp/notes/browser/default_style.xhtml
「/* * Internet Explorer 5～6, * Opera 7 */ ol, ul { margin-left: 40px; }」
「/* * Internet Explorer for Mac 5 */ ol, ul { margin-left: 2.5em; }」
「/* * Mozilla 1.5, * Netscape 6～7, * Safari 1, * OmniWeb 4.5 */ ol, ul { padding-left: 40px; }」
「/* * Opera 6 */ ol, ul { margin-left: 40px; } li { margin: 5px 0; }」

733 ：Name_Not_Found：04/04/16 14:20 ID:???

>>731
margin-leftのマイナス値は試しましたか？　

734 ：Name_Not_Found：04/04/16 14:36 ID:???

3カラム段組で、ウィンドウサイズ小さめでは
あえて横スクロールバーが出るようにしたいのですがどのように組めばいいでしょうか？
IEではちゃんと見えてもネスケやオペラでは落ちてしまいます。

735 ：Name_Not_Found：04/04/16 14:39 ID:???

>>734
ＦＡＱは読んだの？　>>6-7
たぶん、floatを誤解してるね。

736 ：Name_Not_Found：04/04/16 14:42 ID:???

ネスケやオペラでは落ちるってのはひどいな。CSSとHTMLのソース出してくれない？

737 ：723：04/04/16 14:51 ID:???

>>732,733
レスどうもです。
はい、ulでも試しております。

margin, padding, margin-leftは、マーカー外側のスペースを調整することになるので
結局、マーカーと文字列の間は変わらないんです。
マイナスにするとマーカーは消えます。
ul で margin-left: 0.8em とやってみると、丸いマーカーの左がかけたような
リストになります。マーカーと文字列の間は変わりません・・・。

738 ：Name_Not_Found：04/04/16 14:54 ID:???

>マイナスにするとマーカーは消えます。

指定値が大きすぎただけでは？　値を変更して微調整しなさい。

739 ：Name_Not_Found：04/04/16 14:57 ID:???

>>737
本来なら自分でもわかってる通りmarker-offsetを弄るべきだが、現状は無理。
つことでIE無視するんだったら
li:before {
　content:'・';
　margin-right:0;
}
みたくすればいいんじゃね？

740 ：734：04/04/16 14:57 ID:???

>>735
半年ぶりくらいにCSSいじったのでたぶん誤解してます。ワケわかってないです。
テンプレに目通してコレなので情けない＿|￣|○
>>736<head><style type="text/css">

</style></head>
<div class="all">
<h1>3カラムのテスト</h1>
<span class="aaa">
<div class="left">ひだり</div>
<div class="center">まんなか</div>
</span>
<div class="right">みぎ</div>

741 ：723：04/04/16 14:59 ID:???

>>738
いや、調整もしてますよｗ

私のため仕方が間違ってるのかもしれません。
よろしければ、うまく調整できてるソースを書いて頂けませんでしょうか。

742 ：Name_Not_Found：04/04/16 15:02 ID:???

>>723
マーカー無しで、・あいうえおってかけばいいじゃん。
それがやなら、マンドクセーから　・を画像にしちゃえや。
でマーカー無し。そうすれば、お好みに出来るよ。

　　　　　　　　　　　　　　　　　　　　つっこまねーでくれー　エ～ン

743 ：Name_Not_Found：04/04/16 15:02 ID:???

>>723
list-style-position:inside;

744 ：723：04/04/16 15:08 ID:???

いろいろとレスありがとうございます。

>>739
marker-offsetを使うならそれでいけそうですね。
でもIE無視ってｗ

>>742
幅150pxほどのところでリストを書いていまして、項目によっては
2行に折り返されるので、字下げをしたいのです・・・

>>743
字下げをしたいので、outsideでいきたいです。

745 ：Name_Not_Found：04/04/16 15:13 ID:???

>>740
根本的に、HTMLから全く間違ってます。ＦＡＱの注意も無視してますね。

http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
上記でチェックし、修正・再提出して下さい。

参考：
ブロックレベル要素とインライン要素
http://www.mozilla.gr.jp/standards/webtips0015.html

746 ：Name_Not_Found：04/04/16 15:15 ID:???

最後になって字下げかい。

747 ：Name_Not_Found：04/04/16 15:16 ID:???

>>723
li の背景画像にマーカーいれといて
padding-leftでテキストの位置調整ってのはどうだろう?

748 ：Name_Not_Found：04/04/16 15:16 ID:???

>>744
>幅150pxほどのところでリストを書いていまして、項目によっては
>2行に折り返されるので、字下げをしたいのです・・・

text-indent:-1emで最初の一行だけ左に飛び出る。字下げと同じ効果の筈。
当該ブロックにはmargin-leftを1em以上指定しておくこと。

749 ：734：04/04/16 15:25 ID:???

>>745
うわぁぁぁホントだ・・・＿|￣|○ｱﾘｶﾞﾄｺﾞｻﾞｲﾏｽ
帰宅後に書き直してまた来ます。

750 ：Name_Not_Found：04/04/16 15:29 ID:???

>>723
ul, ol { padding-left: 0em; }
li {
margin-left: 0.5em;
padding-left: 1em; /* ←マーカーとの距離を適宜調整 */
background-image: url(marker.gif);
background-repeat: no-repeat;
list-style-type: none;
}

数字は適当だけど、これでうまくいくんじゃないかとおもふ。

751 ：Name_Not_Found：04/04/16 15:40 ID:???

テーブルの背景色をhtmlとスタイルシートで同時に指定すると
たぶんスタイルシートが優先されると思うけど、
ブラウザによっても違うんでしょうか？

752 ：Name_Not_Found：04/04/16 15:44 ID:???

>>723
違和感のある方法だけど、

ソースを
<ul>
<li><p>あいうえお</p></li>
<li><p>かきくけこ</p></li>
</ul>
と変更して、

<p>にpadding-leftだとそれらしくなる

753 ：723：04/04/16 15:46 ID:???

>>750
おー、なるほど。
マーカーを消してしまってバックの画像で。
荒技ですが確かに。

ちょっと試してみましたが、いけそうです！ありがとうございます！
レスを下さった皆様本当にありがとうございます。
また困ったら来まーす。

>>752
って書き込もうとしたらレスが。
ありがとうございます。そちらも試してみます

754 ：Name_Not_Found：04/04/16 15:47 ID:???

>>751
仕様書で、CSSを優先することになってる。
そもそも、スタイルシートを使用するならHTMLの指定は要らない。

755 ：Name_Not_Found：04/04/16 16:14 ID:???

>>754
どうもブラウザによって違うというイメージがあるので
不安になっていたのでした。ありがとうございました。

756 ：Name_Not_Found：04/04/16 17:17 ID:???

すみませんが、質問です。
http://blog.livedoor.jp/jigokuhen00/archives/169129.html

一部で有名なこのページの内容を、普通の HTML + CSS で再現しようとしたのですが、
Mozilla 1.7b では意図どおり表示されるのですが、IE6 では大きく崩れてしまいます。
また、IE6 だと、一度ウィンドウを隠してから再表示すると、表示の一部が欠けます。

どのように修正すれば、IE6、Mozilla が同じ表示になるでしょうか？

以下、>>757-758 にコードを貼り付けます。

757 ：Name_Not_Found：04/04/16 17:18 ID:???

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang='ja'>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>test50</title>
<style type="text/css">

</style>
</head>

758 ：Name_Not_Found：04/04/16 17:19 ID:???

<body>

<blockquote>
<h1><span>タイトル</span></h1>
<p>
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
</p>
</blockquote>

<blockquote>
<h1><span>タイトル</span></h1>
<p>
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容
</p>
</blockquote>

</body>
</html>

759 ：Name_Not_Found：04/04/16 17:49 ID:???

>>756-758
興味深いので、こちらに報告して下さい。

CSS/DHTMLバグ辞典スレッド第４版
http://pc5.2ch.net/test/read.cgi/hp/1078463560/l50

760 ：Name_Not_Found：04/04/16 18:03 ID:???

>>757　positionでやれば？

blockquote h1 {
margin:0 0 0 1em;
position:relative; top:-0.7em;
font-size:2em;
display:inline;
border: 1px dashed black;
background-color:white;
padding:0em 0.5em;
}

761 ：Name_Not_Found：04/04/16 18:07 ID:???

>>756-758
マージンに負数が指定された要素でボーダーがずれてゆく(IE6)
http://cssbug.at.infoseek.co.jp/detail/winie/b039.html

762 ：Name_Not_Found：04/04/16 18:33 ID:???

>>760-761
ありがとうございます。見事に表示されました。

すみませんが、また分からないことができました。
<blockquote>要素の直下に、display:inline によってインライン要素化した<h1>要素を
入れることは許されるのでしょうか？

デフォルトの設定がブロック要素ならば問題ないのでしょうか？

763 ：昔の人：04/04/16 18:39 ID:???

>>762
問題ない。考へてもみたまへ。
問題があったらdisplay:inline;もdisplay:block;も使用できなくなるでせうに。

764 ：756：04/04/16 18:51 ID:???

>>763
すみませんが、まだ分かりません。
たとえば、以下のサンプルでは、body 直下にブロック要素は一つも
存在しなくなるのだと思っていました。
正確には、インライン要素となった<p>要素を包含する匿名ブロックだけが
１つ存在すると。
つまり、4.01 strict では許されない構文かと思っていました。
正しくは、どうなのでしょうか？

<head>
<style type='text/css>
p { display:inline; }
</style>
</head>

<body>
<p>
本文1
</p>
<p>
本文2
</p>
</body>

765 ：Name_Not_Found：04/04/16 18:52 ID:???

>>762
CSSによって、(x)htmlの「要素（の性質）」は変わりません。
どのように表示するかを決めるのがスタイルシートなので、文法に影響が生じるわけが無い。
ただ、変なスタイルだったら見辛くなるということはもちろんありうる。

766 ：Name_Not_Found：04/04/16 18:54 ID:???

>>764
display:inline;
は「インライン要素のように表示する」ということであって、
「インライン要素になる」のでは無いです。

767 ：756：04/04/16 19:03 ID:???

>>765-766
なるほど、逆に言えば、
h1 div { display:inline }
---------
<h1><div>この div はインライン要素だからOK？</div><h1>

こういう書き方こそ NG なのですね。

html の要素の包含関係の規定は、各要素のデフォルトの性質についてのみの
規定であって、それが実際にどのように表示されるかということを縛るものでは
ないということでしょうか。

ありがとうございました。

768 ：756：04/04/16 19:21 ID:???

あと、まとまりのない質問ですみませんが、
慣れないせいか、こういう目的には position:relative は
あまり使い勝手が良くないように感じます。

blockquote h1 { margin-top:-0.7em } だったら、移動量(0.7em)が増減しても
後続の要素は自動的に追従しますが、

blockquote h1 { position:relative; top:-0.7em; }だと、
移動量を変化させると後続する要素とのマージンをあわせて調整しなければ
なりません。しかもこのとき、マージンに負の値を指定すると、また
IE では表示が崩れてしまいます。

そういうものだと思って使うしかないのでしょうか？
それとも、なにかうまい定石があるのでしょうか？

769 ：Name_Not_Found：04/04/16 20:22 ID:???

NETにはその手の情報はゴロゴロ有るよ。
自分でググる習慣を付けましょう。
　　　　　　　　　　　　　　　　　　と初心者が書いてみる

770 ：734：04/04/16 21:51 ID:???

0から書き直したらなんだか出来たみたいです。
ソース貼りますので間違ってたら叱ってください。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=shift_jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">

</style>
<title>3カラムテスト</title>
</head>
<body>
　<div id="all">
<h1>3カラムのテスト</h1>
<div id="left">ひだり</div>
<div id="center">まんなか</div>
<div id="right">みぎ</div>
　</div>
</body></html>

771 ：Name_Not_Found：04/04/16 22:28 ID:???

>>734
width全部合わせて950px 横バー出るよ。

772 ：Name_Not_Found：04/04/16 22:59 ID:???

>>770
ピクセル指定はこのスレでは大抵叩かれるので注意。

まぁ1024x768でブラウザを最大化してる閲覧者しか相手にしないんならいいんだけど。

773 ：734（770）：04/04/16 23:05 ID:???

>>771
ありがとうございます。
ﾈｽｹ･ｵﾍﾟﾗ･FireFoxでも落ちなかったのでこれで合ってるのかな？

>>772
左の二段(?)がメインなので一番右の段はあえて800*600等では画面外に押しやってます。
あまり重要じゃないもの（自分用リンク集とか）を置くので。
ttp://slashgames.rbbtoday.com/
このサイトの右端にある広告みたいな感じです。

774 ：Name_Not_Found：04/04/16 23:22 ID:???

なにをやるのか知らんが、「重要じゃないもの」ならおく必要はない。
多分二度と見ないな。

775 ：Name_Not_Found：04/04/17 00:06 ID:???

>>773
displayプロパティを使って工夫してみたら？
製作者スタイルでnoneにして、自分だけユーザスタイルで表示するとか。
それもちょっとアレか。

776 ：756：04/04/17 00:45 ID:???

すみませんが、>>768 の疑問について、どのようなサイトが参考になるか、
お教えいただけないでしょうか。しばらく検索しましたが、なかなか意図する
内容を見つけることができません。

私は今、こちらのサイトを主に参考にしており、
・『スタイルシートWebデザイン』ボランティアHTML化版。
　http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/

他にはばあど氏やばけら氏のリファレンスを参照したりしています。

ただ、CSS の文法やリファレンスから先の、具体的な使い方の定石については、
まだほとんど経験がなく、検索でうまく見つけ出すことができません。

今知っているのは、このぐらいです。
http://deztec.jp/site/tips/tips.html
http://www.fromdfj.net/html/index.shtml（こちらはまだ、読み始めたばかり）

777 ：Name_Not_Found：04/04/17 00:45 ID:???

>>774
元々Hit数ほとんどない自己満足サイトなので気にしません(つД｀)
htmlとCSSでこんなことしてみたいなーっていうのをチマチマやってます。

>>775
うーん。ちょっとアレですね。

778 ：Name_Not_Found：04/04/17 12:40 ID:???

ちっとアレだから、ナニするといいよ。

779 ：Name_Not_Found：04/04/18 01:42 ID:???

>>776
自分の頭でHTML・CSS考えてる？コピペじゃ経験も何も生まれない

780 ：Name_Not_Found：04/04/18 11:26 ID:???

教えてくださいm(__)m
ＳＳＳ．ＪＳなるＣＳＳ切り替えスクリプトをＤＬし組み込んでみました。
自分のパソでは何の問題も無く動作するのですがＨＰへアップすると動作しません。
Ｎｏ－スタイルシート状態で表示されます。
その時にステータスバーには「実行しましたがページでエラーが発生しました」
との無常なメッセージが出てきます。

どうかエロ皆さん解決策を教えてください。

781 ：Name_Not_Found：04/04/18 12:43 ID:???

>>780
ネタ乙

782 ：Name_Not_Found：04/04/18 13:22 ID:???

>>780
世の無常をよく味わえ。

783 ：Name_Not_Found：04/04/18 13:30 ID:???

　　　}ﾉ-､　　　 ,. -‐-､ヽ;::::::::l
　　 l￣二'ｰ 'フ,ニニ.ｰrｰ}-ﾚ ''7
　　 l : i.__ﾟ〉r､::..ヽ.__ﾟﾉ　ﾚ''}ﾉf´/　教えてあげません
　　 `''r-- ﾉ:::`ー---‐'′:l-イ
　　　　l　 `_ ＿＿__,、　 :l|::::|
.　　　　ヽ. 　 ―　　　／:::|:ﾘ

784 ：Name_Not_Found：04/04/18 14:47 ID:???

>>780
ややスレ違い気味だが、外部 JavaScript ファイルの文字コードと、
それを読み込む html ファイルの文字コードは合っている？
もし合っていないなら、揃えるか、
<script … charset='（外部 JavaScriptの文字コード）'></script>
として、文字コードを指定してみてください。

それでダメなら、ちょっと私には心当たりないです。

785 ：Name_Not_Found：04/04/18 16:08 ID:???

ファイルの場所をC:\とかにしている予感（そんなまさか）

786 ：780：04/04/18 18:52 ID:???

３レスほど世の中の無常を味わいました。

>>704
文字コード確認しましたが間違ってませんでした。
てかScriptの部分はDLしたところの例文そのままです。

>>785
そうか！フィル置き場か！！

な分けないです。
ファイルの場所は相対パスで指定してます。
これも間違いないと思います（T_T
もうどうしたらよいら（鬱

787 ：Name_Not_Found：04/04/18 19:37 ID:???

>>786
どうにもスレ違いだけど、Mozilla で試してみたら？
・JavaScript の詳細なエラーが出るし、デバッグもできる。
・外部 JavaScript の文字コードを自動判別してくれる。

ここから先は、こっちで聞いたほうがいいと思う。
+ JavaScript の質問用スレッド vol.27 +
http://pc5.2ch.net/test/read.cgi/hp/1080743738/l20

次のスレッドでは、どんなスクリプトを試そうとしているのか、その配布サイトの
URLをちゃんと示してね。

788 ：Name_Not_Found：04/04/18 19:50 ID:???

Mozilla の入手先
http://jt.mozilla.gr.jp/releases/#1.7b

あと、大きなお世話だけど、君の日本語はだいぶ不自由だ。
「無情」と「無常」は別の言葉だよ。辞書を引く習慣をつけよう。
http://www.asahi.com/tool/jisho/index.html

他には、
・誤字脱字が多い。もっと気をつけて書いてね。
・ふざけた態度に見える。へりくだる必要はないけど、最低限の礼儀はわきまえるべし。
・そのスクリプトの配布元の URL や、できればあなたのサイトの URL を示してほしい。
　状況がわからなければ、アドバイスもできない。

これではなかなか、まじめな回答は返って来ないと思う。現に今回、煽られたでしょう？

あわてているのだろうと思うけど、落ち着いて、丁寧に書き込んだほうがいいよ。
そうじゃないと、回答者に失礼だし、なにより、問題の解決が遅れて、君の損になるから。

789 ：780：04/04/18 20:03 ID:???

>>787,788
ありがとうございます。
もう少し情報を整理したら誘導されたスレに行って見ます。

辞書もひくようにしますm(__)m

790 ：Name_Not_Found：04/04/18 22:15 ID:???

>>786
理由はどうにしろ根本的に解ってないな

791 ：Name_Not_Found：04/04/19 17:17 ID:Ik4pHGQ0

定義リストの標準マージンはＩＥの場合だと
margin : 0px;でなくせるんですが
ネットスケープではできません。
この場合どうすればネットスケープで
標準マージンを削ればよいのでしょうか？

792 ：Name_Not_Found：04/04/19 17:45 ID:???

>>791
paddingかなと推測しますが、>>1を良く読んでくださいね。

793 ：Name_Not_Found：04/04/19 19:52 ID:???

* {
font-size:100%;
margin:0;
padding:0;
}

794 ：Name_Not_Found：04/04/19 23:33 ID:???

質問させてください
環境MacOS8.6～9.1　IE5,6
で下記を表示すると
ttp://www.geocities.jp/jyajya25/test.html
ルビの文字が表示させる度に"o"を使用しているものだけ消えたり、消えなかったりします
事があります.
<ruby>タグが XHTML1.1 用のタグだからなのか、他の間違いか
判断つかないのですが識者の方宜しくお願いします

795 ：Name_Not_Found：04/04/20 00:06 ID:???

>794　IE5.5で開いてみたが、2回も強制終了するはめになった。
lintでもさんざんな結果になっている。
まずは基本をチェックしてみることをすすめたい。

796 ：Name_Not_Found：04/04/20 00:29 ID:Aol1EzrA

>>794
795にほぼ同意です。
とりあえず、<rt>が閉じていない所があるっぽいです。
余計な事ですが、かなりレイアウトにこだわっているようなので
swfにしたほうが良い気がする。

797 ：Name_Not_Found：04/04/20 00:43 ID:???

質問です。floatを使ってサイドバーとナビゲーションバーを作りたいんですが
IE6の表示で隙間が空いてしまって困っています。
FireFox0.8では問題ないんですがIE6で表示させると
サイド||ナビゲーションバー
サイド|
サイド|本文
のようにサイドバーとナビバーの間に3ピクセルほど隙間ができてしまいます。
どうにか隙間なく表示させる方法をご存知でしたら教えてください。
以下はソースです。よろしくお願いします。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD// HTML 4.01 Transitional//EN">
<html><head><style>
div.side { float: left; width: 3em;}
div.main { margin-left: 3em; }
ul { margin: 0px; padding: 0px; list-style: none; height: 1em;}
li { float: left; }
div.side { border-right: 1px solid #000000; } /* 隙間確認用ボーダー */
ul { border-left: 1px solid #000000; } /* 隙間確認用ボーダー */
</style></head>
<body>
<div class="side">
サイド<br>サイド<br>サイド
</div>
<div class="main">
<ul>
<li>ナビ</li><li>ゲーション</li><li>バー</li>
</ul>
<p>本文</p>
</div></body></html>

798 ：Name_Not_Found：04/04/20 01:14 ID:???

>797
ul の line-height:1em; が原因じゃないかなと思う。試したのはIE5.5だけど。

で、削ると p { clear:left; }が必要になって、
これを入れると IEの表示がちょと変になって…。うーむ。

というわけで、
ul { margin: 0px; padding: 0px; list-style: none; }
li { display:inline; }

でどうでしょうか。

799 ：Name_Not_Found：04/04/20 01:16 ID:???

ごめん、訂正します。

×line-height:1em;が原因
○height:1em;が原因

800 ：Name_Not_Found：04/04/20 01:18 ID:???

>>797
おそらくこのバグだと思われ。
http://cssbug.at.infoseek.co.jp/detail/winie/b054.html

801 ：Name_Not_Found：04/04/20 01:33 ID:ll6w5ich

802 ：Name_Not_Found：04/04/20 01:45 ID:???

ああ、IE6でも標準準拠モードなら内容域の幅なのか。なら下みたいにpxで指定したほうがいいかも。

<style>
div.side {position: absolute; width: 50px;}
div.main {position: relative; left: 51px;}
ul {margin: 0px; padding: 0px; list-style: none; height: 1em;}
li {display: inline;}
div.side {border-right: 1px solid #000000;} /* 隙間確認用ボーダー */
ul {border-left: 1px solid #000000;} /* 隙間確認用ボーダー */
</style>

803 ：794：04/04/20 01:56 ID:???

>>795 >>796
確認ありがとうございました.
後でみたら酷いソースでした,強制終了させてすまそ
手元にあるCSS辞書ではHTML4.01で<rt>を閉じてない実例が記載されていましたが,
どうやらまったく違うみたいですね....　基礎からやります
ありがとうございました

804 ：797：04/04/20 03:28 ID:???

ulのheight指定が原因だったんですね。
とりあえずheightを削ってinlineにすることにします。
IEのバグかな？とは思いつつ、>>800のバグレポートには
自力では辿り着けませんでしたtt

positionを使ったやり方は知らなかったんですが
こっちの方法でもうまくいきました。

>>798-802
どうもありがとうございました。

805 ：Name_Not_Found：04/04/20 19:24 ID:5DbX+1hg

CSSの使い方がうまい香具師ってソフト使ってるのか？
それとも手書き？

806 ：Name_Not_Found：04/04/20 19:55 ID:???

ソフトも手書きも無関係。推理と洞察。

807 ：Name_Not_Found：04/04/20 20:01 ID:???

使い方ならセンスとかじゃない？

808 ：Name_Not_Found：04/04/20 20:25 ID:???

推理と洞察とセンスと勉強。

809 ：Name_Not_Found：04/04/20 20:31 ID:???

あと、ひと夏の経験。

810 ：Name_Not_Found：04/04/20 23:40 ID:???

あまずっぱい思い出。

811 ：Name_Not_Found：04/04/21 00:05 ID:WJ2gQD1N

IE5.5ですが、tableを内容共々中央にしたい。
先にdiv style="text-align:center;"、
table style="margin-left:auto;margin-right:autoではテーブルの内容が
左に寄ったままなのですが・・・何故でしょう？
tableにもtext-align:center;を加えるべきなの？

812 ：Name_Not_Found：04/04/21 00:11 ID:???

>>811
自分で答えだしてるじゃん。

813 ：Name_Not_Found：04/04/21 01:01 ID:???

>>811
その通り

814 ：Name_Not_Found：04/04/21 01:02 ID:???

>>811
カスケードや継承で調べよ。

815 ：Name_Not_Found：04/04/21 03:52 ID:LV/fuh4z

テーブルを透けるようにしたいのですが、

style="filter:alpha(opacity=70)" 　こうすると
テーブル内の全てが透けてしまいます。
例えば画像を置いたらそれも透けたり、
入れ子にしたテーブルもその影響を受けたりします。

<td>のみに適用したりは出来ないでしょうか？
これはTABLE全体にしか効かないのでしょうか？

816 ：Name_Not_Found：04/04/21 04:10 ID:???

>>815
<td>だけは可能でしょ。背景だけは多分無理。
やるならαチャネルPNG画像を背景に使うとか、
背景だけのレイヤを作って重ねるとか

817 ：Name_Not_Found：04/04/21 05:42 ID:???

質問すみません。左にメニューを置いて、メインに幅の広い画像を表示させたいのです。
ネスケとオペラはＯＫだったのですが、ＩＥ６だとメニューと同じ高さから表示されませんでした。
解決方法ありますでしょうか？ソース張ってみますのでよろしくお願いします。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>title</title>
<style type="text/css">

</style>
</head>
<body>
<hr>
<div class="menu"> メニュー<br>
メニュー<br>
メニュー </div>
<div class="main"><img src="image.jpg" width="1280" height="1024"></div>
<hr>
</body>
</html>

818 ：Name_Not_Found：04/04/21 08:57 ID:???

width="1280" height="1024"　こんな画像は表示させなくてよろしい。

819 ：Name_Not_Found：04/04/21 12:05 ID:???

>>817
>メニューと同じ高さから表示されませんでした
意味わからない。他人に通じる言葉で書いて下さい。

820 ：Name_Not_Found：04/04/21 13:41 ID:???

>817
div にborderを設定してみると、IEでも <div class="main"> の上端自体は
menu にそろってますね（Operaではずれてますが）
で、>818にもありますが、1280×1024の画像をスクロール無しに表示できる環境って
どれくらいあるんでしょう
一度アクセス解析つけて調べてみては？

ちなみに、画像サイズを640×480にしたら、お望みどおり高さ揃いました
ただし、ウィンドウサイズを小さくして、縦スクロールバーを出すと、画像の高さがずれます

position 使ったら？

821 ：Name_Not_Found：04/04/21 13:56 ID:???

>>817は、画像だけなら<div class="main">で囲む必要無し。
img要素に直にfloatなりmargin-leftなりを指定すれば済む話。

822 ：Name_Not_Found：04/04/21 20:14 ID:???

>>820
position を使うと、後続要素の位置調整が面倒だと思う。
結局、包含ブロック(body)の幅が、画像に比べて狭いのが原因だということで、
html をいじらないという前提なら、body の幅を広げるしかないのでは？

>>817
ということで、書いてみました。
スタイルシート以外の部分は、全て >>817 と共通ね。
--------------------------------------------------------
* { border:solid 1px black; } /* border の視覚化 */

body {width:1500px;} /* 1280px + 200px が収まるように */

.menu {/* メニュー */
float: left;
width: 200px; /* body が px 固定になっちゃったから、子を相対値にするのは、あまり意味がない */
}
.main {/* メイン */
margin-left:210px;/* .menu と同じ理由 */
}

823 ：Name_Not_Found：04/04/21 20:14 ID:???

>>817
しかし、このレイアウトはあまりにも閲覧者にとって不便だと思う。
こういう↓感じに変更することを、個人的にはおすすめしたい。

「"いろは"の先の CSS 第3回」の「課題 No.06」
http://deztec.jp/lecture/folio/03/index.html
（ページ下方にあります）

824 ：Name_Not_Found：04/04/21 22:50 ID:???

みなさんありがとうございます。
>>817ですが1280～とかはただの例です。
実際はもっと小さい画像(といっても600～とかですが)を表示させて、
窓最大だと大丈夫なのに窓サイズを小さくしたとき、IEだけ高さがずれたので不思議に思って質問しました。
質問内容をわかりやすくしようとしたんですが逆効果のようでした。すみません。

>結局、包含ブロック(body)の幅が、画像に比べて狭いのが原因だということで、
>>822さん
これはIEのバグなんでしょうか？
>>817にあるとおりMozillaやOperaは高さがずれませんでした。

825 ：822：04/04/22 01:16 ID:???

>>824
悪いけど私にはわからない。仕様書とか詳しくないから。

これは、float の指定されたブロックのあとに、置換インライン要素が続くとき、
その置換インライン要素の幅が、全体の包含ブロックより大きい場合、どう振舞うべきか、
ということなんだけど、
仕様書やバグ辞典を見ても、私には該当する項目が見つからないんです。

>>818 のソースで、
.main{} （宣言が空）のときの表示は、IE も Mozilla も同じなんだけど、
.main { marign-left:21% }
.main { padding-left:21% }
とすると、ご承知のとおり、描画が異なる。どちらが正しいのだか、私にはわからない。
ちなみに、
.main { width:1600px }
としても描画が異なるんだけど、これは IE が間違っていると思う。

826 ：822：04/04/22 01:18 ID:???

自己訂正 × >>818 → ○ >>817

827 ：Name_Not_Found：04/04/22 04:45 ID:???

>>824-826
こちらに報告よろしく。

CSS/DHTMLバグ辞典スレッド第４版
http://pc5.2ch.net/test/read.cgi/hp/1078463560/l50

828 ：Name_Not_Found：04/04/22 06:05 ID:???

>>824
お前は表示方法を探しているのか？バグ探しをしているのか？

829 ：822：04/04/22 07:26 ID:???

>>827
そう言われても、まとまっていないから、どう報告したらよいのか分からないよ。

>>824
あのあとでも少し試したんだけど、結局 div.main を基準ブロックにして、
その中で div.menu と img を絶対位置指定してしまうのがいちばん簡単で、
互換性も高かった。>>820 氏の言うとおりか。

IE にはあまり凝った float を扱わせないほうが良いみたい。
IE を対象にする限り、div 厨になるのは避けられないと思う。

個人的には、>>823 の通り、画像は背景にした方が、ブラウザにあまり無理をさせずに
済むから良いと思いますけど。

830 ：Name_Not_Found：04/04/22 08:17 ID:???

>IE を対象にする限り、div 厨になるのは避けられないと思う。

無知の痛みを知れ

831 ：Name_Not_Found：04/04/22 08:24 ID:???

無知の痛みを知れだってさ

832 ：Name_Not_Found：04/04/22 11:35 ID:???

いて！！

833 ：Name_Not_Found：04/04/22 12:07 ID:???

ムチは痛いものと決まっている

834 ：ishi：04/04/22 13:04 ID:???

ご質問させてください。

テーブル内のリンク部分に、a:link a:visitedで指定した色が反映されません（ディフォルトの色になってしまう）。
テーブル内は別個に指定する必要があるのでしょうか??

ぜひご返答よろしくお願いいたします。

835 ：Name_Not_Found：04/04/22 13:07 ID:???

>>834
tableには継承されない。別個指定せよ。

836 ：Name_Not_Found：04/04/22 13:07 ID:???

>>834
>811-812

837 ：ishi：04/04/22 13:13 ID:???

ご返答ありがとうございました。

やっぱり別個に指定の必要があったのですね。

どうもありがとうございました。

838 ：ishi：04/04/22 13:48 ID:???

もう一度ご質問させてください。

恥ずかしながら、テーブル内への　a:link{ color: ----} の指定の方法がわかりません。
<table a:link="color:---">では駄目ですた。

是非もう一度ご返答を、よろしくお願いいたします。

839 ：Name_Not_Found：04/04/22 13:50 ID:???

>>838
>>4

840 ：Name_Not_Found：04/04/22 14:17 ID:???

　↑ishi　少しは自分で調べる努力をせんかい！！　って怒ってるんだよ。
　わかったら、結果を他の初心者のために書いておくれ。

841 ：Name_Not_Found：04/04/22 14:22 ID:108g3gDD

下記のサンプルで、baseの下端をbox1,2,3の中の一番下（サンプルではbox1の下端）にあわせたいんですが、
absolute指定しているbox（サンプルではbox1,3）は無視されるようでfooterがbox2の真下に来てしまいます。
なんか上手いやりかたはないですかね？

--以下サンプル--
<html>
<head>
<style type="text/css">

</style>
</head>
<body>

<div id="base">
<div id="box1"><p>box1</p></div>
<div id="box2"><p>box2</p></div>
<div id="box3"><p>box3</p></div>
</div>
<div id="footer"><p>footer</p></div>

</body>
</html>

842 ：ishi：04/04/22 14:28 ID:GW94clOP

ご叱責ありがとうございます。

ほぼ全部読んで今までCSS組んでいました（複雑ではないものですが）。
これだけどうしてもわからないのです。

CSS1 テストスイート: 2.1 アンカー
http://www.doraneko.org/css1test/sec21.htm

上のアドレスのソースを見ても、特にテーブルだけに指定しているようにも見えませんが、a:linkが反映してるんですよね・・・
ちょっとかなりお手上げ状態なので、是非教えていただきたいです････

よろしくお願いします。

843 ：Name_Not_Found：04/04/22 14:54 ID:???

「ご質問させてください」

(ﾟДﾟ)ﾊｧ?

844 ：Name_Not_Found：04/04/22 14:59 ID:???

>テーブル内のリンク部分に、a:link a:visitedで指定した色が反映されません（ディフォルトの色になってしまう）。
そんな筈はない。何処かで何かが間違っている。
それとブラウザの種類とバージョンぐらい明示しろ。

845 ：Name_Not_Found：04/04/22 15:01 ID:???

>841
#base に height:200px; を追加したらお望みのレイアウトになりましたが、
なんか邪道のような気がします

>842
tabel にもアンカー色の設定が継承されますね
内部スタイルシートでも外部スタイルシートでも同様でした
また、IE6、NS7、Opera7、NN4 のいずれでも同様の結果でした
問題のソースをさらしてみたらどうでしょう？

846 ：Name_Not_Found：04/04/22 15:01 ID:???

>>842
835が間違ってるんじゃねーのか？
俺のサイトはtableで普通にアンカーのスタイルが継承されてる。
842のソース晒してみれ。

847 ：841：04/04/22 15:13 ID:???

>>845
レスありがとう。
でもbox2の高さが左右のbox1,3より低い場合を想定してるので、
box2にheightを追加するってのはちょっと…。

848 ：Name_Not_Found：04/04/22 15:35 ID:???

>>842
a:link{ color: ----} → a:link { color: ----} これの予感。
　違ってからごめんにゃ。

849 ：Name_Not_Found：04/04/22 15:36 ID:???

日本語へん　すまそ

850 ：Name_Not_Found：04/04/22 16:07 ID:???

>>845-846
>tabel にもアンカー色の設定が継承されますね
ここでの a:link {} 云々の話と「継承」は関係がない。
アンカーの子孫部にしか，「継承」されるはずがない。
宣言に付随する疑似クラスが対象の要素とマッチしただけ。

851 ：Name_Not_Found：04/04/22 16:15 ID:???

>>829
まとめられないのなら仕方ない、そのまま報告して、先方にまとめて貰ひたまへ。

852 ：ishi：04/04/22 16:20 ID:???

レスありがとうございます。

いろいろ試した結果
テーブルだけに反映されてないのではなく
ページ全体に反映されていませんでした。しかもIEだけ反映されないようです。

ソースを見て何度も確認したのですが、どうしてもこのページだけ、a:link a:visitedの色替えができません。
しかもIE6.0だけでです。
Opera7、Mozilla1.6、NN7.1　では反映されています。

外部スタイルシートです。
ソースは、長いし、画像が多いのでさらしません。
ぼちぼち原因を突き止めることにします。

どうもお騒がせしました。

853 ：Name_Not_Found：04/04/22 16:24 ID:???

>>852
なんだい！！　お前さんの目は節穴か。
とりあえず　>>848はやっとけよ。

854 ：Name_Not_Found：04/04/22 16:26 ID:???

>恥ずかしながら、テーブル内への　a:link{ color: ----} の指定の方法がわかりません。
><table a:link="color:---">では駄目ですた。

まあ、こーゆーこと言ってる時点でオ㍗ルけどね。

855 ：Name_Not_Found：04/04/22 16:28 ID:???

予想。

<body a:link="#0000FF" a:visited="#800080" ... >
……
</body>

こんな具合だったりして(ぷげら

856 ：Name_Not_Found：04/04/22 16:36 ID:???

テストケースすら自分で作れない馬鹿が多すぎる。
>ソースは、長いし、画像が多いのでさらしません。
必要な部分だけを抽出して提示すればよいだろうに。
こういう馬鹿はいつにたっても、進歩がなさなそう。

857 ：Name_Not_Found：04/04/22 16:39 ID:???

いつにたっても

858 ：Name_Not_Found：04/04/22 16:42 ID:???

　○ ○　852の目

859 ：Name_Not_Found：04/04/22 16:47 ID:???

　～～　856の目

860 ：Name_Not_Found：04/04/22 17:33 ID:QprfIaEQ

http://ja.wikipedia.org/wiki/Css
にあるように、縦に水平線？をいれるにはどうすればいいんでしょうか？

861 ：Name_Not_Found：04/04/22 17:40 ID:???

>>860
border

862 ：842：04/04/22 17:42 ID:???

>841の「ご叱責ありがとうございます。」見てましな奴かと思ったんだけどねぇ
テストケース作っること考えつかない奴とは…
過去ログ見たらテストケースでソースさらしてるのなんてなんぼでもあるのに…

>850
「継承」の使い方間違ってましたね
勉強しなおします
指摘ありがとう

863 ：　↑：04/04/22 17:46 ID:???

？？？？？

864 ：Name_Not_Found：04/04/22 17:48 ID:???

>>860
border-right: 1px solid gray; つーのが有ったよ。　見たんだろ？

865 ：Name_Not_Found：04/04/22 18:07 ID:???

>>862

（￣＾￣）ふーむ。。。

866 ：Name_Not_Found：04/04/22 19:23 ID:pmgJhPFr

overflowを使用してFRAME(、FORM、IFRAME)などの枠を再現しようと、
以下のように長ったらしいソースになってしまいます。何か改善策はありませんか?
ソース：
CSS；
DIV.out-side { width:100%; border-top:1px solid #978e7b; border-left:1px solid #978e7b;}
DIV.in-side { width:100%; height:7em; overflow:auto; background-color:white; border-top:1px solid #404040; border-left:1px solid #404040; border-bottom:1px solid #D4D0C8; border-right:1px solid #EAE8E3}
HTML；
<div class="out-side"><div class="in-side">
適当な文字列。
</div></div>

867 ：Name_Not_Found：04/04/22 19:35 ID:???

おめーよー・・　　いいや

868 ：Name_Not_Found：04/04/22 19:42 ID:???

>>866
border をまとめて指定してしまえば結構短くなるよ。
あと、div が二個あるのはなんで？
ついでに、div.in-side の子は、適当な文字列、ではなく、
適当なブロックレベル要素、とした方がなお良しですよ。

869 ：Name_Not_Found：04/04/22 19:42 ID:???

>>842
邪道ですが、たぶんそれが正解なのではないかと思います。
>>841
多分これが正道だと思います。position をやめて float にする。
だけど IE にはこの↓バグがあるから、少しレイアウトが変わってしまう。
http://cssbug.at.infoseek.co.jp/detail/winie/b054.html
それでも構わなければ、どうぞ。
---------------------------------------------------
<html>
<head>
<style type="text/css">

</style>
</head>
<body>

<div id="box1"><p>box1</p></div>
<div id="box3"><p>box3</p></div>
<div id="base">
<div id="box2"><p>box2</p></div>
</div>
<div id="footer"><p>footer</p></div>

</body>
</html>

870 ：866：04/04/22 19:48 ID:pmgJhPFr

>>868
どうもありがとうございます。
＞ DIVが二つ

フレームの枠を拡大してみると、二重になってるからです。

＞適当なブロックレベル要素～

分かりました。そうします。

DIV厨まっしぐら(ﾉ∀｀)

871 ：Name_Not_Found：04/04/22 19:53 ID:???

フレームの枠とは？

872 ：822：04/04/22 19:54 ID:???

>>830
>無知の痛みを知れ

間違ったことを言ってしまったのでしょうか？すみません。
よろしかったら、>>817 をどう書いたら良いか、教えていただけないでしょうか？
煽りではなく、心から教えていただきたいと思っております。

IE が対象なら、結局 position を使うのが簡単で、結果もそこそこ、というのが
今の私の正直な考えです。
そして、position では、base となるブロック要素は、どう見ても装飾以外の
目的を持たないと思います。

この考えにこだわるつもりはなくて、もっと先に進みたいのです。
そのためのヒントだけでも、教えていただければ助かります。

873 ：Name_Not_Found：04/04/22 19:55 ID:???

>>866
用語は正確に使わないと、相手に伝わらないぞ。

874 ：866：04/04/22 20:02 ID:pmgJhPFr

説明の仕方が悪かったです、すいません。

フレームの枠と言いますか、FORMの枠です。
以前はFORMを使って更新履歴を記録していたのですが
FORMを使ってそういうことはよろしくないとの意見があったので
代替案として上がったoverflowを使いました。

端的にいうと、overflowを使ってFORMのように見せかけたいのです。

875 ：Name_Not_Found：04/04/22 20:02 ID:???

>>847
いや、ちょっとちがうよ。
>>845 氏が height:200px を設定したのは、box2 ではなくて base だよ。
だから、box2 が、box1, 3 より背が低くても、問題ないよ。

876 ：Name_Not_Found：04/04/22 20:22 ID:???

>>874
要するに、飾りで線をいれたい　って訳かい？

htmlに　frameが・・ｺﾞﾆｮｺﾞﾆｮと・・　

877 ：Name_Not_Found：04/04/22 20:23 ID:1UaP3mEI

background-image: url("black.gif");
と
background-image: url(black.gif);
どっちが正しい書き方なんでしょうか？

878 ：Name_Not_Found：04/04/22 20:28 ID:???

>>874
>>868さん１行目に書いてある。これで短く出来る。

879 ：866：04/04/22 20:29 ID:???

>>878
分かりました。

皆さん、どうもありがとうございました。

880 ：Name_Not_Found：04/04/22 20:29 ID:???

>>877　　上。

881 ：Name_Not_Found：04/04/22 20:32 ID:???

>>866
がんがれよー。

882 ：Name_Not_Found：04/04/22 20:32 ID:???

>>874
あなたの言いたいことがやっとわかったよ。×フォーム → ○ textarea
多分、これであなたの目的はかなうと思う。
Mozilla で少し見づらくなるけど、背景色をつけたりして適当に対応してね。

<html>
<head>
<style type="text/css">

</style>
</head>
<body>

<div class='history'>
更新履歴
</div>
</body>
</html>

883 ：Name_Not_Found：04/04/22 20:39 ID:???

あ、まずい。overflow:auto が抜けてた。
div.history {
　　border:white inset 2px;
　　height:7em;
　　overflow:auto;
}

884 ：Name_Not_Found：04/04/22 20:40 ID:???

>>866
>>882が示してくれたように書く分には、
div厨と呼ばれるほどのものではないと思うよ。

個人的には、divの子にCDATA（素のテキスト）とか
インラインレベル要素が来ると、div厨っぽく感じる。

がんがれ。

885 ：841：04/04/22 20:51 ID:???

>>875
あ、言われて気づきました。>>845さんスミマセン…。
でもbaseにheightは指定したくない（下に伸びてくれないと困る）のでやっぱりむりぽです。

>>869
floatを使うことも検討中でした。
わざわざありがとうございます。

886 ：Name_Not_Found：04/04/22 20:51 ID:???

>>877
CSS2 では、url() の引用符はオプションだから、つけないのが正式。
http://www.y-adagio.com/public/standards/tr_css2/syndata.html#uri

ちなみに、Mac IE には、'' でくくった url を認識しないバグがあるから、
引用符はつけないのが無難なのだそうだ。
http://cssbug.at.infoseek.co.jp/detail/macie/b047.html

887 ：Name_Not_Found：04/04/22 21:53 ID:???

DIV厨の定義がよくわからないのだが、
http://hp.xrea.jp/ko/index.html
こういうのか？

888 ：Name_Not_Found：04/04/22 21:55 ID:???

>>887
そういうのだ。DIV無しにしてHTMLとして成り立っていなければDIV厨。

889 ：Name_Not_Found：04/04/22 21:57 ID:???

>>887
ttp://hp.xrea.jp/s/u/index.html
ワラタ

890 ：Name_Not_Found：04/04/22 22:00 ID:???

>>888
なるほど、ありが㌧

891 ：Name_Not_Found：04/04/23 00:10 ID:???

>>887
他のページはDIV厨ではないんだね。

892 ：Name_Not_Found：04/04/23 00:18 ID:???

>>887
書いてある内容とやってることが全然違うサイト

893 ：Name_Not_Found：04/04/23 01:02 ID:???

>>887
DIV厨って言う奴はウザイが

<DIV CLASS=title1>更新情報　2004年度</DIV>
<DIV CLASS=title2>4月16日　<SPAN CLASS=sh>簡単相対リンクのデザインを変更</SPAN></DIV>
これはさすがに…

894 ：Name_Not_Found：04/04/23 04:47 ID:???

>>891
他のページはtable厨ですな

895 ：Name_Not_Found：04/04/23 05:23 ID:???

>>887
2004年度って・・・・

896 ：Name_Not_Found：04/04/23 08:16 ID:???

デブ厨はホンマ駄目だな！

897 ：Name_Not_Found：04/04/23 09:06 ID:???

スレ違い

898 ：Name_Not_Found：04/04/23 11:52 ID:GEPlptDH

全称セレクタを要素内にいれていいの？
例えば

em *{color:#ddd;}

899 ：Name_Not_Found：04/04/23 12:48 ID:???

>>898
問題ないはず。

>>all
DIV病
http://www.fromdfj.net/html/divsyndrome.html

ただ、DIV病は CSS 学習期に必ずかかる、はしかのようなもので、
そのままステップアップして行くことさえできれば、一概に否定しなくても
良いのではないかと思う。

900 ：Name_Not_Found：04/04/23 13:12 ID:???

否定すべきだと思う

901 ：Name_Not_Found：04/04/23 13:39 ID:???

お前達のを見たいもんだ。　誰か晒せ。

902 ：Name_Not_Found：04/04/23 13:41 ID:???

>DIV病は CSS 学習期に必ずかかる

HTMLの理念を理解できていれば、DIV病には冒されない。
HTMLを勉強せずに、CSSを学習するからDIV病に冒される。

>そのままステップアップして行くことさえできれば

DIV病に冒された段階で、ステップアップできない。

903 ：Name_Not_Found：04/04/23 13:49 ID:???

>>all
議論はよそで

904 ：Name_Not_Found：04/04/23 14:01 ID:???

結局DIV厨が自己弁護の為にあぁだこぅだ言ってるだけだな

905 ：Name_Not_Found：04/04/23 14:56 ID:???

CSSの宣言（？）を、
<html>
の前に書くのと後ろに書くのはどう違うんですか？
上のサイト行っても、とほほさんは後ろ、ばけらさんは前に書かれてます。

906 ：Name_Not_Found：04/04/23 15:09 ID:???

>>905
とほほは疑ってかかれ。これ定説。

907 ：Name_Not_Found：04/04/23 15:11 ID:???

>>905
見てきたけど、どちらも後ろに書いてあるように見えるが。
つーか、htmlの後ろというか、headの後ろが正しい。

908 ：Name_Not_Found：04/04/23 15:11 ID:???

単に好みの問題

909 ：Name_Not_Found：04/04/23 15:12 ID:???

>>905
前とか後ろというのが、いまいち理解できないが・・

　とりあえず
<!DOCTYPE*****
<html lang="ja">
<head>
　ここ　
</head>
<body>
ごにょごにょ
</body>
</html>

　　ばけらは外部ファイルだったような・・・

910 ：Name_Not_Found：04/04/23 15:14 ID:???

>>905
実はどちらも違わない。CSS の適用は、html の読込が終わってから
行われるから。

ただし、<style> を <head> ～ </head>の外に書くのは文法違反。
ここで試してごらん。
http://hanoi.softvision.co.jp/htmllint/htmllint.html

参考
http://www.ne.jp/asahi/minazuki/bakera/html/reference/headmisc#style

911 ：910：04/04/23 15:26 ID:???

すまん。
> CSS の適用は、html の読込が終わってから行われるから。
この部分だけ撤回。

ちょっと勘違いしてたみたい。

912 ：Name_Not_Found：04/04/23 15:29 ID:???

>>911
なんだか全部がガセに見えちゃうよ。

913 ：Name_Not_Found：04/04/23 17:22 ID:dceME1y9

ttp://www001.upp.so-net.ne.jp/oka/iframe_dm.htm

上記のサイトの一番上にあるような選択欄みたいなのに、
スタイルシートを適用したいのですが、どのようなプロパティを指定すればいいのでしょうか？

914 ：Name_Not_Found：04/04/23 17:32 ID:???

>>913
SELECT要素と言え。で?

915 ：Name_Not_Found：04/04/23 17:40 ID:dceME1y9

>>914
スタイルシートを使ってその選択欄の背景色を変えたりしたいんですが、無理なのでしょうか？

916 ：Name_Not_Found：04/04/23 17:42 ID:KcRSS4Cy

>>914
お前に用はないよどっかいってください

917 ：Name_Not_Found：04/04/23 17:48 ID:???

>>915
無理じゃないよ。

918 ：Name_Not_Found：04/04/23 17:51 ID:dceME1y9

>>917
そうですか。ありがとうございます。SELECT要素でもっかいグ愚ってきます。

919 ：Name_Not_Found：04/04/23 18:22 ID:???

>>916
IDがRSSだわ。

>>918
select要素でググってもでない予感。CSSの基礎を学べばわかるはず。

920 ：905：04/04/23 21:59 ID:???

みなさん回答ありがとうございます。
自分は一般的なHTML言語を使える程度です。
今からcss勉強しようと思ってます。
勉強の順番は、
HTML→css→Java Script
で大丈夫でしょうか。
今からこつこつとやっていこうと思ってます。
Web Page作成に当たって、これはしっとけ、これはもっとけみたいなのがあったら教えてください。
最終的には掲示板なんかも自作でやりたいと思ってます。
というか、どこまで自作でできるものなのでしょうか？
アクセス解析なんかも自分でできるのでしょうか。

921 ：Name_Not_Found：04/04/23 22:06 ID:???

>>920
スレ違いですよ。

922 ：905：04/04/23 22:16 ID:???

>>921
失礼しました。
では、勉強の順番を教えていただけないでしょうか。
順番というか、Web Page作成におけるcssの位置づけみたいなもの。
全体像がわからないとどれから勉強すればいいのかよくわからないので。

923 ：Name_Not_Found：04/04/23 22:22 ID:???

>>922
ちょっとﾜﾗﾀ

924 ：Name_Not_Found：04/04/23 22:25 ID:???

僕の肛門も順番を知りたがっています。

925 ：Name_Not_Found：04/04/23 22:27 ID:???

>>922
初心者スレ池

926 ：Name_Not_Found：04/04/23 22:28 ID:???

>>922
順番は、まあそれで良いのじゃないかな。
並行して PHP とかも勉強すればなお良しかと。
これ以上は、どうぞこちらへ。

Webサイト製作初心者用スレ vol.89
http://pc5.2ch.net/test/read.cgi/hp/1082203621/l20

927 ：Name_Not_Found：04/04/24 00:21 ID:???

308 ：Name_Not_Found ：04/03/31 15:52 ID:???
>>4のテンプレURL変更あったので報告。

> ・『スタイルシートWebデザイン』ボランティアHTML化版。
> 　http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
　　　　　　　　　　　　　　　　↓
http://www.asahi-net.or.jp/~jy3k-sm/css1/2004maki/

309 ：Name_Not_Found ：04/03/31 15:58 ID:???
>>308
了解、こちらは変更した。
http://web2ch.s31.xrea.com:8080/?CSSRelated

928 ：Name_Not_Found：04/04/24 00:38 ID:???

>>927
ああ、それねえ、あのあとすぐに元に戻ってたよ。
クリックしてごらん。2003maki の方がつながるから。

・『スタイルシートWebデザイン』ボランティアHTML化版。
　http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/

そこには毎日行ってるけど、結局、ディレクトリが変更されてたのは、たった1日間
ぐらいだったような記憶がある。何があったのかしら？

929 ：テンプレ：04/04/24 00:44 ID:???

CSSに関する質問はこちらへどうぞ。　※　議論はよそで　※
■■■■■　質問のしかた　■■■■■
・基礎は解説サイト（>>4・かなりわかりやすい）で勉強してください。
・質問の前に【FAQ】（>>5-8）を参照して、既出の再掲を避けて下さい。
・【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。
　WinIEの場合は、[Ctrl+F]で検索できます。
・ブラウザによって対応していないプロパティーやバグがありますので、
　【解説など】（>>4）の対応表や「CSSバグリスト」に目を通しておきませう。
・土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
　正当(valid)なHTMLを心がけて下さい。validator（>>3）でチェックできます。

初心者の疑問は大抵ここまでで解決します。

・OSやブラウザの種類とヴァージョンについては必ず明記してください。
　特にNetscapeは、ver.4までと6以降でまったく別物です。
・「環境を書け」とか「ソースは？」と求められたら応じませう。
　その方が回答が早く得られます。質問は具体的に。

過去スレや関聯リンクは>>2-10
【過去ログ】【関聯スレ】>>2
【仕様書】【CSS検証】>>3
【解説など】>>4
【FAQ】>>5-9

http://web2ch.s31.xrea.com:8080/?CSS
【FAQ】　http://web2ch.s31.xrea.com:8080/?CSSFAQ
【過去ログ】　http://web2ch.s31.xrea.com:8080/?CSSLog
【関連リンク】　http://web2ch.s31.xrea.com:8080/?CSSRelated

930 ：Name_Not_Found：04/04/24 00:47 ID:???

931 ：Name_Not_Found：04/04/24 00:48 ID:???

【関聯スレッド】
・CSS/DHTMLバグ辞典スレッド第４版
　http://pc5.2ch.net/test/read.cgi/hp/1078463560/l50
・代替スタイルシートに萌え～
　http://pc5.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
　http://pc5.2ch.net/test/read.cgi/hp/1019912046/l50
・* CSS[適用="2ch"]{ イケてるスタイルを："作れ"}
　http://pc5.2ch.net/test/read.cgi/hp/1038678267/l50
・CSSでイケてるデザインサイト 21
　http://pc5.2ch.net/test/read.cgi/hp/1078361001/l50

【仕様書】
・CSS1の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS1/
・CSS2の仕様書の原文(英語)
　http://www.w3.org/TR/REC-CSS2/
・CSS1の仕様書の邦訳（日本規格協会訳／個人訳）
　http://www.y-adagio.com/public/standards/css1/toc.htm
　http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css1/rec-css1.html
・CSS2の仕様書の邦訳（日本規格協会訳／個人訳）
　http://www.y-adagio.com/public/standards/tr_css2/toc.html
　http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html

【CSS検証】
・W3C CSS 検証サービス
　http://jigsaw.w3.org/css-validator/

932 ：Name_Not_Found：04/04/24 00:49 ID:???

933 ：Name_Not_Found：04/04/24 00:53 ID:???

【FAQ】
Q1: IEでは大丈夫なのに、Netscape6 以降で見ると横スクロールバーが出たりするが？
A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。
「width と height の計算方法の実装の違いについて」参照。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height
width（height）は、要素の内容領域の幅（高さ）を指定するプロパティですが、
WinIE等では、ボーダー領域 + パディング領域 + 内容領域の寸法で計算されます。
Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。
WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます。
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3
参考「IEとNNのBOXの計測方法の違いについて」
http://www.fromdfj.net/html/border2.html

Q2: tableなどブロック要素をセンタリングするには？　text-align:center;を指定しても Netscape6(or7)ではなりません。IEでは中央寄せになるのに……
A2: IEの実装の誤りです。詳しくは下記（特に5.）をご覧ください。
1.'text-align'に関する考察
http://anslasax.net/css-make/t-a/index.html
2.IE5.5とNetscape6のCSS - 中央寄せ
http://tancro.stp-1.com/stylesheet/n6_center.html
3.Internet Explorer 6におけるCSSの拡張
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic6
4.Tableのセンタリング
http://members.jcom.home.ne.jp/jintrick/Personal/css_miss_table.html
5.ブロックレベル要素をセンタリングする方法
http://www.mozilla.gr.jp/standards/webtips0004.html

934 ：Name_Not_Found：04/04/24 00:55 ID:???

【FAQ】
Q3: CSSで段組するには？
A3: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
　http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
　http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラム・デザインを実現する方法
　http://www.motchie.com/article/multicolumn.html
tableを使はない段組:CSSによるマルチカラムデザインについての考察
　http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
　http://members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html
スタイルシートでマルチカラムデザインの実現
　http://shiten.s9.xrea.com/etc/stylesheet/multi_column.htm
段組れいあうとてすと　(floatによる段組の例)
　http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
なかよしぱれっと　（ネスケ４でも崩れない段組みの実例）
　http://village.infoweb.ne.jp/~fores/

Q4: なんかフロートの表示が崩れるみたいなんですけど？ †
A4: floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
またfloat:left;で回り込むのはテキスト（imgを含む）だけです。
ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:（浮動要素のwidth）;”なりを指定する必要があります。WinIEの間違った実装で誤解が多いので注意。
　http://cssbug.at.infoseek.co.jp/detail/winie/b054.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
　http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
　http://cssbug.at.infoseek.co.jp/detail/winie/b079.html
　http://cssbug.at.infoseek.co.jp/detail/winie/b053.html

935 ：Name_Not_Found：04/04/24 00:59 ID:???

【FAQ】
Q5: CSSで擬似フレームってどうやるの？
A5: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
　http://kobit.info/tips/overflow.html
　http://kobit.info/files/frame.html
overflowを用いた擬似フレーム
　http://www.fromdfj.net/html/overflow.html
レイアウトサンプル擬似フレーム
　http://www.rju666.com/web/layout/imitate_frames.html

Q6:画面中央に配置するにはどうすれば？
A6:左右（水平方向）のセンタリングはA2に既出。垂直には色々な方法があります。
　「スタイルシート縦中央(垂直中央)」参照のこと。
　http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm
vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。

Q7:背景画像を二つ指定するにはどうするか。
A7:background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。

Q8.dt・ddを横並びにしたいのですが。（会話文など）
A8.floatとmargin-leftの応用で。下記サイトを参照のこと。
「<dl> の整形」
　http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

Q9.リンクした画像の線が消えません。
A9.img要素ではなくa要素をセレクタにしてborder指定してませんか？　
a:link img, a:visited img, a:hover img {border:none;}
NN4は http://cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。
text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。
cf. http://cssbug.at.infoseek.co.jp/detail/winie/b040.html

936 ：Name_Not_Found：04/04/24 01:00 ID:???

【FAQ】
Q10.リンクを新しいウィンドウで開かせるにはどうしたら？
A10.ＣＳＳではできません。target属性かJavaScriptでやって下さい。
別窓が開くと迷惑に感じる人もありますからなるべくしない、がＷ３Ｃの方針です。

Q11．いままでＨＴＭＬでやってた××をCSSでやるにはどうすればいい？
A11．下記に書いてあります。テーブル・レイアウトは段組のFAQ（A3・>>6）をご覧あれ。
「いままでの HTML との対照」
　http://www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm
　http://www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm
　http://www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm
HTML でのレイアウト指定の、 CSS での指定との対応表
　http://deztec.jp/site/tips/page/p0037.html

937 ：Name_Not_Found：04/04/24 01:01 ID:???

次回からスレッド立てる人は、下記の変更・追加もよろしく。

■ ローカルルール等リンク先更新総合スレッド 10
http://qb3.2ch.net/test/read.cgi/operate/1079706809/

【過去ログ】http://web2ch.s31.xrea.com:8080/?CSSLog

938 ：Name_Not_Found：04/04/24 01:12 ID:???

おまえら10レスくらいあれば質問1件いけるじゃないか

939 ：Name_Not_Found：04/04/24 07:35 ID:???

位置指定についての質問です。
positionをrelativeすると下に余白ができてしまいます。
absoluteにすると大丈夫みたいです。
この余白は相対的に配列する場合は仕方がないのでしょうか？
そもそも相対的と絶対的の使いわけがわかりません。
ということで、
①余白の解決法。
②使い分け。
をご教授願えないでしょうか。

940 ：Name_Not_Found：04/04/24 07:51 ID:???

>>939
ソースが無いとわからんのだが、
余白はmarginなりpaddingなりでなんとかするのが吉。

相対配置、絶対配置の使い分けは状況（や人）によって変わるので
相対指定で配置したい場合と絶対指定で配置したい場合、としか答えられん。

941 ：Name_Not_Found：04/04/24 08:19 ID:???

>>939
相対位置は、本来その要素があった場所からの位置指定。
絶対位置はウィンドウ枠からの位置指定。
　ただし親要素にも position が指定されてた場合はその親要素からの位置指定。

①絶対位置指定する。相対指定の場合、そのボックスの範囲は保持したままになる。
②相対位置は少し「ズラしたい」時に。
　絶対位置は大きく「移動させたい」場合。または「他の要素に重ならせたい」場合。

こんな感じかと。

942 ：Name_Not_Found：04/04/24 08:40 ID:???

type要素やmeta要素をタイプセレクタにしていいの？

943 ：Name_Not_Found：04/04/24 08:40 ID:6WcfM3f9

こんにちは。昨日からCSSを始めました。初心者で申し訳ないです。。
http://www.fairies-garden.com/pso/index.html
↑が今作っているサイトです。

Div要素の段組を今は
------　------
l 　　　 l　l　　　l
l 　　　 l　l　　　l
------　------
という感じで横並びなのですが、

------　------
l 　　　 l　l　　　l
l 　　　 l　l　　　l
------　------
--------------
l　　　　　　　　　 l
--------------
このように下にもう一段つけようと思っています。
申し訳ないのですが、テンプレの方から見つけることはできませんでした。
仕方なく今は<BR>を何十回も打ち込んでDivの外に出るように調節しているのですが、、

Div.column { position: absolute;
background: #F5F5F5 }
#column1{width:58%; left:1%}
#column2{width:40%; left:60%}

ソースはこんな感じでいいですか？
colum3のプロパティをどのようにしたらいいのか教えてください。
よろしくお願いします。

944 ：Name_Not_Found：04/04/24 08:55 ID:???

>>942
いいわけありません

945 ：Name_Not_Found：04/04/24 09:37 ID:???

>>943
>>6じゃダメか？

946 ：Name_Not_Found：04/04/24 09:39 ID:???

>>943
絶対配置じゃ、その段組は難しいかもしれない。
上2つ段が必ず同じ高さなわけないと思うし。

それよりも float 使うほうが楽ぽいよ。

#column1 {
margin-left: 1%;
float: left;
width: 58%;;
}

#clumn2 {
margin-left: 60%;
float: right;
width: 40%;
}

#column3 {
clear: both;
}

こんな感じかと。2番目のコラムは margin-left いらんかもしらん。

947 ：Name_Not_Found：04/04/24 09:49 ID:???

>>946
横レスｽﾏｿ。
それ、IE６で上手くいく？
なんか、前にやったときはwidthを％で取るとおかしな
値になったような気がしたのですが・・・

948 ：947：04/04/24 09:50 ID:???

って、スイマセン。やってみれば良い話ですよね。
ちくっと試してみます。失礼しますた。

949 ：Name_Not_Found：04/04/24 10:02 ID:???

>>943
長さの値には単位が必須です。
フォントサイズ固定は嫌われます。
:alink ではなくて a:link です。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>ぷそバト</title>
<link rel="stylesheet" type="text/css" href="http://www.fairies-garden.com/pso/nomal.css">
<style type="text/css">
h2 { margin-top: 0; }
.article { border: solid 1px; margin: 1em 0; }
#whatsup { float: left; width: 59%; }
#contents { text-transform: uppercase; margin-left: 60%; }
#footer { clear: both; margin-top: 4em }
</style>
<h1>ぷそバト－PSOバトル情報サイト for BLUEBURST－</h1>
<div id="whatsup">
<h2>公式更新情報</h2>
<div class="article"><p>ＢＢには新マップやら新モンスターやらが追加されるらしいです。</p></div>
<div class="article"><p>製品版の情報が出ました。</p></div>
</div>
<div id="contents">
<h3>コンテンツ</h3>
<ul>
<li><a href="index.html">Home</a></li><li>Rule</li>
</ul>
</div>
<div id="footer">
<p>このページで使用されている画像は（株）ソニックチームの許諾を得て、キャプチャーしたものです。配布や再掲載は禁止されています。</p>
<address>2002- by sunahara</address>
</div>

950 ：Name_Not_Found：04/04/24 10:12 ID:???

>>949
<ul>
<li><a href="index.html">Home</a></li>
<li>Rule</li>
</ul>

951 ：Name_Not_Found：04/04/24 10:40 ID:???

>>949　なんか匂うな。

952 ：Name_Not_Found：04/04/24 11:10 ID:???

>>950
行数制限に引っかかるから短縮してるんじゃねぇの。