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

>>451
ぜんぜん辛くないぞ。むしろ
うだうだ表組みしない分だけ、手書きの身にはらくちんだ。
おれのサイトは画像サイトで、広告もばしばしはって
みじめたらしく小遣い稼ぎしているんだが、
おれの悩みはxhtmlの「構造」だな。
できれば<h1>を先頭に出したいが、そうもいかない。
<h1><h2><h3>と理路整然に並べるのも苦しい。
広告の見出しにhをつけたものか、<p>でもかまうまいかと
もんもんと悩む。

>>460
すんません。欲しがってるくせにやらしく「ねえし」とか遠回しな要求の仕方をしてることに気付きました。
感謝します。

>>461
> できれば<h1>を先頭に出したいが、そうもいかない。
　なぜ？

> <h1><h2><h3>と理路整然に並べるのも苦しい。
　なぜ？

> 広告の見出しにhをつけたものか、<p>でもかまうまいかと
> もんもんと悩む。
　見出しだからつければいいでしょ？

>>462
おまえアホか？　

俺も構造で悩むってのは理解できん。
自然にh1は一番頭に来るし、h1h2h3普通に作ってきゃ並ぶし
ソースに寄るが、広告の「見出し」ならhnでいいだろ。いずれにせよスレ違い。

>>457
原因がわかりました。
×over-flow
○overflow
typoですね。

>>464
いかにおまえが楽なデザインしかしていないかということだな。
新聞みたいに満載のページを作れば悩む。
たとえば、広告がある。それも一箇所でなくあちこちに。
(広告）<h1>記事<h2>記事（広告）<h3>記事（広告）
とある場合広告のヘッダはどうするんだ。
記事と広告は無関係なのだから、広告は独立したものと見做し<h1>とつけるか。
すると、<h1><h1><h2><h1><h3><h1>となるだろうが。
あんたは深い考えなしに適当なhnをつけるのだろう。
しかし広告はどこにあっても同じなんだから
広告挿入位置でhnの扱いが違うのはおかしい。
それじゃおかしいから<p>でやり過ごすか。
おれはそういうことを言っているのよ。
幼稚なことしか頭が回らないならふざけた口ぶりで絡んでくるな。

>>466
スレ違いだよ。

ただ、一つだけ言うと、
例えば、「おじいちゃんのHTML講座」というサイトの「おじいちゃんのtips」というコンテンツの見出しは、「おじいちゃんのtips」なので、「<h2>おじいちゃんのtips</h2>」などとするけれど、
そこへの参照リンクを張るときは、「それを見出しとするかどうか」なんて考えればわかるだろ。見出しなわけない。

要は「それ自身がそれ自身にとっての見出しなのかどうか」と「この文書にとっての見出しかどうか」で判別できる、ってこと。

いやあなんつうか、煽り好きですね……
それはともかく
>いかにおまえが楽なデザインしかしていないかということだな。
楽なデザイン云々じゃなくて、ﾄﾞｷｭｿ広告貼りまくってるのから
ややこしくなってるだけなんじゃないの？単に。
大体、広告の見出しってのがわからんけど、広告ってバナー画像
はって、それクリックすると広告元に飛ぶ奴だろ？それにさらに見出し
つけんのか？？糞広告貼るほど貧乏じゃないからわからんけど。

[広告]
いまなら*%値引き！（広告の説明）

って形は普通に見るが


**PC専門店（見出し）
[広告]
いまなら*%値引き！（説明）

これは見たこと無い。

>>467
なんの関係もない話だな。まあ、いいよ。スレ違いなんだろ。
その程度のレベルの人間と話しても無駄だ。

word-break、overflow-yはIE独自拡張でした。自己解決。

>>470
読解力ないね。まあもまいがどんなヘタレソース書こうがどうでもいいけど。
慈悲かけてやって損した。

>>461
おまえはこっち。
Webサイト制作初心者用スレ vol.76
http://pc2.2ch.net/test/read.cgi/hp/1070358554/l50
まあ、ヘタレは向こうに書き込まないだろうけどな。

つーか複雑なレイアウトも糞も、
小遣い稼ぎ広告入れてるからややこしくなってるだけの話じゃないのか・・・？

470 名前:Name_Not_Found 投稿日:03/12/03 10:11 ID:in8hHNnB
> >>467
> なんの関係もない話だな。まあ、いいよ。スレ違いなんだろ。
> その程度のレベルの人間と話しても無駄だ。
（´-`）.｡oO（本気で理解できていなかった様子。

>>468=455じゃないのか。だったらスマン。
＞ﾄﾞｷｭｿ広告貼りまくってるのから
まあそのとおりなんだけどな。
貧乏人には月3万でも結構うれしいもんなのさ。
イケてるＣＳＳサイトのリンクを見て回ったが、
おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。
自分のがイケてるサイトとは思わないけどね。
ＣＳＳサイトで新聞みたいに記事と画像と広告が満載のサイトは
見たことがない。参考にしたいんだけどねえ。

>>473
それ以前に、「広告における見出し」と「自サイトの見出し」の区別が出来てないだけだろ。

>>475
お前は内容で判断せずに煽るんだね。とことん腐れだな。腐れ人間に腐れ広告に腐れソースか。おもしれえ。

>>475
> おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。
構文が複雑になるのは簡素に書く能力が欠損してるだけでは？

まあ、in8hHNnBは貧乏なわけだが。

>>475
> 自分のがイケてるサイトとは思わないけどね。
俺も思いません。

>>475
> ＣＳＳサイトで新聞みたいに記事と画像と広告が満載のサイトは
> 見たことがない。参考にしたいんだけどねえ。
　見易さを考慮するとそういうデザインにならないからこういう結果になってるのでは？

そもそも、広告って自分のサイトの内容と関連性がないのに
ページ単位の見出しを与えようと考えるのが間違いじゃ？
hnなんてはなから候補にはいらんだろ

＞ 構文が複雑になるのは簡素に書く能力が欠損してるだけでは？
簡素なもの以外ははじめから諦めてんだろ？
http://nytimes.com/をxhtmlとCSSで寸分の破綻もなく
論理的に組み立てるのが訳ないならおまえは立派だよ。

>481
　>>476が理解できないんだから、何言っても無駄だ。

>482
　はじめに見栄えありき、な人には紙媒体をオススメしまつ。
HTMLとCSSの考え方とは違う、ということに気付けばこんな愚問はでないはず。

語弊があるね。
×HTMLとCSSの考え方とは違う、
○「HTMLとCSS」で構築するドキュメント作成の考え方は「見栄えありき」とは違う、

>>in8hHNnB
あなたのようなものの考え方をするお方にはテーブルレイアウトというふさわしい手法がご用意されておりますのでご安心を。

>>482
> http://nytimes.com/をxhtmlとCSSで寸分の破綻もなく
> 論理的に組み立てるのが訳ないならおまえは立派だよ。
　論理的な枕木じゃないのに、それを論理的に作れ、ってのは無茶だよな。
インスタントラーメンの味を手作りで再現して（ここまでは出来るとしても）、それで料理大会で合格しろ、と言ってるようなもの。

早くおいでよ。

これで自分の間違いに気付ければ彼も成長できるんだろうけど。

>>481
だから一応おれは<p>で囲ってんだが。
たとえば、<h1><h2><p>記事</p><p>広告</p><h2>...とあったとする。
構造的には広告が<h1><h2>に内包されておかしいだろ。
ぜんぜん別物なんだから。無関係なんだから。
で、別物だとはっきりさせるために、広告にhnつけて分けると
ますますおかしい。hnの候補にならないというのは同意。
だからどうしたものかと悩んでいると話したところ、
阿呆の455が絡んできたわけよ。

>>489
そもそも悩むことがおかしい、と全員言ってるんだけどな。
見出し（本文が存在する）なら広告でも見出しとすればいいし（現に>>461で「広告の見出しに」と言っている）、
広告そのもの、（見出しではない）なら見出しとして扱わなければいい。

>>461の段階で、「広告の見出し」と言っているのだから、>>462の「見出しだからつければいい」は妥当。

＞広告は独立したものと見做し<h1>とつけるか
なんてのはそもそもHTMLの構文自体理解できていないことが原因じゃないか。

＞だからどうしたものかと悩んでいると話したところ
どこで話したらいいかがわからない時点で「構造と見栄えの分離」以前の「構造」レベルの質問であることがわかるな。

>>489
誰の目から見ても>>455の方がHTMLを理解しているぞ。

もまいらいい加減相手にするのはやめろ。

>>490
じゃ、おまえならどうするんだ。
勘違いがあるといけないから強調しておくが、
<h1><h2><p>記事</p><p>広告</p><h2>..
は極端に簡略化して提示しているんだからな。

<h1><h2><p>記事</p><p>広告</p><h2>..
はこれでオッケーか。おれはこれだと
構文的に<h1><h2>で括られて非常に居心地が悪いんだが。

>>494
> <h1><h2><p>記事</p><p>広告</p><h2>
hnにブロックレベル要素は入れれませんて。

>>494
> <h1><h2><p>記事</p><p>広告</p><h2>..
> はこれでオッケーか。おれはこれだと
　こんなレベルのやつと話してたとは……。

なんだ、真性だったんか・・・

>>495
おまえらアホか。てか、頭大丈夫か。
一瞬、なにを言っているのか理解できなかったぞ。
</ は省略してるに決まってるだろうが。

>>498
お前の脳内定義なんて知るかよ。

>>494
答えてあげよう。
本文に入れずにincludeして、さらにそれをポジションで適切な場所に配置。
文書自体にも本文にも関係ないんだから。

>>494
お前の居心地を解決するならこうかな。

<h1>〜</h1>
<div id="hoge">
<h2>〜>/h2>
<p>〜</p>
</div>
<p>広告</p>
<div id="hoge2">
<h2>〜>/h2>
<p>〜</p>
</div>
<p>広告</p>

おい。貧乏人、これじゃ気に入らんのか？
h2直下になるのが嫌、というが、

<h4>更新履歴</h4>
<p>なし</p>
<address>〜</address>

その言い分だと著者情報も更新履歴の一部じゃねえか、となっちまわねえか？

＞in8hHNnB
こっちで聞いてみれば？
Strict-HTML スレッド17
http://pc2.2ch.net/test/read.cgi/hp/1068907834/l50

>>500-501
まともなレスに感謝する。
＞ 本文に入れずにincludeして、さらにそれをポジションで
やってるよ。配置しやすい場所は。レイヤーで重ねるとか
いろいろためした。見栄えと構造が分離しているのはあたりまえだが、
その構造部分も内容とその他で分離しようと努力した。疲れたよ。

>502　なるほどdiv囲みね。<h1><h2>などの階層をdivで囲い込みして、
<p>広告</p>を叩き出すわけだな。すると広告はhnで階層化されていない
素地の場所の<p>となるわけだ。ああ、多少もやもやはあるが
それがいちばんしっくりきたよ。理屈が通る。いや、ありがとう。

しかし、基礎のきだよな

>>ID:in8hHNnB
あなたはテーブルでレイアウトしてるのが丁度いいレベルだと思いますよ。
というわけで次からは初心者スレで大暴れして下さいね。

>>504
で、>>500-502は俺なんだよね。
人で判断せずに、内容で判断してね。

> なるほどdiv囲みね。
今頃そんなこと言ってる人はさっさと初心者スレに移動して下さい。

544→455だったね。

466 名前：Name_Not_Found[] 投稿日：03/12/03 09:58 ID:in8hHNnB
>いかにおまえが楽なデザインしかしていないかということだな。
>幼稚なことしか頭が回らないならふざけた口ぶりで絡んでくるな。

470 名前：Name_Not_Found[] 投稿日：03/12/03 10:11 ID:in8hHNnB
>その程度のレベルの人間と話しても無駄だ。

475 名前：Name_Not_Found[] 投稿日：03/12/03 10:20 ID:in8hHNnB
>おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。

489 名前：Name_Not_Found[] 投稿日：03/12/03 10:40 ID:in8hHNnB
>だからどうしたものかと悩んでいると話したところ、
>阿呆の455が絡んできたわけよ。

504 名前：Name_Not_Found[] 投稿日：03/12/03 11:27 ID:in8hHNnB
>なるほどdiv囲みね。

========================================================
>なるほどdiv囲みね。
ｵﾅｶｲﾀｲ…

テーブルレイアウトと言うよりどこでも配置モードで作るのがオススメ☆

>>510
>阿呆の455が絡んできたわけよ。
阿呆と罵った455に解決してもらったin8hHNnB萌え

ID:in8hHNnBは「俺はメモ帳使って手打ちで作ってるんだぞ！」と豪語してそうなタイプだな。

要は、可読性を捨てて複雑なレイアウトにする事で
「間違って」広告を押させようってタイプのサイトなのか？

そうだったらそもそもここで論ずるべきレベルではないような。

しかし、テキスト広告を出そうってクラいるんですか？
単にdisplay: inlineを使えなくて、中途半端なseo知識で<hn>を使いたい
だけなんじゃないかと…

>>ID:in8hHNnB
2003年新語・流行語大賞@Web制作板に「なるほどdiv囲みね。」をノミネートしました。

>>515
バナーよりテキストのほうが圧倒的に儲かる。

＞要は、可読性を捨てて複雑なレイアウトにする事で
内容が盛りだくさんなんだよ。おまえらのスカスカの日記サイトと
一緒くたにすんな。

＞「俺はメモ帳使って手打ちで作ってるんだぞ！」
当たり前だろ。手打ちがめずらしいのか。お粗末な奴だこと。

阿呆と罵った455に解決してもらった感想を一つ。

「俺はメモ帳使って手打ちで作ってるんだぞ！」と豪語してそうなタイプだな。
　　　　　　　　　　　　　　　　　　　　　　　　　　 　　~~~~~~~~~~~~~~~~~~~~~~~~~~

>なるほどdiv囲みね。
ﾜﾗﾀ

CSSに関する質問はこちらへどうぞ。　※　議論はよそで　※

CSSに関する質問はこちらへどうぞ。　※　嘲笑もよそで　※

CSSに関する質問はこちらへどうぞ。　※　なるほどdiv囲みね。もよそで　※

なるほどdiv囲みね。はこちらへどうぞ。　※　ID:in8hHNnBはよそで　※

阿呆も大変なんだな

CSSに関する質問はこちらへどうぞ。　※　豪語はよそで　※

>>525
なるほどdiv囲みね。

>>517のテンパリっぷりが…腹がよじれそうだw

>>455
media属性は関係ないよ。
この仕樣の所為では？
　word-breakがブロックレベル要素以外で効かない(5.x/6.0)
　http://cssbug.at.infoseek.co.jp/detail/winie/b128.html

>>ID:in8hHNnB
　　　☆ ﾁﾝ　　　　　ﾏﾁｸﾀﾋﾞﾚﾀ〜
　　　　　　　　　　　　　　　　　　　　　ﾏﾁｸﾀﾋﾞﾚﾀ〜
　 　☆　ﾁﾝ　　〃　∧＿∧　　　／￣￣￣￣￣￣￣￣￣￣￣￣￣
　 　　ヽ　＿＿_＼（＼・∀・）　＜　阿呆と罵った455に解決してもらった感想まだ〜？
　 　 　 　 ＼＿／⊂　⊂＿ )　　＼＿＿＿＿＿＿＿＿＿＿＿＿＿
　 　 　 ／￣￣￣￣￣￣.／|
　　　　|￣￣￣￣￣￣￣|　 |
　　　　|　　愛媛みかん　|／

ハイ次の方、質問どうぞ。

おまえらつぐつぐ馬鹿だな。ワロタよ。
おれは即、礼を言ったはずだぞ。
まったく次から次へと阿呆が沸いて出る。
平日の昼間ってのはいつもこんなのか。あさはかな。

CSSに関する質問はこちらへどうぞ。　※　豪語はよそで　※

>>529
そうなんですか。
validatorでscreen,tvメディアにはそんな指定はねえよ、みたいに言われたのでてっきり思い込んでいました。
てことは、つまりブロックレベルに対して指定してあげれば怒られないんですね。有難う御座いました。

>つぐつぐ馬鹿だな。
狙って言ってるとしてもかなり痛い。

CSSに関する質問はこちらへどうぞ。　※　つぐつぐはよそで　※

粘着は雑談スレへどうぞ＞535

2003年新語・流行語大賞@Web制作板の者ですが「つぐつぐ」もエントリーしていいですか？

次ぐ次ぐ、のダジャレのつもりなのかｗ

つぐつぐ馬鹿？

東北の人なんだよ

んだ

なんだ東北人だらけだなこのスレｗ

----------------------------------------------------

>>534
そんな指定ないよってのは、独自拡張だから警告してるんでないの？
word-breakプロパティーはCSS3草案で、WinIEが先行実装してるだけ。
どうもちゃんとわかってらっしゃらないみたいなので、不安。

漏れも東北人だ

フォント指定で、英語フォントと日本語フォントを重複して使用しても良いのでしょうか？
半角全角が混ざった文で指定どおりに表示されてますが、別に問題ないのでしょうか？

>>547
指定の仕方と環境によっては、文字化けするバグもあるとか。
　http://cssbug.at.infoseek.co.jp/detail/winie/b127.html
　http://cssbug.at.infoseek.co.jp/detail/winie/b033.html
それだけを気を付けておけば、別に問題ない。

>>547
Operaだとベースラインがずれますよ
MacIEだとtextareaが文字化けしますよ

>>549
↓詳しく報告してくれない？
　CSS/DHTMLバグ辞典スレッド 第３版
　http://pc2.2ch.net/test/read.cgi/hp/1050844510/658-

>>550
もう載ってますよ

だからもっと詳しくさ。MacIEとOSのヴァージョンとかあるでしょ。

>>461-
ﾜﾗﾀ

なんでこの板はいつもこうなんだ……

自称プロを思い込む人がどうしても多くなりがちだから

こまった人たちだな。

向上心を、わすれるな。

「実るほど、頭を垂れる稲穂かな。」
テンプレにでもいれとけ。

これからしばらくは「俺の好きなことわざ」について語ってもらいます

じゃあ質問を。

１　table-align : center;　が効かない<img>等をセンタリングするには？

２　スタイルシートが使える以上、<div>の存在価値がないのは気のせい？
　　ってか<p>と<div>に何か差異があるんでつか？

３　書籍に（常識なのかも知れんが）<br>をいくつも並べて、空行を確保することは
　　良く無い、とあったんだが。では、一般的なやり方は？

よろ。

>>560
あぁあぁぁ
１　は tableじゃなくて text でつ……失敬

>>560
1.text-alignはブロックレベル要素に指定し、その中のインライン要素に効きます。
2.気の所為です。意味に差違があります。
　pはparagraph、段落です。divはdivision、区切りです。
3.改行して新たな段落に移るならpです。

2と3はＣＳＳではなくＨＴＭＬの質問ですから、本来このスレッドに訊ねるべきことではありません。
どれも基礎の基礎なので、勉強して下さい。

なるほどdiv囲みね。

CSS Calidator使うと
Line : 0 can't find the warning message for otherprofile
と警告が出るのですが原因が分かりません。
何か分かる方がいらっしゃいましたら教えてくださいませ。

文字コード

Calidator っておいしいですか？

>>560
PocketIE2.0だと連続したbrは見た目1行にまとめられてたな。
あと、Lynxも設定によってはそうなる。

空行な見た目を作るときはCSSのmarginを使うのが普通だと思う。

空マージンですか？

#loe

>>568
下にマージンを多くとっているクラスを使うとか、
上にマージンを多くとっているクラスを使うとかだろ。

空マージンってなんだよ。
一応書いておくけど、中身のないpとかするのは止めといたほうがいいぞ。

なるほどdiv囲みね。

>>571
ちょとﾜﾛﾀ

　　　　●.......
　●.....　　　●.......... ﾜｰﾜｰ
　　　div；.....　 　●...............
　　　　　　　　●............
　　●.....　 ●..........
　　　　●......　　　　ﾜｲﾜｲ-

　　　　　

>>573
ﾜﾛﾀ
囲まれてるのがID:in8hHNnBか。

<div id="in8hHNnB">
<p>広告</p>
</div>

ここ数レスで笑えるか笑えないかがHTMLの基礎知識を知ってるか知らないかの分かれ目だな。

>>575
ﾊｹﾞﾜﾗ

おまえら、まだやってるのか。
よほど悔しかったんだな。

( ´д)ﾋｿ(´д`)ﾋｿ(д` )

ここはＣＳＳ質問スレッドで、ＨＴＭＬを初歩から教授する所ではありませぬ。

h2{font style="border-color:blue;
padding-left:1px; border-style: solid;
border-width:1px 1px 1px 30px;
width=100% size=5 color=blue: }

とか、外部ＣＳＳで
２つボーダー（っていうのか？）並べた時に、
その行間を詰める方法を教えてくれ！
line-heightじゃ詰められねんだ！
頼む！
つまり、重ねて並べたいんだよ！

初心者板でも書いたけど、駄目な様なので、
此処で頼みます。

>>581
全てにおいて最初から学習し直しましょう。
そうすれば「なるほどdiv囲みね。」と気付けるはずです。

>>582
無効でも言われたな。
答えだったのか。
ありがと。

やってみたけど、駄目だった。
6PX開くんだよな。２PX位が理想なのに。

>>581
スタイルシートの書き方がめちゃくちゃ。
>>4行って最初から勉強しなおせ。

ごめん。違う方法で出来た。
margin-topが足りなかったらしい。スマソ。

>>585
ＣＳＳの素材サイト、そのままの写しだよ。
漏れ作じゃない。

>>587
激しく晒せ！

>>588
ここは荒らしの溜まり場なのか？

>>589
なんで？

>>590
晒したら突撃しそうな勢いあるから。
ｶﾞｸｶﾞｸﾌﾞﾙﾌﾞﾙな感じだ。

>>591
別に掲示板荒らしたりはしないと思うけどなぁ…。
ただ、他にどんなものを素材として配布してるのか気になる。

=でも認識するのか

HTML素材とかやってる時点で
スミからスミまで見てしまうなぁ。
荒らしはしないよ。ﾆﾔﾆﾔしたいだけだ。

>>594
dialy
plofile

>>581みたいな誤りだらけのソースを公開するサイトは、罪です。
ちゃんと批判すべきですよ。

>581までひどいソースは初めて見た。

>>581
CSS初心者の俺から見ると
ヽ(`Д´)ﾉなんじゃぁこりゃぁ
('A`)わけわーらん
ひどいっていうか、わけわかんないです。

縦に並ぶプルダウンの横の長さをCSSで揃えたんですが
WIN/MACのNN4.xは共に無視されて凸凹になりました。
どうにかきちっと揃えることってできませんか？

>>599
質問する時にはソースを書きましょう。
あと、こんな事いうのもなんだけどNN4.xはどうにもならん事があります。

質問です。
<blockquote> </blockquote>
で囲んだ部分のフォントを等幅フォントにするには
どのように書けばいいですか？

>>601
>>1

>>602
一通り全部見たのですが、分かりませんでした。
よろしくお願いします。

>>603
フォントを指定してください。
style="font-family: ＭＳ ゴシック" など。

>>603
お前はリアル消防か。絶対に一通り読んでないだろ。
どうせ blockquote をレイアウト目的で使ってる低能だな。

>>604
お前もインラインスタイルなんかで教えるな。
それに例として monospace の指定を省くな。

ネスケでもIEでも見た目が変わらないようにCSSでデザインをしているのですが
メニュー
<ul>
<li>bbs</li>
<li>mail</li>
</ul>
上のようなソースで<li></li>のインデント(?)位置が大幅に違っていて困っています。
（ネスケだと大幅に右にずれてしまう）

何か良い対処法はないでしょうか？よろしくお願いします。

>>606
ソース出せ．ブラウザのバージョンも書け．

たぶんpaddingだと思うが

>>606
http://www.mozilla.gr.jp/standards/webtips/webtips0034.html

>>670
padding指定でOKでした感謝です。

>>608
ありがとうございます。参考にさせてもらいます

この板の人は親切ですね。

>>604
MSゴシックはインストールされてないんですけど。。。
monospaceとは何でしょうか？

親切なやつはごくひとにぎり。
残りはカスもカス。ひきこもり厨房ばかりだよ。

>>604
等幅文字

>>610
だから調べろよ馬鹿。一生人に訊いて過ごすのかお前は。
親切にリストアップしてやるから　>>4 のサイトを読んで勉強しろ。
ttp://www.zspc.com/stylesheets/css/ref/desc1.html
ttp://hp.vector.co.jp/authors/VA022006/css/fonts.html#font-family
ttp://www.ne.jp/asahi/minazuki/bakera/html/css/font#font-family
ttp://www.tg.rim.or.jp/~hexane/ach/lbcs/lbcs1-11.htm#s1-11-3
ttp://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/5.html#h531p1

>>610
総称フォント名で等幅フォントを表したもの。調べれば一発。
疑問に思ったらとことん調べる、調べないと俺みたいになるよ。

abo-n {
background : url(****) bottom no-repeat;
}
---------------
abo-n {
background-image:url(****)
background-position:bottom;
background-repeat:no-repeat;
}

中身は同じだと思いますが、どちらの書き方の方が適切なのでしょうか？

>>615
abo-n {
color : ***
background : *** url(****) bottom no-repeat;
}
---------------
abo-n {
color : *** ;
background-color : ***;
background-image:url(****)
background-position:bottom;
background-repeat:no-repeat;
}
これが適切な書き方です。

どっちも適切。

>>616-617
ありがとうございますた。
書き方に変わりは無いんですね。

外部CSSファイルでフォントカラーを指定しています。
JSで外部から情報を提供していただいて表示させているのですが、
背景色と同系統で隠れて読むことができません。
背景色は情報提供先で色指定しているようでCSSが効きません。
理想としてはのこの部分だけ外部CSSを無効にしたいのですが、可能でしょうか？
可能であれば、方法を教えてください。

強引に以下のようにしてみたのですがうまくいきませんでした。
<font style="color:#000000;">
<SCRIPT type="text/javascript" SRC="http://情報提供先アドレス.js"></SCRIPT>
<SCRIPT type="text/javascript">
・・・以下、登録アドレスとマッチしているかを確認するJS・・・
</SCRIPT>
</font>

よろしくお願いします。

>>619
>JSで外部から情報を提供していただいて表示させているのですが

意味がわからないので、説明して下さい。
JavaScriptの結果、何が表示されるのか、そのソース例を出して下さい。
CSS使ってるのに、font要素を使用するなんて、いけません。邪道です。

表示される情報は、リアルタイムで更新されるコラムや天気予報などです。
基本的にテキストで表示されています。

使用環境は、Win　XP/IE6.0、ネットスケープ7.1です。

＞基本的にテキストで表示されています。

だから、それはどんな要素としてマークアップされてるの？
ただのテキストなら文字色なんかつかないでしょ。
document.writeの中身を見せて。

あと、fontタグ使ってはいけないってのは理解できたのかな？

何とかCSSを使おうと勉強はしているのですが、まだまだよくわかっていません。
document.write(get_weather(0));
document.write("No match!");
です。

埋め込んでいるJS全文は下記のもののみです。

<SCRIPT type="text/javascript" SRC="http://情報的提供先アドレス.js"></SCRIPT>
<SCRIPT type="text/javascript">
<!--
var userID = '●●●';
if(check_id(userID) == 1) {
document.write(get_weather(0));
} else {
document.write("No match!");
}
// -->
</SCRIPT>

>>623
だからね、それではわからんのよ。
そのget_weather(0)とやらの結果、どんなHTMLが書き込まれるのか、
それを示して頂戴ね。
JavaScriptがわからないんだったらNN4でソース表示してごらん。

ついでに、これでも読んで。
　なんで FONT は駄目子ちゃんなのか
　http://www.ne.jp/asahi/minazuki/bakera/html/opinion/font.html

>>623
div#weather {
color:#000000;
background:transparent;
}

<div id="weather">
  <script type="text/javascript">
    ・・・・・
  </script>
</div>
とかにしてみたら？

>>623
もしくは、
div#weather * {
color:#000000;
background:●●●; ←任意で
}

<div id="weather">
  <script type="text/javascript">
    ・・・・・
  </script>
</div>

呼び出されるHTMLが見ることができるんですね。
やっと見ることができました。

<table width="240" border="0" BGCOLOR=CCCCCC>
<tr bgcolor=#CCFFFF>
<td><div align=center>都市</div></td>
<td><div align=center>12/5（金）</div></td>
<td><div align=center>12/6（土）</div></td>
</tr>
・・・・以下続く

やはり背景色は指定されており、背景と同化している文字は指定されていませんでした。

>>624、625
なるほど、今から試してみます。

>>627
tableなんだから<font></font>の中には入れられないやな。
それはわかりますね？
セレクタは div#weather td で、よかろ。

>>628、625、626
ありがとうございました。
望みどおりの結果になりました。

＞tableなんだから<font></font>の中には入れられないやな。

確かにその通りですね。
色々勉強になりました。ありがとうございました。

ふぉんとに？

　　　 _, ,_ 　ﾊﾟｰﾝ
　（　‘д‘）
　　　⊂彡☆))ω･´) 　←>>630

>>630-631
ナイスボケツッコミ

>>7のQ6(画面中央に〜)を一通り読んだのですが、
結局Javascriptを使わずにCSSだけでIE、Netscape、Operaで縦中央を実現できないんですかね。

HP全体を>>6にある擬似フレームで擬似フレーム化したいんですけど
どうもうまくいきません。
もっとCSSの書き方に関するページは無いでしょうか？
また、ここをこうすればおｋなんて簡単には出来ないのでしょうか？
よろしくお願いします。

>>633
無理だろうね。単位に対する各ブラウザの解釈は違うし。すべて計算してってのならできるかもしれない。
縦中央がそれほど重要なのか問い詰めたい。
>>634
どのように記述しているのかもわからなにの答えようがありません。

>>633-634
それと質問はageましょう。

>>633
Ｑ６のリンク先を最後まで読みなさい。工夫すればできますよ。
http://www.parkcity.ne.jp/~chaichan/qanda/qa3558.htm

すみません、
DW4でMac使いなのですが
トップの次の2ページ目をつくり、IEでプレビュー表示しても
レイアウト崩れはありませんでした。
しかしプレビューでトップから2ページ目にリンクすると
2ページ目に使われてるCSSが無効になっててレイアウト崩れが起きてしまうんですが
これはどういうことですか？

>>637
それだけじゃわからんよ
直接書いてるのか外部CSSを使ってるのか
どこか間違ってるんだろ

外部…でいいと思います。
直接書いてるわけじゃないので。
自分のやった方法が外部がどうか分からなくて調べに行ってしまったので
初心者版で質問するべきですか？

>>639
コードビューで外部CSSを読み込んでいるか確認してみ

>636
リンク切れ
とだけ突っ込むのも意味がないので
ttp://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm

>>641
おおリンク切れか。移転先はここ。
　スタイルシート 縦中央(垂直中央)
　http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm

次のスレッドでＦＡＱも直さないと。

CSSで画面の一番下にボックスを配置ってできますか

>>643
position:absolute; bottom:0;
>>4見て基礎から学習しよう。

>>644
ありがとう。勉強します。

>>643
初期コンテナブロック（html要素かbody要素）にheightを指定しませう。
　http://cssbug.at.infoseek.co.jp/detail/winie/b130.html
　http://cssbug.at.infoseek.co.jp/detail/mozilla/b021.html
　http://cssbug.at.infoseek.co.jp/detail/opera/b070.html

BODY,{background-image:url("back.jpg");background-repeat:no-repeat;
background-attachment: fixed;background-position: 100% 100%;}

ネスケ7で背景画像が表示できないんですが、どこかおかしいところあります？

BODY,{　→　BODY {

てゆうか、セレクタがコンマで終わる（最後が空要素）ってのが
CSSとして不正なのかどうかイマイチよくわからん。

不正。Appendix.D文法解析参照。

なるほど、DIV囲みですね。
勉強になりました。

>648
おぉそんなところが・・・
さんくす！

>>649
おお、マジサンクス。Appendixなんて普段注意して見ないからね。

ruleset
　: selector [ ',' S* selector ]*
　　'{' S* declaration [ ';' S* declaration ]* '}' S*
　;

declaration
　: property ':' S* expr prio?
　| /* empty */
　;

空の宣言は許されるから宣言ブロックの終わり } の直前が
セミコロンで終わってても問題ないが、
セレクタはコンマで終わったらいかんという解釈か。

おんや？しかし

selector
　: simple_selector [ combinator simple_selector ]*
　;
simple_selector
　: element_name? [ HASH | class | attrib | pseudo ]* S*
　;

ってことは、simple_selector で ? も * も 0 のときは
空のセレクタが許されるってことか？
そうすると結果的にコンマで終わってもいいってことになるし
また、わからんようになった・・・っと思ったら
CSS2.1で修正されるのね。失礼しました。

simple_selector
　: element_name [ HASH | class | attrib | pseudo ]*
　| [ HASH | class | attrib | pseudo ]+
　;

cssを調べたらdivクラスが11個もあったんですけどもう立派なdiv厨ですか？
まだセーフですか？

>>654
個数は関係ないかと。
たとえ100個あろうが適切なマークアップのためであれば問題ないですし。

div.left なんてのが1つあっただけでdiv厨ほぼ確定

div.rightとかある・・・＿|￣|○
そういうのと他のdivを組み合わせて使う以外に効率のいい方法がﾜｶﾗﾝ・・・

もっと頑張ろうね

XHTML側で

<div class="menu">
<a href="./info.html"><img src="./img/info.gif" width="32" height="32" alt="Info" />Info</a>
</div>

としていてCSSで

div.menu{
margin:0em;
letter-spacing:0.1em;
font-size:x-small;
font-weight:bold;
vertical-align:middle;
}

としているのに、文字が行の縦の真ん中に来ないのですが、何か指定がおかしいですか？

>>659
div.menu img {
~~~~

>>660
あー、imgに指定するものだったのですね。自分が見ていた解説サイトはブロックに指定してあったもので。
ありがとうございましたー。

間違った知識を授ける解説サイトは、名を挙げて批判した方がいいと思ふ。

真面な所は >>4 も含めて数箇所程度しかないぞ。
残りの 99.9% が「間違った知識を授ける解説サイト」。
一々名を挙げて批判してたら一生かけても終わらない。

それでも少しづつ正してゆくほかないのだ。

少なくともそこの誤りを鵜呑みにする犠牲者は減る。

じゃあ>>4からとほほをはずせよ

画像はすべて左寄せにしたいと思い

img{
clear: left;
float: left;
}

としたのだが、IEだと2個目の画像からズレてしまいました。

>>666
<br>

>>666
IEのバグに引っかかってる

>>667
いくらなんでも<br>はないだろ
せめて<hr>

質問です
レイヤーをウインドウの下や右にぴったりくっつけて表示するにはどうすればいいですか？
ウインドウサイズを変えても端に張り付いてるようにしたいんです


左と上の端基準の方法しかないんですか？

>>669
まづ>>4でpositionに就て學びたまへ。

>>665
杜甫々の間違った記述とはどれであるか？　指摘して頂戴。

　____　____　　____
　|　|　|　|　　|　|
　|　|＿|　|　　|　|
　|　　　　|　　|　|
　|　|￣|　|　　|　|
￣￣￣￣￣￣￣￣￣￣￣￣
　　　本文本文本文

こんな図のように、h1の文字が半分程下のエリアに隠れる というものを目指しています。
z-indexを使ったり色々試行錯誤してみたのですが、
IEできちんと見えるようになると、NS、Mozillaの表示が崩れ…
逆にNS、Mozillaが見えると、今度はIEが崩れ……
と、ループに陥ってしまいました。
自分ではこれ以上無理なようです。
何方かどこをどうすれば3つのブラウザで意図どおりに表示されるようになるのか助言お願いします。

ソースとCSSは以下のようにしています。　　

-- HTML --
<div id="img"><h1> H1H1 </h1></div>
<div id="con"> 本文 </div>

-- CSS --
h1 {margin: 0;
padding: 10px 0 0 15px;
font-size: 85px;
overflow: hidden;
width: 200px;
height:60px;}
#img {width: 200px;
height:60px;
background-image:url(... 縦60x横200の画像 );}
#con {background-color:#aaa;
width: 200px;}

と、なります。よろしくお願いします。

>>673
1) #con の margin-top にマイナスの値を指定する。
2) #con に position:relative を指定して top にマイナスの値を指定する。
3) #img と #con をまとめて<div>で囲んで position:relative を指定し
　　#con に position:absolute を指定して top で位置決め。

どれか好きなのを選んで。つーか <div id="#img"> なんか要らんでしょ。

h1 { background: url( 画像 ) no-repeat }

>>671
間違った記述云々よりもまず理念・思想が腐っている。

杜甫々は何時まで経ってもレガシーなブラウザを妙に固執し過ぎる。
MSIE3,4 などシェアは限りなくゼロに近く、Netscape 4.x のシェアも低い。
UNIX系でも Gecko系ブラウザや KDE Konqueror が存在するというのに。

杜甫々はスタイルシートが嫌いだから、解説も偏っている。
h1 がなく h2 から始まり、次に h4 という構造からして、
HTML の理念を何時まで経っても理解しようとしていない。
彼のレガシーな『バカの壁』は堅牢で、一向に崩れる気配はない。

>>674
2の方法でIE NS Mozilla全て同じように表示する事ができました。
有難うございました。助かりました。

よく見てみれば#imgも省略できましたね…そちらも有難うございますー。

>>676
見栄えのためのIDなのかい？

とか言ってみる

>>677
氏ね

styleseet を使ってリンクのtarget を指定することってできますか？

>>679
styleseetじゃ、できません。無論、stylesheetでもできません。

>>680
あ、ｽﾝﾏｿﾝ｡ありがとうございます。

>>679
IEのみでいいなら
a { behavior1: expression( this.target = '_self' ); }とかあるけど。

>>682
おお、ありがとうございます。

>>683
てか、んなもん使うくらいならa要素にtarget属性つけれ。

余談だけど、「HTMLドキュメントにtarget属性を記述しない」理由が「strict+valid」なら、今すぐ発想を転換しなさいよ。
そんな理由でCSSを使うのはstrictな思想とは言えないからね。

>>684
用途はユーザーにcookieを使ってターゲットを変えられるようにすることです。

すまん誰か助けてくれ・・・ついさっきメインマシンのHDDがふっとんで
ダウソしてあったJIS素案「高齢者・障害者等配慮設計指針− 情報通信
における機器・ソフトウェア・サービス −第三部：ウェブコンテンツ」の
公開レビューPDF版をなくしてしまった・・・
http://www.jsa.or.jp/domestic/instac/review2003/Web/itbf_web.html
ここへ落としにいったら、まだダウソできるっぽいので落としてみたら

　公　開　レ　ビ　ュ　ー　は　終　了　し　ま　し　た　。
　こ　の　文　書　は　削　除　さ　れ　ま　し　た　。

・・・モウダメポ。だれかうぷしてください。まぢでタスケテ！

>>686
http://216.239.57.104/search?hl=ja&q=cache:http://www.jsa.or.jp/domestic/instac/review2003/Web/soan.pdf

>>675
何だ、理念だの思想だのの問題かい。
個々の記述に誤謬が無いんなら、許すよ。理念を声高に語ってるサイトではないんだし。
理念なんざは、もっと別の所で学べばよい。とほほはレファレンスと割り切って使用すればよし。

>687
さんきぅ！たすかったYo！

思想ばっかごねて、屁の役にも立たないようなCSS解説サイトも多いからな・・・

>>690
屁の足しにもならない

とほほはなんというか、入門向けと言うか、初心者向けと言うか。
一通り参考にはなるけど込み入った解説や解釈が足りない、という気はする。

>>690
>>4 にもそういう所ありますか？

<marquee> <blink> <multicol> <spacer> <nobr> <wbr> <comment> は参考になるよ。
なにせ仕様書でも解説されてないし。

>>694
それ、本気で感心してるなら一から勉強しなおせ。

皮肉以外の何でもないだろうが

font-styleプロパティについて、
不適切な解説している奴が多くない？
ちなみに杜甫々の解説も間違っている。

<div id="1"><H1>タイトル</H1></div>
<div id="2"><p>内容</p></div>
<div id="3"><address>署名</address></div>

３つのブロック要素を、右から順に複数並べたいのですが、単純に#1,#2{float:right; 〜}などとした場合、
floatを指定した要素に横幅を指定しなければならない関係上、
ウインドウの横幅を動かしたときに一番下のブロックの幅もしくは右マージンが影響を受けますよね。
このとき、下二つのブロックの幅を固定して一番上のブロックの幅、もしくはマージンが動くようにしたい場合、
どのような記述をすればよろしいのでしょうか。

ブロック要素の順番をひっくり返すと、HTMLとして内容があべこべになってしまう場合の話です。

あ、申し訳ないです。質問なのでageさせてください。

エロエロ動画無料で落とせるよーん（*´д｀*）
http://www.h4.dion.ne.jp/~zingate/himitu.htm

>>698
数字のみのID属性値は文法違反だよ。
HTML4 では [a-zA-Z][:.a-zA-Z0-9_-]*
CSS のセレクタでも #1,#2 は不正だよ。

>>701
あ、すいません、例を分かりやすくするだけのために適当なidにしてしまいました。
１つめ、２つめ、３つめのブロックにCSSを設定するときの属性・・・ぐらいの解釈にしていただけると助かります

２つの幅を固定するなら残りは width:auto; margin:0 でいいんじゃないの？
浮動は幅を明示せにゃならんが、ここらへんがよくわからんのよね。

>>703
width及びmarginにautoの指定はしてみたのですが、反映されませんでした。。。

解説サイトを見ても、どのキーワードで
調べれば良いのかすら解らない初心者です。
大変申し訳ありませんが教えていただけますでしょうか?

<form>
<input type="button" style="background:url(画像アドレス);
color:navy;border:2px solid navy;width:30px;" value="ボタン">
</form>
このフォームを頂いてきました。
それで、これを横にいくつか並べて、リンクのボタンとして使いたいのですが、
リンク先を＜a href="****"＞（カッコは小文字で入れています）
色々なところに入れてみたのですが、飛んでくれません。
どこに入れれば有効なのでしょうか?

本当にバカみたいな質問なのでしょうが、どなたか教えてください。
お願いします。

>>705
JavaScript location.href onclick

>>705
スタイルは無関係。
HTMLの初心者向けの本・サイトを一から見直すことを勧める。

>>706
なるほど、JAVAを使用するんですね。
>>707
うるせーｳﾞｧｶ

JavaとJavaScriptは全くの別物。

自分の質問は一応CSS関係なんですが・・・誰か・・・

TABLEなんて邪道とかいわれそうで恐いですが、
TABLE内の画像を水平・垂直にセンタリングする場合は、
どういう方法が一般的なのでしょうか？
CSSは使用せず、HTMLでやった方がいいのでしょうか？

いや、JavaScriptで閲覧領域の位置とサイズを厳密に弾き出し
画像を絶対配置するのがいい。

俺はやらんけどな。

>>688
とほほのdiv要素に関する記述見て来い。
下手したらDVI厨を生産してるのはとほほだぜ？

DVIってなんだよ、吊ってくる

>>710
下とか上とか、どのブロックを指すのかわかりません。
id名で記述してもういっぺん>>698を質問し直してくれない？

>>711
邪道と言うよりも、「そんなもん使うなら、CSS使うな」と思ってるだけで。
ジャージにトレーナー姿で「僕に似合うネクタイありますか？」って言ってるようなもん。

>>698
IEでmarginとってきれいに３等分するのはバグがあるからむりだよ

>>706さん
遅くなりまして､申し訳ありません。
できました。ありがとうございます。
>>707さん
何年ぶりかでホームページを作成したら
すっかり色々忘れていました。はい、勉強しなおします。

708は私ではありません。

引用：
<div> 自身は特に何の意味も持たないタグです。
<div>〜</div> で囲まれた部分を右寄せしたり、スタイルシートを適用したりするのに用いられます。

これじゃDiv厨できるにきまってるじゃん。

>>711
表として使ってれば邪道じゃないよ

>>719
説明は間違ってないが、補足くらいはしておいてほしいものだな。

>>721
杜甫々はHTMLの理念なんぞ気にしないから常に手抜きなんですよ。
杜甫々は物理マークアップが大好きで、CSS が大嫌いなんですよ。
杜甫々は過去の負の遺産に縛られて抜けられない哀れな人なんですよ。

負け組み解説サイトの管理人も必死だな

W3CのCSS検証サービス（http://jigsaw.w3.org/css-validator/validator-text.html）
で、次のCSSを試してみました。
q{
quotes:"「" "」" "『" "』";
}
q:before{
content:open-quote;
}
q:after{
content:close-quote;
}

その結果、次のようなエラーが表示されました。

Line: 0 Context : q
Invalid number : quotesParse Error - :"「" "」" "『" "』"

これは CSS Validator が日本語に対応していないということなのでしょうか。
（引用符をシングルクォート「'」やダブルクォート「"」にしたら、エラーは出なかったので）

@charset "shift_jis";を書いてもダメですな。
でもファイルをどこかにあぷしてそれを解析させれば大丈夫なはず。

STYLEを定義するのに . （ドット）ではなく # を使っているところがあったんですが
. （ドット）と # に違いはあるのですか？

>>726
クラスセレクタとidセレクタ

詳しくは>>4のサイトどうぞ

＞727
ありがとうございます。

便乗で。
引用符を表示しない場合は
これでいいのかな？
クヲーテイション出ないんだけど。

q:before {content: no-open-quote; }
q:after {content: no-close-quote; }

>>729
q:before {content: ""; }
q:after {content: ""; }
もしくは
q { quotes: none; }

>>730
ありがと。

>>725
れす ありがとうございます。
（>>724で、）「ソースファイルをアップロードして検証」のほうも大丈夫だったので、
日本語の扱いに問題があるのは「テキストエリアに入力しての検証」だけのようですね。

というか、微妙にスレ違いの質問だったかも。失礼。

<input type="text" のサイズをスタイルシートから設定することは
できないのでしょうか？
input { size : 50px; }
などとやってもダメでした。

>>733
ネタならもうちょっとマシなやつにしてくれ

>>734
マジです。出来ないのなら、HTMLタグの属性をどこまで
CSSで設定可能なのか分りやすく解説してるドキュメントを
教えてください。

>>735
ＦＡＱのＱ８（>>7）を見よ。

まあ、それすら見ないで質問する奴に、理解できるか危ぶまれるが。

>>736
ありがとうございます。分り易そうなサイトがいくつかありました。
input { width : 300px; }
とすることでOKでした。ところで疑問なのですが、HTMLタグの属性名と
CSSのプロパティ―とはどうして名前が違っているのでしょうか？
後から作られたCSSはどうしてHTMLの規格に合わせなかったのでしょうか？

>>737
初心者は>>4の解説サイトで学んで下さい。
ＣＳＳとは何のため作られたのか、理解してから使って頂戴。

で、とほほを見ると・・・

仕様書の翻訳、分りやすくていいっすね。
これとあわせてとほほさんところの読めば最強？！

>>740
最凶

複数の<img>を横に並べたいとき、img { display:inline; }でできますが、
下揃えで並びます。これを上揃えで並ばせたいのですが、可能でしょうか？

＞複数の<img>を横に並べたいとき、img { display:inline; }でできますが、

インライン要素に何でdisplay:inline;を指定するか。要らぬことしなさんな。

>>4でvertical-alignについて學び給へ。

了解しました。確かにdisplay:inlineは勘違いでした。

画像を右寄せにしたいのですが、
text-align : right;
では、だめなのですか？
floatを使うべきですか？
ちなみに
<p>〜〜〜〜〜〜〜〜〜</p>
<ul>
<li><img src="バナー1.gif"></a>
<li><img src="バナー2.gif"></a>
</ul>
でバナー1、2を右寄せにしてみたいのです。

>>745
だめじゃないよ

ふと思ったんだけどＩＥがＣＳＳを結構なレベルまで実装した場合広告バナーをfixed指定とか大量に出ませんか？
そうしたら邪魔でしょうがない予感。

>>745　なんで駄目だなんて思ったんだかなあ。

「text」だからじゃない？テキストの蟻群を右にするのかと。

蟻群でｹﾞﾗｹﾞﾗﾜﾗﾀ (;´Д`) ﾓﾚもうすぐ発狂するかもわからんね

ｱﾗｼﾞﾝ

アリグンとかエーハレフとかいわない？

アリグンとアーフレッフって読んでる

蟻群にわしもﾜﾗﾀ

>>745
text-alignはボックスの中身の寄せ方の指定だから、インライン要素には効かない。
display:inline;
も追加して味噌

でいいんだよね？

幅100%、高さ1pxの水平線を入れたいとき、どうするのがもっとも的確でしょうか？

hr { height:1px; } で<hr>するとどうしても高さ1pxにならないので、

<div style="border-top:1px solid #000000;"></div>

としましたが、これでよろしいんでしょうか？

からのDIVなんて使うなよ
そんなことせずにおとなしくhrで上手に指定する方法使う(cssバグ辞典参照)か、または

<p>ほげほげ</p>
<p>ほげほげ</p>
<!--ここにボーダーを入れたい-->
<p>ほげほげ</p>
<p>ほげほげ</p>
↓
<div class="capt">
<p>ほげほげ</p>
<p>ほげほげ</p>
</div>
<p>ほげほげ</p>
<p>ほげほげ</p>

とでもして、cssで
.capt{border-bottom:1px solid #000000;}
としなさいよ

そうします。

>>753
>display:inline;
>も追加して

ネタ？　そんなの不要だろ。

普通にブロックにセンタリングかければいいんでないの？

ただの勘違いかと思われ

>>754
<hr style="border:1px solid #000; width:100%; height:1px;" />
そうしてしまったなら残念ですが

>>760
>>755-756

>>686-687 , >>689
で挙がってた
高齢者・障害者等配慮設計指針− 情報通信における機器・ソフトウェア・サービス −第三部：ウェブコンテンツ

のｸﾞｸﾞﾙキャッシュのコードを消してマークアップしなおしたんだけど、
需要ありますかね？

>>745
text-alignはulかliに指定しる。

<ul>
<li>12/30（火）</li>
<li>12/31（水）</li>
</ul>

マーカーに画像を使用したいんですが、
list-style-image
で指定しないで、
background-image
等を使ってを表示するのは好ましくないんですか？

加護ちゃんの写真集を買ってきて早速部屋でｵﾅｰﾆ・・・

・・・最中を妹に見られますた。
激烈に鬱。。このまま、引き篭もろうかなぁ…

>>764
表示の仕方が明らかに違うんだから、どのように画像を表示させたいのかで自分で考えろよそのくらい。

>>765
漏れの記憶だと、妹ﾌﾞﾗｳｻﾞでは兄のｵﾅｰﾆはﾊﾞｸﾞって見えなかったと思う…。
ちょっと曖昧な記憶なので、誰か知ってる人補完して。

ちなみに、姉ﾌﾞﾗｳｻﾞではﾊﾞｸﾞはなかったよ…＿|￣|○

>>760
いや、それだと確かに1pxのラインにはなるんですが、上下に余計なマージンが
出てしまいます。IEのバグみたいなんですが。
上下にまったくマージンを取らない1pxの水平線が欲しいです。

margin:0;は試しましたか。　>>768
http://cssbug.at.infoseek.co.jp/misc/hr.html

* { margin:0px; padding:0px; }
にしてます。それでもだめです。

せやから
>上下マージンで0を指定しても前後の要素との間に空間ができる。
と書いてあるやんけ。↓
http://cssbug.at.infoseek.co.jp/misc/hr.html

そうでした。すみません。
結局解決策はないのでしょうか。。。

>>772
　>>755がおすすめ。

>>772
マージンの値をマイナスにするのはいかんの？

<a href="長いURI（たとえばgoogle検索結果）">そのURI</a>

とした場合、<a></a>にはさまれた文字が
IE5.5では自動的に改行されるのですが、
Mozilla Firebird 0.7では、右にはみ出してしまいます。
ttp://win.nce.buttobi.net/up/img/029.png
こんな感じ。

<a></a>の上には<dl>や<div>があるけれど、
<dl>や<div>にmax-widthを指定しても、
<a></a>にはさまれた文字だけは改行されない。
ほかの文字は改行されているのだけれど・・・。
IEのように、自動で改行させることはできないのでしょうか。

>>775
a要素云々関係なく英字は改行されないのが普通だよ。

改行しちゃったら間違ったURLになるからね。

>>776
いや、そりゃないだろ。単語ごと改行の間違いじゃなく？

URIはスペースが入らないので改行されなくて当たり前です。

バグ辞典スレでこちらに案内されました。
多少内容重複しますが以下の件についての対処法をしりたいです。
CSSだけの問題ではなくhtmlにも関係することなんですが。
マックのIE5で
<td align="right"><a href="hoge.html">hoge</a></td>
とか、
<div align="right"><a href="hoge.html">hoge</a></div>または
<div style="text-align: right;"><a href="hoge.html">hoge</a></div>
などとしたときにtdやdivのエリアのなかでhogeのリンクテキストの位置はたしかに右寄せになるんだけど
align="right"等がついてないときに表示されたであろう場所あたり（何もないとこ）で
カーソルが指になって何もないところがリンクされてしまう、
というバグがあります。バグ辞典サイトにも出てないみたいです。
web creators誌2002/8/p42にも出てるんだけどtdの場合は手前に
もう一つtdを99%で作って回避できます。こんな感じで。
<td width="99%"></td>
<td width="1%" nowrap="nowrap"><a href="hoge.html">hoge</a></td>
だけどDIVの場合どうやって回避したら
いいんでしょうか？大げさにテーブル組むのもなんだかなぁという感じで。

結局テキストのリンクをいくつか横並びで右つめにしたいわけなんですが
どんな風に書いたらいいんだろう？
もちろんそのリンクが並ぶ段にはいろいろとcssで装飾をしたいです。
strictにこだわるつもりはないですが何もないとこをクリックしても
勝手にジャンプしちゃうのは具合が悪すぎる。
liをインラインで・・とか危なそうだ。結局テーブルが一番安全？

>775
Mozillaのバグ。bugzilla-jp(Bug 1476)でも10月辺りから放置気味、つかorgから反応が無い。

>>780

　　　　　　　　　　ブロック
　　　　　　　　┌───────┐
　　　　　　　　│リンクリンクリ│
　　　　　　　　│　リンクリンク│
←─マージン─→│　　リンクリン│
　　　　　　　　│リンクリンクリ│
　　　　　　　　│　リンクリンク│
　　　　　　　　└───────┘

ではだめかな？
多分ずれると思うが。等幅で見てくれ。

ゴールデンレター
このスレを見た人はコピペでもいいので
３０分以内に７つのスレへ貼り付けてください。
そうすれば１４日後好きな人から告白され、１７日後に
あなたに幸せが訪れるでしょう

>>780です。
>>782
メニューのブロック↓
┌──────────────────────────┐
│　　　　　　　　　　寄せる→│リンク│リンク│リンク│
└──────────────────────────┘
こんな風にしたいのですよ。
テキストリンクなのである程度の伸び縮みはあるだろうけど
いくつかのリンクを改行無しで横に並べて右寄せしたい。

>>780です。
>>782
　寄せる→(・　)(　・)
　　　　　　　　　↑
　　　　　　　　　上
　　　　　　　　　げ
　　　　　　　　　る
こんな風にしたいのですよ。

情報ありがとうございます。
IEの互換モードとやらが気になって、Firebirdをきのう使ってみたら・・・。
早くIEも標準レンダリングしてくれるようになってほしいものです。

>781　バグでしたか。
自分のやり方がまずいのかと思っていましたが、
少しだけ安心しました。

>>780
適当だけどこんなんじゃ駄目か。divｲﾗﾈli嫌って感じ?

<style type="text/css">
<!--
div.links { width:80%; padding:0.2em; border:solid black 1px; text-align:right;}
.links ul { margin:auto;}
.links li { display:inline; margin:0.5em;}
-->
</style>

<div class="links">
<ul>
<li><a href="link1">link1</a></li>
<li><a href="link2">link2</a></li>
<li><a href="link3">link3</a></li>
</ul>
</div>

質問です。
したらばBBSのカスタマイズをしているのですが、<head></head>の中身をカスタマイズできないので、<style>が書けません。
illigalなのは百も承知ですが、HEADタグ内でなくても正常に動きますでしょうか？
教えてください<m(_ _)m>

くだらない素人質問で申し訳ないんですが
IEでｱﾄﾞﾚｽﾊﾞｰにｱｲｺﾝを表示させようと思って

<LINK REL="SHORTCUT ICON" href="icon.ico">

をﾌﾚｰﾑに使ってみたんですが、どう頑張っても表示されません。
ｸﾞｸﾞってみてもｿｰｽが引っかかるばかりで…

>>788
>>4

>>789
検索の文字は"favicon"で。

>>788
HTML4.01ではHEADにしか包含できないな。
IE、MozillaはBODY内でも有効になるみたい。

>>790
探しましたが、HEADの中に入れるとしか書いてなくて、別の場所でも動くとかは書いてありません。

>>791
すみません。ありがとうございました。

"favicon"で検索したら、favicon.icoで置いておけば勝手にやってくれると書いてありました。

でも、ｱﾄﾞﾚｽﾊﾞｰにはﾃﾞﾌｫのeのｱｲｺﾝが…
ｷｬｯｼｭを全部消して、ｾｰﾌﾓｰﾄﾞで再起動もかけたりしましたが
やっぱり表示されません…
ｱｲｺﾝはﾋﾞｯﾄﾏｯﾌﾟの拡張子を変えたのではなく
ｱｲｺﾝ用のﾌﾘｰｿﾌﾄを使いました。

>>794
IEに読ませるならルートにおかなきゃだめだよ
お気に入りに入れなきゃ出ないのは知ってるかしら。
で、キャッシュ消した状態でお気に入りに登録して（既に登録してあったら上書きする）
IEを再起動すれば多分でる。

>>794
スレ違いだよ

>>795
ﾙｰﾄにも置きました、LINK REL="SHORTCUT ICON" href=で指定もしてみましたが
ﾈｯﾄに繋いでいなかったPCで繋いで、お気に入りに登録しても駄目でした…

>>796
すみません。
ﾈｯﾄで参考にしたCSS講座サイトに
<LINK REL="SHORTCUT ICON" href="">があったので、CSSの一つかと思いこんでました。

>>797
キャッシュがあると、そっちを読んだりするかも。だから履歴は一旦消してみて。
てか、普通はHTMLドキュメントにあれこれしなくても、faviconファイルが置いてあればそれで有効。

＞<LINK REL="SHORTCUT ICON" href="">
それはlink要素。link要素は文書と別のファイルとの関係を表す要素だよ。
ttp://www.rju666.com/web/reference/header.html#link

うわ、>>795と同じこと言ってる。
それが言いたかったんじゃなくて、お気に入り、を削除してから入れなおすといいんじゃないか、って言いたかったんだけど。
あと、faviconファイルが破損してる、ってことはないよね？

スレ違いだと解ってなおこのスレで話を進めるのはなぜ？

昔、文書のアイコンを設定する @icon url()なんてのがW3Cに提案されて
誰も相手にせず却下されたから。

>>797
ま、マルチポストでないことを断った上で、 HTMLスレに行ってください。
申し訳ないですが、邪魔です。

<a href="../index.html" style="display: block;text-align: right;">top</a>
トップへのリンクを右寄せにしたんですが、これは邪道ですか?

>>803
どういう文脈でa要素が出てきているのか知らないが、body要素直下に
置くのであればp要素などで囲むのが常套手段だろう。

どうもありがとうございます。
文脈に関係なくトップへのリンクをつけただけです。
p要素で囲って、align属性で右寄せにしておきます。
ありがとうございました

>align属性で右寄せにしておきます

ＣＳＳでtext-align:right;にして下さい。

>>803
インライン・スタイルシートは止しませう。

#top {text-align:right;}
<p id="top"><a href="../index.html">top</a></p>

>>805
.navi {text-align:right;}
<ul>
<li class="navi"><a href="../index.html">top</a></p></li>
</ul>

>>808
ｐの閉ぢタグが餘計でせう。書き損なひかな。

>>809
うん。改ざんｺﾋﾟﾍﾟやからね。

>>806さんのでやっておきます。
>>807-808さん、ずいません

<div>
<h1>見出し</h1>
<p>文</p>
</div>

このdivで囲んだ中を常に画面の中心に来るようにしたいのですが、
どうすればいいでしょうか。

>>812
*{
text-align : center;
}

>>812
div の左右のマージンを同じにすれば真ん中に来るので、自分はそうしてます。
こんな感じで。

div {
margin-left: 10%;
margin-right: 10%;
}

>>814
それはどっちかっつーと、インデントってやつだね。
センタリングよりもよいな。

ボックスの中心揃えよりも、ボックスの中身の中心揃えをきいてると思うのだが…。
分かってたらすまん。

旧仮名遣いキモイ

>>817
おまえの家に街宣車で突っ込まれるぞ。やめとけ

>>789
スレ違い

>>819
遅っ！

body:before{
content: "hoge";
}
のhoge内にタグを含める事って可能なんでしょうか。
実体参照なども試してみましたが、文字列として出力されてしまいます。

>>821
無理だと思う。
DOMならできるかも？

>>821
>hoge内にタグを含める事って可能なんでしょうか
そういう仕事は CSS ではなく DOM の担当です。

>実体参照なども試してみましたが、文字列として出力されてしまいます。
HTML の数値文字参照の同等の仕組みとして
\(U+005C)によるエスケープを利用できます。

CSSの役割を考えれば、「タグ」って発想はしないと思う。

レスありがとうございます。CSS単独では無理したか。
DOMって使ったことがないので調べてみますです。

>>825
それ以前に、
CSSは「見栄えを与えるもの」
タグは「意味をマーク付けするもの」だから、外部からくっつけるのはおかしいと思わないか？

質問です。以下のようなhtml+cssで上部にナビゲーションバーを作っていたのですが
何故かリンクにカーソルを合わせると最初の一回のみリンクと見出しが端のほうに寄るんです。
しかもIE6でこのような現象がおこるのですが、もじら1.4では起こりません。どうしてこのようなことになるのでしょうか？
-----
<div id="header">
<h1>タイトル</h1>
<ul>
<li>アイテム1</li>
<li><a href="./a2.html">アイテム2</a></li>
<li><a href="./a3.html">アイテム3</a></li>
</ul>
</div>
-----
body{padding:0 5%;}
h1{float:left;}
div#header{
border-bottom:1px solid #808088;
padding:0 0 0.5em 0.2em;
}
div#header ul{text-align:right;}
div#header li{display: inline;}
div#header a:hover{background:#cfc;}

idは同じ物を2回以上使うといけないんでしょうか？

追加なんですが、皆さんクラスとIDの使い分けはどのようにしてますか？

>823　自分も実体参照が使えなくてがっくりしていたけれど、
エスケープというのかな？
とりあえず、それが使えないか試してみます。

>828　スレ違いではないか？
同じ文書内で1回しか使わないならば、id属性を使う。
ナビゲーションは1回しか使わないから、
どこにidを割り当てるか決まっていなければ使わなくてよし。
それ以外は全部クラスにつけている。
たまにidとクラスの両方をつけることもあるけれど。

>828
ダメ。　ID属性は要素に固有の識別子を与えるもの。
だからIDセレクタとクラスセレクタも使い方は違う。
ぱっと見似てるけど混同しないようにね。

なんだか変な説明になってしまった。
とにかく、idは1回しか使えない。

一回しか出現しないものはIDを使わなければならない、ってわけでもなし
特に使い分ける意義がない人は全部classでもいいと思うんだけどね。

>>827
これと関係あるか？
　アンカーを:hover状態にすると%値指定のマージンやパディングの量が変化する(6.0)
　http://cssbug.at.infoseek.co.jp/detail/winie/b038.html

リストマークなどをCSSで独自の画像に置き換えると、どうしてもずれるんです。
大きすぎたり小さすぎたりと。目安はどの程度なんでしょうか。

>>830
>自分も実体参照が使えなくてがっくりしていたけれど、

HTML や CSS は国際符号化文字集合に含まれる文字の連なりである。
「厨」という文字は Unicode の符号位置では16進数で "53A8" だ。
SGML数値文字参照なら 厨、CSSエスケープなら \53A8 で表現できる。

例えば西欧の制作者がスタイルシートを ISO-8859-1 で符号化していても
p.boke:after { content: "(\53A8)"; } とすれば「厨」を生成できる。

なんだ 2ch は文字参照をサニタイズしないのか。
「厨」はSGML数値文字参照なら &#x53A8; で表現できる。

>>834
まさにそれでした。
paddingを%からpxにすることで解決しました。
どうもありがとうございました！

>>835
リストマークの微調整はいずれできるようになるみたい。

よく俺もそれで悩むけど、結局みんながつかってるIE6でちゃんと見えたらもう俺はいい。

>>838
pxよりemがおすすめ。

#menu ul li a{
width:100px;
border:1px solid #555555;
}

<div id="menu">
<ul>
<li><a href="aaa.html">aaa</a></li>
</ul>
</div>

Netscape7.1だと↑のwidthが無視されてしまうのですが、
うまく表示する方法はありますか？

liのwidthを100pxにする。
またはaをdisplay:blockにする。

>>842
即レスありがとうございます。
うまく表示されました。
ありがとうございました。

>>843
うまくいってよかったね。でもね……。
あのね、インライン要素にwidthを指定するのは反則なのよ。
だからdisplay:block;なのよ。
その辺、わかってるのかな。

そうそう。NetscapeがおかしいんじゃなくてIEがおかしいことを忘れずに。
あとこれやって気づいたんだが、

LI { background-color:#999; }

<ul>
<li><a href="#">AAAAAA</a></li>
<li><a href="#">AAAAAA</a></li>
<li><a href="#">AAAAAA</a></li>
・
・
・
<li><a href="#">AAAAAA</a></li>
</ul>

をNS7で表示させるとLI5個おきに変な隙間ができるのね。

>>645
　Bugzilla-jp
　http://bugzilla.mozilla.gr.jp/

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

>>844
補足等ありがとうございます。
インライン要素にwidthは反則というのは知りませんでした。
これから気をつけたいと思います。
>>845
Netscapeがおかしいのかと思っていました。
IEがおかしいんですね・・・。

>>847
下記参照。

・http://hp.vector.co.jp/authors/VA022006/css/visualren.html#width
>ブロックレベル要素と置換要素（img, input, textarea要素など）の内容領域の幅を
>指定するプロパティです。
>非置換インライン要素にはこのプロパティは適用されません。
>なぜなら，非置換インライン要素の内容幅は表示済み内容と同じ幅になるからです。

・http://www.mozilla.gr.jp/standards/webtips/webtips0030.html

netscape7とoperaだとウィンドウを小さくしたときに画像がボックスから
はみ出してしまうんですが、はみ出さないようにできませんか？

>>849
質問が説明不十分です。
どんなHTMLでどんなCSSを適用するとなるのか、
具体的な状況を書いてくれないと、回答できませぬ。

#f..GG%hO

>>849

div#imageBox {
　　height 　　　　: 120px;
　　width　　　　　: 80px;
　　overflow　　　: hidden;
}


<div id="imageBox">
<img src="hoge" height="120" width="80" alt="hoge">
</div>


こういうことでいいのかな

<style type="text/css">
<!--
body{background-color:#888888;}
div#main {
margin:10% 20%;
　　padding:5%;
background-color:#eeeeee;
}
-->
</style>

<div id="main">
<img src="image/cat.jpg" width="300" height="240">
</div>
説明不足ですいません。↑こんなのを書いたのですがnetscape7だと
http://www.geocities.jp/teaari/cat.jpg
↑こんな風になってしまいます。
IEだとウィンドウを小さくしても横スクロールバーが出てはみ出ないんですけど。

>http://www.geocities.jp/teaari/cat.jpg
>↑こんな風になってしまいます。

「このページは準備中です。」な風？

>>853
こんな風がどんな風かは知らないが、%指定した意味は理解できてるのかな。
min-width:240px;とでも指定しておくとか。

今後netscapeの新バージョンは、もう出ないから放っておくのが一番。
時間かけるなんて無駄無駄。

あ、min-widthを使えばよかったんですね。
ありがとうございました。

>>852じゃだめなのか？

その前に、%指定を止めてemにでもする方が……。　>>857

>836　どうもありがとうございます。
仕様についてはなかなか目にすることがないもので・・・。
ttp://east.portland.ne.jp/~sigekazu/css/ascii.htm
ここが役に立ちました。

>844も知りませんでした。ここにいると勉強になりますね。

外部スタイルシートを使って、日記サイトを作ろうと思っています。
トップページと過去ログのページ、どちらも同じように作ったはずなのですが、
なぜかトップページだけ表示が変なのです。

具体的に言うと日記のタイトルのところを「background:#cccccc;」と「padding:3px;」とで
背景が灰色になるようにしようとしました。
過去ログページはきちんとすべて背景が灰色に表示されるのですが、
トップページは灰色になる日とならない日があり（１ページに５日分載るように作ってます）
ならない日のタイトル部分をマウスで選択すると表示されるようになったり、
画面を１度スクロールして再び見てみると表示が消えたていたり、です。

表示されることもあるので、間違えてはいないのかなあと思うのですが
なんのはずみでそうなるのかがさっぱり分かりません。
どなたか、ご存じの方いらっしゃいませんでしょうか・・・？（XP、IE6です。）

ソース出さないと全然分からん

>>861
HTMLは大丈夫なのか？　チェックしてみな。↓
　http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
　http://jigsaw.w3.org/css-validator/

あと、質問はアゲて。

お世話になっております。
以下のdiv内のtableのフォントの大きさを変えたいのですが
どうスタイルシートのデータを変えてもフォントの大きさが変わりません。
方法をご存知な方はご助力をお願いします。

--「抜粋　　本当はccsファイルは別ファイル　改行も減らした」　--
<html><head><style TYPE="text/css">
div.msgHead {
background-color: #ccccff;
font-size: 46pt;
}
div.msgHead > table {
font-size: 46pt;
}</style></head><body>
<div class="msgHead">
<table><tr valign="baseline">
<th align="right"><strong>To</strong>: </th>
<td align="left"> <a href="mailto:auau">auau</a> </td>
</tr> </table>
</div></body></html>
「font-size: 46pt;」という所を弄ったけど変わらなかったです。

div.msgHead table td {font- size:46pt}

ありがとうございます。
本当に素早いRES助かりました。

ちょっとお尋ねしたいのですが、
左に画像、右に回り込んだようにテキストで
そのふたつがセンタリングされるような形にしたいのですが、
<p style="text-align:center;">
<img src="img/nlogo.gif" width="100" height="40" alt="ロゴ" style="float:left">
<span style="font-weight:bold; text-align:left;">ほげほげ<br>ほげほげ<br>sほげほげ</span>
</p>
としてみたらうまくいきませんでした。
何がダメなのでしょうか。正義のところのHTML CSSハンドブック読んでるのですが
なんともわかりません。

　　　　　　　　__,,-――-､
　　　　　 　 ／　　　　三ﾐ）、 　 　 　 　 　 ／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　　　　　　/　　　　 /｀｀｀ヽﾐ､　 　 　 　 ／　<p style="width:50%; margin:0 25%">
　　　　　　|　 （''彡ﾉ　　 ,,｀l　|　　 　 ／　<img src="img/nlogo.gif" width="100" height="40"
　　　　　　 |　　i,===__,ﾆ=､｀l^l　　／　alt="ロゴ" style="float:left"><span style="font-weight:bold">
　　　　　 　 ＼ | ´’,ハ､__ﾉｲﾉ　＜　　ほげほげ<br>ほげほげ<br>sほげほげ</span></p>
　　　　　　 　 ヽ｀￣､し へ ﾉ|　　　＼　CSSではこれが限界だ。
　　　　　　　　　 〉｀ ー'='　/|､＿　 　 ＼　<center><table align="center"> の代替は難しい。
　　　　　／｀ーヘ､　ー--´ l| ＼￣ニ-､ ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　　　　ノ､ノ＾⌒へ＼ー--‐'/,＿ ＼　　 ＼
　　　／⌒　　,◎､ 　＼　／ |　：￣　　　　＼
　 /::::　　　 ／|_.|ｲ-､ ､V ￣　　： ｜
　 >-―　__/､ﾆEl（,,ﾉ : |o　　i　：　o
　（　　 ／　〈　ﾆニﾉ　: |　　　｀｀'''―'⌒
　　＼|　　　＿ーノ　 : |
　　 ＼｀ー´／￣　　 :｜

ありがとうございます。
ＣＳＳにも限界があるんでつね。
何せhtmlを昨日から始めたもんで氏ねとか言われないか冷や冷やしてました。

<div style="text-align:center;">
<p style="text-align:left;">
<img style="float:left;width:100px">ほげほげ
</p>
</div>

div使えば、まぁ簡単

>>870ｻｿ
ありがとうございます。
試してみましたがやはり左寄せになってしまいました。
まぁおまいはそこまでして真ん中に寄せたいんかと言われると。
素直に
<table align="center">
<tr><td><img></td><td>ほげほげ</td><tr>とやるべきなのでしょうかね。

訂正

<div style="text-align:center;">
<p style="text-align:left;width:200px;">
<img style="float:left;width:100px">ほげほげ
</p>
</div>

幅を固定したくない！とか言われるとちょっとつらいな

<div style="text-align:center;">で中身のブロックレベル要素がセンタリングされるのは
一部のブラウザが後方互換性のためにそうしてるだけで
標準に準拠したブラウザが増えてくると使えないよ。

>>872ｻｿ
それがいちばんしっくりきますね。
それにしてみようと思います。
皆さんありがとうございます。

http://31.com/test/bs/gk/css_hatena.html
に例をあげたのですが、
上記例で、
「問題文」と「解答用紙」の間に、
<br style="page-break-after:always">
を入れてます。

で、自分のIE6ではきちんと改ページされてるのですが、
お客様のIE（「おそらくIE5以上」とのこと）では、改ページされていないようで、
困っています。

『<table>の中でstyle="page-break-after:always"を入れても改ページが効かない（IE６でも）』
ことは実証済みなのですが、
上記のタグは、<table>のそとにあります。

IE5以上（本来改ページがきくはず）で、なぜ本来効くはずの改ページが効かないのでしょう。
そして、IE5以上でも効くはずの改ページをちゃんと効かせるための改善作（多少トリッキーでもいいので）
はあるのでしょうか？

教えていただければ幸いです。

>>875
page-break-*　が効くのは以下のブロックレベル要素（とIE専用の謎オブジェクト）だけです。

BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, currentStyle,
DD, DIR, DIV, DL, DT, FIELDSET, FORM, hn, ISINDEX, LI, LISTING,
MARQUEE, MENU, OL, P, PLAINTEXT, PRE, runtimeStyle, style,
TABLE, TBODY, TFOOT, TH, THEAD, TR, UL, XMP

■〜〜〜
　　〜〜〜
　　〜〜〜
　　〜〜〜
　　〜〜〜

■＝画像
〜＝文章

上のように文章を右に寄せるにはどうしたらよいのですか？
floatでやってみたのですが、上手くいきません。
■〜〜〜
〜〜〜
〜〜〜
〜〜〜
みたいになってしまいます。

>877
それは発想を変えて
二段の段組をしないと無理なんじゃないかな。

やはりそうですか(´･ω･`)ｼｮﾎﾞｰﾝ
レスどうもです。

>>877
<div><img src="foo.png" alt="画像" width="100" height="100" style="float: left"></div>
<div style="margin-left:120px">
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
</div>

>>877
２段組にしたくないのでは、無理がありますが、
背景として設置するしかないんじゃないでしょうか？
縦横100pxとして
<div style="background:url("foo.png");padding-left:120px;">
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
</div>

以下のようにボックスに幅とパディングを指定したら、
Macのネスケではボックスの幅が250+100=350になってしまいました。
なにか間違ってるんでしょうか？
.test {width:250px; height:20px; padding-left:100px; text-align:left}

>>882
>>5

めちゃめちゃ正しいやん。感動した。

>>883
ども、とりあえず解決しました。

<div>
　　<div>
　　　　<div>
　　　　　　...
　　　　</div>
　　</div>
</div>

このように入れ子になっているとき、
入れ子の深さが偶数番目の要素と奇数番目の要素に
それぞれ別のスタイルを適用させるにはどうすればいいんでしょう?

ttp://www.adobe.co.jp/products/acrobat/
↑製品情報をクリックすると一覧になって表でてくるのってどうやるのでしょうか？
お願い致します・・・

>>886
>>4
>>887
さあ。どうすればいいんでしょうね。

JavaScript無効にしてるから>>887が何を言ってるのかわからんかった

>>888
単純に

div {...}
div > div {...}
div > div > div {...}

とやると入れ子が深くなるたびにセレクタも書かなければなりません。
別の方法はないでしょうか?

>>890
偶数用と奇数用のクラスをdivそれぞれに付けてみたら?

>>890
そういう複雑な文書構造が“なぜ”必要なのか疑問。
HTML は本来、フラットでリニアな構造言語のはず。
div で擬似的に構造化したところで自己満足に過ぎない。
文書構造を再考し、表現方法を改め直すことを奨める。

>887
javascript ドロップダウンメニュー とかそのあたりのキーワード

>890
javascriptでdivの入れ子の数を数えて（親要素をたどっていって）
動的にクラス名を設定 とか
同列の要素が偶数奇数なら構造の想像もつくけど
入れ子の偶数奇数ってどうなってるの？

>>892
実際に>>886に挙げたような文書があるわけではありません。
ただ、>>890や>>891以外の方法で簡潔に記述できないものかと
疑問に思ったのです。

id振るとか

<div id="1st">
　　<div id="2nd">
　　　　<div id="3rd">
　　　　　　.....
　　　　</div>
　　</div>
</div>

んで、
偶数のpだったら
div#1st,3rd p{...}

奇数のpだったら
div#2nd p{...}

id振る前にネタ振りですか？

よく振ってからお飲みください

>>895で「ちゃんと」スタイルが適用されるブラウザがあったら
俺は速攻で窓から捨てるけどな。

>>896
上手いこと言うねぇ。

>>895
素直にfirst、secondとやりゃよかったのに。

>886
ttp://with2ch.net/up/data/1071680644.lzh
やってやれないことはない ということで
とはいえ 役に立つとは思えない

一応突っ込んでおくけどidの最初の文字に数字は使えないよ。>>900はその事を言ってるのかな？

>>902
そう。さすが洞察力があるね。

ｄｌ要素に、ul要素のような左側の点を表示させる事は可能でしょうか？
教えてください…

無理だよ、listじゃないもん
beforeでつけるか画像で対応するとか

できますよ。
dt,dd{
margin-left:1em;
display:list-item;
list-style-type:disc;
}
左マージン入れる必要がありますが

>>905-906
どうもです。感謝。

見出しのｈタグの文字が標準だとでかすぎるので
ＣＳＳで文字サイズ調整しようとしたのですが
ＩＥではうまくいきますがネットスケープではまったく反映されません。
これはこういうものなんでしょうか？

>>908
どう記述したんだよ

>>909
こんなんです。

.h1 { font-size: 50% }
＿＿＿＿＿＿＿＿＿＿＿＿＿＿

<h1 class="h1">見出し</h1>

h1 { font-size: 50% }

>>911
あ、ソースが途中でおかしくなってただけでした・・・。
特定のｈ１にだけ適用させたかったのでclassを用いていました。
ありがとうです。お騒がせしました。

<h1 class="h1">
ってのもどうなんだろうな。
別におかしかないかね。

>>913
めちゃくちゃおかしい。

ってか、面白い。例えば<div class="div">とか<p class="p">とか。

でも、オレも悪いことと知りつつ
<ul class="list">とか
<dl class="list">ってやってるんだよな。。＿|￣|○|||

<h1 class="h2"> とかの方がいいんじゃないの？　意味わかんないし。

>>913
確かに面白いところをつくが。
それよりこっちも大変だ。

/*-------------------------------------------
見出しのｈタグの文字が標準だとでかすぎるので
ＣＳＳで文字サイズ調整しようとしたのですが

h1 { font-size: 50% }
-------------------------------------------*/

　ち　ょ　っ　と　ま　て　。

他の文字が25%とかなんじゃねーの？

<table>の中に<table>が以下の様に入れ子になってるんですが、
<table class="output">
<td><tr>
<table="input">
<td><tr>
</tr></td></table>
</tr></td></table>

この場合、外側のtableに適用したCSSは
内側のtableにも適用されてしまいます。
外側tableだけを適用する方法はありますか？

あ、4行目<table class="input">です。。

別々に適用できると思いますが？
どのようなCSSソースを書いたのか書いて下さい。
恐らく、クラス設定がおかしいのではないのかと。

>>921
input {filter: Alpha(Opacity=35);}
.output {filter: Alpha(Opacity=85);}
の様な感じで書いたのですが、
背景だけ半透明でいいのに、
文字や画像まで半透明になってしまうんです。

>>922
それは MSIE の仕様。前にも書かれたがフィルタは重いから止めてくれ。
背景を透過させたいならアルファチャンネルのPNG画像を用いるのがよい。
http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/PNG_descript.html
厨房に大好評な WinIE は“未だに”「1bit透過」のみのヘボ実装だが。

>>923
PNGはMacで表示出来ない場合が多い。

>>923
重いとか言い出したらフィルタの存在意義無いだろ。

>>924
IE5以降はMacでも表示可能のはず。ネスケは知らんが。

IEの仕様で無理でしょう。
filter:Alpha;をどうしても使いたいなら、背景を<div class="bg">などで置いて、
tableをposition:absolute;でそのdivの上に重ねるとかすれば、解決するのでは？

>>926
そうですか、、やっぱりレイヤーしか無いですか。
分かりました。有り難うございます

これで不思議マークアップがひとつ増える可能性が大と。
どうしてスキルがない人ほど半透明とかのフィルタを好むのかね。
半透明を実現する以前に、もっとやるべきことがあるだろうに。
知らずに閲覧者に余計な負担を強いて喜んでいるうちが幸せかね。

教えていた自分もそう思う。デザインに中身が追いついていないサイトを運営中。

何で誰も
<td><tr></tr></td>
に突っ込みませんか？

突っ込む必要も無い厨房だから

>>928
いや、半透明にしてくれってクライアントから指示が・・。
ここのサイト壁紙をしょっちゅう変えよるから、そのたびに
半透明の画像作るのもしんどいし。
それを話したら「CSS使えばええたい、CSS」って言われたの。

流れから考えると、テーブルデザインですか……。
好きじゃないな。

俺は値段の貼る画像編集ソフト持ってない貧乏人なんで
IEのfilterをかけるHTMLテンプレを１つ用意しておいて
必要なときだけPrintScreenでキャプチャした画像を使ってるけどな。

パターンがだいたい決まってるし、そんな大した作業でもないし。

>>932
それじゃクライアントに半透明にする必然性を訊いてみろ。
多分「体裁が良いから」っていう理由だろう。馬鹿げてる。
だまくらかしてユニバーサルデザインをごり押しするのだ。

>>933
クライアント（これもWebデザイン系の会社）が
テーブルの方が更新しやすいらしいｗ

>>935
多分そう・・。

というか、<td><tr></tr></td>
というカオスマークアップはtypoなんですか。

>>930が言いたいのは、テーブルレイアウトっていう問題では無い気がするんだが。

麻薬みたいなもんだな<td><tr></tr></td>

クライアントの要望を自力で解決できず、
こんなところに質問ですか。
なんだかなぁ。

>936　テーブルタグのことしか知らないからでしょ。
だから、テーブルの中を操作することしかできない。
つまり、テーブルの方が作業しやすい。
そんなWebデザイン会社なんてイラネ。

<td<tr></tr><>/td>

ID:kl2aUJRiレベルに仕事頼むほうもアレだが、
ID:kl2aUJRiレベルにテーブルの方が更新しやすいらしいｗ
とか馬鹿にされるのもかわいそうだな。

CSSで作成したサイトをアップしようとすると
1行目にparse errorが発生してしまいます。

1行目は
<?xml version="1.0" encoding="Shift_JIS"?>
ですが、どこが間違ってるんでしょうか・・？

CSSでブロックレベル要素を3つfloatで並べ、block2をセンタリング、
1と3は両端に置きたいと思っています。
[block1]　　　　　　　　　　[block2]（←センタリング）　　　　　[block3]
このとき、block2をmargin:autoにした後、block3をfloat:rightで置くと
block3がしたにずり下がってしまうのです。おそらく、block3が無い状態で
block2がmarginを計算してしまうからじゃないかなと思うのですが、それを解決するために
htmlでblock1→block3→block2で置くと期待通りの表示になりますが、当然CSS無効
だと順番がおかしくなり、好ましい方法でないと思います。この場合どうするのがベスト
ですか？それとも、根本的に間違ってるでしょうか？
-----
<div style="border:1px solid black;">
　　<div style="width:10em;float:left;width:10em;border:1px solid yellow;">
　　　　<p>blocklevel1</p>
　　</div>
　　<div style="width:10em;margin-left:auto;margin-right:auto;border:1px solid blue;">
　　　　<p>blocklevel2</p>
　　</div>
　　<div style="width:10em;float:right;border:1px solid red;">
　　　　<p>blocklevel3</p>
　　</div>
</div>

>htmlでblock1→block3→block2で置くと期待通りの表示になりますが

floato:right;って、さういふもんです。
元は「回り込み」なんだから當然でせう。

>>945
> floato:right;って、さういふもんです。
floatoってだふいふもんですか？

>>943
どこの鯖？
>>944
block1,3をposition配置

>>946　だふいふ→どういふ　（かなづかひは正しくネ）

>>948
どうでもいいよ。質問に答えろよ。

かなづかひUzeeeeeeeee
コメントにもかなづかひしてるんですか？

>943
プロバイダを明記しろよ　それにShift_JISは止めた方が良いUTF-8だ

floato:right; で　block1→block3→block2で置くと期待通りの表示になるかといえば、
これもケースｂｙケースだ。

block1のheightがとんでもなく長く
block3が短い場合は、block3の下にblock2が来るよ

<!--そろそろ次スレッドを用意しませう-->

毎度質問があるので（>>367-386）、ＦＡＱに、dt・dd横竝びの方法を入れませんか？
　<dl> の整形
　http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

>>952
> これもケースｂｙケースだ。
ケースによっては、floatoは有効なんですか？

31 ：Name_Not_Found ：03/11/20 03:34 ID:???
>>1さんへ
いまさらだが、>>2の過去スレッド一覧から
前々スレッド（【23】）が抜けてますな。
これね。↓
　http://pc2.2ch.net/test/read.cgi/hp/1064502391/l50

>>952
block2を左右マージン指定した上で幅自動、
block2の中にセンタリングするプロックblock4を置くというのは可能だろうか?

<div>で囲った部分を、表示画面の丁度ど真ん中に
表示させるようにしたいのですが…
text-align:center;だと左右だけ中心揃えになってしまいますよね。

どうにか上下左右すべての中心に持っていく方法はありませんか。

>>951
>それにShift_JISは止めた方が良いUTF-8だ

　　　　 　,一-、
　　　　 /￣　l |　　　／￣￣￣￣￣￣￣￣￣￣
　　　　■■-っ　＜　んなこたぁない
　　　　´∀｀/ 　　　＼＿＿＿＿＿＿＿＿＿＿
　　 ＿_／|Ｙ/＼
　Ё|＿_　| /　　|
　 　　　| У　

>>957はＦＡＱも見ないで質問する慌てん坊です。

>>7に移転によるリンク切れあり。次スレッドでは直して頂戴。

　スタイルシート 縦中央(垂直中央)
　http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm

レス遅れて申し訳無い。
>>943ですが、xmlの書き出しの<?　で
何故かPHPスクリプトが働いてしまってるみたいなんですよ。。
PHPの書き出しも<?なんで・・

対処策無いんですかね。。

>>953と>>955と>>960とを見て、誰かそろそろ次スレッド立てて。

>>961は、ＣＳＳに関する質問でないから、よそで訊ねたら？

>>953
痛いサイトだな。

>>957
画面の水平位置のセンタリングは少し工夫が必要。
まぁ検索しれ。

あと、text-align:centerで左右が中心揃えになるのはIEのバグね。
本来ブロック要素をCSSでセンタリングするには
margin-right : auto;
margin-left : auto;
とする。

>961
cssと全然関係ないから本当はProg板のPHPスレあたりなんだろうけど
誘導するほどのことじゃない（Prog板に持っていったら怒られそうな）ので

・自分で設定が変えられるなら short_open_tag = を off にする
・ファイルの拡張子を変えて php として parse させないようにする
・php の echo 文で <?... を書き出す

phpのことがわからなかったら検索してください
おそらく「php xml 宣言」あたりでたくさん見つかるかと

MacではChicago、WinではVerdanaのboldを指定することは可能でしょうか？

>966
body {font-family: "Chicago","Verdana",sans-serif;}
こんなものでどうでしょう。

body {font-family: "Chicago","Verdana Bold",sans-serif;}
ボールドだった・・・。

MacIE5 では lang="en" とか指定しないと欧文フォントは採用されないよ。

>>967-969
どうも、万事解決しました。

<div style="margin-left:100px;"><textarea style="width:100%;"></textarea></div>

これをIEで表示させると、はじめはテキストボックスがきちんとウィンドウ右端までになっているのですが、
テキストボックスに何か書き込むとたんに横に伸びてしまいます。
解決策はありますでしょうか？？

そうは　い神崎

>>971
バグスレのまとめサイトに載ってるIEのバグ

text-decoration:line-through;
で表示される横の打ち消し線の、縦幅を指定することは出来ますか。

IEの英数字はserif;がデフォなんですか

>>974
残念ながら、できません。
したいのであれば、画像を重ねる等するしかないと思います。
>>975
確かそうです。

hnにはwhite-space:normal;は使えないんでしょうか。
ブラウザを横に縮めていくと横スクロールバーが出てしまいます…

>>977

ポイント
・white-spaceプロパティは空白類文字（「半角スペース」・タブ・改行）の
処理を定めるもの。また、すべての要素に適用できる。
・英語（など）は単語を空白（スペース）で区切る。
・英語（など）で改行は単語ごとに行われる。CSSでいうと、
この状態がすなわち、初期値である「white-space:normal;」。
・スペースで区切っていない英語（など）の文字列は1単語とみなされる。
つまり、
<h1>heading1heading1heading1heading1heading1heading1heading1</h1>
のようになっていると、1単語とみなされて、ボックスからはみ出ても改行されない。

誰か次スレッド立ててくれない？　>>953と>>955と>>960とを見て。

>英語（など）で改行は単語ごとに行われる。
ここは、
行末まで（ボックスの端まで）いったら、単語の切れ目で
折り返される。ということで（単語の途中では改行されない）。

次スレ立ててるんですが、
http://pc2.2ch.net/test/read.cgi/hp/1072018825/l50
連投規制はいったりで焦り気味でした。

ありがと。　>>981

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

>>978 >>980
ありがとうございます。
何とかがんばれそうです。

a:link{
text-decoration:none;
border:dotted 1px blue;
color:navy;
}
.tabnavi a:link{
text-decoration:none;
color:navy;
}

として、文中のﾘﾝｸには青い下線を、タブ型ナビゲーションのﾘﾝｸには下線なし、にしようとしているのですが、下線が出てきてしまいます。
タブナビの方の文字色を赤にしてみても反映されません。
aに複数のクラスを指定して、複数のﾘﾝｸｽﾀｲﾙを使用したい場合、どう書くべきなのでしょうか？
IE6での確認です。

>>985
とりあえず、border 指定で作った下線は、border 指定でなしにしようね。
border:none; とか。
複数クラスは、class="classA classB" みたいな感じで。

てか、もう新スレだったね。
http://pc2.2ch.net/test/read.cgi/hp/1072018825/l50

>>986
タブナビのほうに border:none; を入れても出てきてしまいます…。
文字色の変更すら反映されないんですよ…。