CSS {スタイルシート質問スレッド:50%;}

このエントリーをはてなブックマークに追加
1Name_Not_Found
CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※

■■■■■ 質問のしかた ■■■■■

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

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

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

【まとめサイト】 http://web2ch.s31.xrea.com/?CSS
【FAQ】 http://web2ch.s31.xrea.com/?CSSFAQ
【過去ログ】 http://web2ch.s31.xrea.com/?CSSLog
【関連リンク】 http://web2ch.s31.xrea.com/?CSSRelated
【前スレッド】 http://pc8.2ch.net/test/read.cgi/hp/1132042666/

関聯リンクは>>2-15 あたり
【関連スレ】【仕様書】【CSS検証】>>2
【解説など】>>3-4
【FAQ】>>5-9
2Name_Not_Found:2005/12/08(木) 22:22:11 ID:???
【関聯スレッド】
CSS/DHTMLバグ辞典スレッド 第4版
 http://pc8.2ch.net/test/read.cgi/hp/1078463560/l50
代替スタイルシートに萌え〜
 http://pc8.2ch.net/test/read.cgi/hp/991400015/l50
独自拡張、草案段階のCSSについて語れ
 http://pc8.2ch.net/test/read.cgi/hp/1019912046/l50
* CSS[適用="2ch"]{ イケてるスタイルを:"作れ"}
 http://pc8.2ch.net/test/read.cgi/hp/1038678267/l50
CSSでイケてるデザインサイト 26
http://pc8.2ch.net/test/read.cgi/hp/1120837682/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.it.okayama-u.ac.jp/man/rec-css1/rec-css1.html
CSS2の仕様書の邦訳(日本規格協会訳/個人訳)
 http://www.y-adagio.com/public/standards/tr_css2/toc.html
 http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html

【CSS検証】
W3C CSS 検証サービス
 http://jigsaw.w3.org/css-validator/
3Name_Not_Found:2005/12/08(木) 22:23:06 ID:???
【解説など】
・ごく簡単なHTMLの説明
 http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
 http://www.zspc.com/stylesheets/
・ZSPC - CSS2対応状況ガイド
 http://www.zspc.com/documents/css2/
・CSS1テストスイート
 http://www.doraneko.org/css1test/
・ばけらの CSS リファレンス
 http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・K@tsukun's PAGE! > CSS Reference
 http://hp.vector.co.jp/authors/VA022006/css/index.html
・K@tsukun's PAGE! > 付録:CSS対応状況表
 http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS Laboratory対応表・一覧
 http://is.vis.ne.jp/charts/index.xhtml
・ブラウザのHTML4/CSS対応度テスト
 http://homepage1.nifty.com/emk/moz/browsertest.html
・CSSバグリスト@CSSバグ辞典スレッド
 http://cssbug.at.infoseek.co.jp/index.html
4Name_Not_Found:2005/12/08(木) 22:23:36 ID:???
【解説など】
・Web標準化Tips(特に「HTML/CSSのよくある誤解・ミス」)
 http://www.mozilla.gr.jp/standards/webtips/index.html
・ブラウザによる振り分け(JavaScriptを使用しない方法)
 http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
・Web Site 作成支援 - What is CSS?
 http://www.nextindex.net/web/CSS/index.html
・Academic HTML::CSS2
 http://www.tg.rim.or.jp/~hexane/ach/
・『スタイルシートWebデザイン』ボランティアHTML化版。
 http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
・スタイルシート用語集
 http://www.mitsue.co.jp/case/design/c_index.html
・IE で min-width を指定する方
 http://www.lucky-bag.com/archives/2005/05/ie_minwidth.html
・CSSでイケてるデザインサイトリンク集
 http://ike.s33.xrea.com/
・( ´∀`)< CSS でイケてるデザインサイトリンク集2
 http://www.geocities.jp/cas_ike2/
・* CSS { イケてるスタイルを:"作れ";} 発表所
 http://web.archive.org/web/20030415121122/http://strict.jp/~sappari/2ch/css.php
5Name_Not_Found:2005/12/08(木) 22:23:57 ID:???
ちゃんとスレのURL変えろよ、コピペしか出来ないのか無能
スレタイだけは何故か変えて自己主張してんじゃねえ屑
6Name_Not_Found:2005/12/08(木) 22:23:59 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
7Name_Not_Found:2005/12/08(木) 22:25:28 ID:???
【FAQ】
Q3: CSSで段組するには?
A3: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
 http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
 http://web.archive.org/web/20031005195659/http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラムデザインの実現
 ttp://web.archive.org/web/20040603063133/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でも崩れない段組みの実例)
 ttp://web.archive.org/web/20041001014138/http://homepage3.nifty.com/fores/
リストを用いたレイアウト
 http://css.maxdesign.com.au/index.htm
8Name_Not_Found:2005/12/08(木) 22:46:54 ID:???
高さがautoになっているブロック要素の中で最後の要素をフロートさせていると
その分の高さが確保されず、親要素のbottomをはみ出してしまいますよね。
どんな対策をしていますか?
brはあまり使いたくないです。
9Name_Not_Found:2005/12/08(木) 22:54:03 ID:???
floatは通常流し込みから排斥されるので当然です。
clearをうまく使いましょう。
10Name_Not_Found:2005/12/08(木) 22:59:27 ID:???
>>8
clear:both;
11Name_Not_Found:2005/12/08(木) 23:07:28 ID:???
<div id="a">■■■■…</div>
<div id="b">回回回回…</div>
<div id="c">サルサやる…</div>
とあって
■■■■サルサや回回回回
■■■■るのはハ回回回回
■■■■ワイへ保.回回回回
■■■■留サルサ回回回回
やるのはハワイへ保留サル
サやるのはハワイへ保留

とやりたいのですがどうすればいいのかわかりません。
floatを使ってもダメでした。
ご指導願います。
12Name_Not_Found:2005/12/08(木) 23:23:50 ID:???
>>1
乙!って思ったら今度は 50%か〜い!?
つまらん。
13Name_Not_Found:2005/12/08(木) 23:44:42 ID:???
>>11
幅は勝手に30%にしたけどそのHTMLで。
あ、でも内容が■連続だと半角英数の並びと同じになるから適切な文章入れてね。

#a{width:30%;float:left;}
#b{width:30%;float:right;}
14長くなりそうです:2005/12/09(金) 01:48:07 ID:???
質問させてください。
環境はMac OSX10.3.9とWinXPSP2
確認ブラウザはMacのSafari1.3.1/NN7.1/Opera8.0.1/FF1.0.4と
MacIE5.2でWinではIE,Opera,NN,FF等最新版。

W3Cのサイトのような三段組(但し左右は固定で)にしたいのですが
MacIEだけがうまくいきません。真ん中の段だけボコッと下がって
しまいます。以下ソース抜粋します。
<div id="container">
<div id="contents">
<h2>ページ目次</h2>
<ul>
<li>ああ</li>
<li>いい</li>…</ul></div> /* ここまで左側 */

<div id="hogehoge" class="section">
<h2>ほげほげ</h2>
<p>あいうえお</p></div></div> /* 真ん中と#container終了*/

<div id="navcontainer"> /* 残り右側 */
<h2>サイトメニュー</h2>
<ul>
<li>うう</ul>
<li>ええ</li>…</ul></div>

div#container{
clear : left; /* このclearはネガティブマージンの時のみ */
float : left;
width : 100%;
margin-right : -215px;
}
div#contents{  
clear : left;
float : left;
width :155px;
margin-right : -155px
}
div.section{
margin : 20px 215px 0px 155px; /* 実際は簡略表記せず */
padding : 0px 0.8em
}
div#navcontainer{
clear : right;
float : right;
width : 215px;
}
とりあえず関係ありそうなソースを書きました。その他は
今のところ特に指定してません。ちなみにネガティブマージン
を用いないfloatやposition:absoluteでもMacIEだけがうまく表示
できませんでした。よろしければMacIEでも可能な三段組を
教えて頂きたいです。見にくかったら申し訳ないです。
二段組みではMacIEも問題ありませんでした。
16Name_Not_Found:2005/12/09(金) 01:54:27 ID:???
>>14
先生!
<li>うう</ul>
は誤字なんでしょーか、そういうソースなんでしょーか!
1714:2005/12/09(金) 01:56:58 ID:???
>>16
わっすいません。間違いです。コピペじゃないです。
18Name_Not_Found:2005/12/09(金) 02:02:00 ID:???
>>18
スマンMac持ってないもんでイマイチ現象が理解できないんだが・・・
真ん中のマージンとは別に落ちるの?
19Name_Not_Found:2005/12/09(金) 02:14:25 ID:pFxPIMVp
>>18はい。…多分…。
●●●  ↓◎◎◎
●●●  ↓◎◎◎
  ☆☆☆◎◎◎
本当は上一列まっすぐなるはず(?)なんですが左側の横に
どうしても並ぶのが嫌!という感じです。右側は特に変化なしです。
20Name_Not_Found:2005/12/09(金) 02:16:56 ID:???
>>19
ん?
div.section{
margin : 20px 215px 0px 155px; /* 実際は簡略表記せず */
↑このマージントップのせいでFirefoxでも上一列まっすぐにはならないんだが、
そういうのとは違って一番下に来ると言うこと?
21Name_Not_Found:2005/12/09(金) 02:17:30 ID:???
そしてスマン、限界なので寝る・・・orz
2214:2005/12/09(金) 02:30:03 ID:???
重ね重ね本当に…orz。
margin-top:20pxは左右共に設定してます。
他のブラウザでは問題ないです。
もうしばらく考えてみます。

夜分遅くにすいませんでした。
23Name_Not_Found:2005/12/09(金) 09:25:13 ID:???
はぁあ・・・スレタイpx結構お気に入りだったんだがな
24Name_Not_Found:2005/12/09(金) 12:19:58 ID:???
>>22
それ、まずは3段じゃなくて左2つを囲ってるcontainerだけでもsectionが下がるの?
一番小さなところから切り分けていこうよ。
25Name_Not_Found:2005/12/09(金) 12:26:52 ID:???
>>14
その組だと、ページもくじにバックグラウンド設定できないよ。
いいの?
26Name_Not_Found:2005/12/09(金) 12:28:54 ID:???
>>25
そんなのはする気になりゃすぐ追加できるし
目次だけ背景付けるなんてダサいことしたくないのかもしれないし
瑣末事じゃん・・・
2725:2005/12/09(金) 12:29:04 ID:???
さがってるねー
2825:2005/12/09(金) 13:07:11 ID:???
>>14
ページ目次が増えるとsectionもつられて下がってるよー
2925:2005/12/09(金) 14:14:54 ID:???
>>26
言い忘れてたけど、お前に言ってないよ
30質問:2005/12/09(金) 14:22:12 ID:dJAXwr1/
WindowsXP Professional Edition SP2 + IE6.0SP2 で確認しました。
文字コードがUTF-8でエンコードしたHTMLファイルをブラウザで表示した場合、
TEXTAREA の入力域と INPUT type=TEXT の入力域とでフォントが違います。
インラインでスタイル指定して、style="font-family:sans-serif"とすれば、
TEXTAREA の入力域と INPUT の入力域のフォントは同じになります。
(※Shift_JISでエンコードしたHTMLではフォントが違います。)
これはどうしてなのでしょうか。
31Name_Not_Found:2005/12/09(金) 14:25:25 ID:???
>>30
UTF-8 は日本語じゃない、と IE が勝手に判断してるから
日本語フォントの設定は適用されない。
IE なら多分ラテン語のフォント設定で表示してると思うが確認はしてない。
3214です:2005/12/09(金) 14:36:35 ID:???
レス下さった方ありがとうございます。

>>24 (切り分け)下がりました。はなから二段組構成でかかると
正常に表示されます。
>>25つられてさがります…。

今更ですがうpしてみたのでもしあれだったら見て下さい。
ttp://aa4a.com/parapara/test.html

また一つずつ見直していきます。
3330:2005/12/09(金) 14:43:19 ID:dJAXwr1/
30の質問をした者です。
質問が舌足らずですみませんでした。
TEXTAREA と INPUT の入力域で文字フォントが違う理由が知りたかったのです。
目的は、TEXTAREAの入力域とINPUTの入力域の文字フォント(サイズも含めて)を同じにしたいからなのです。
そのために、スタイルシートに、
textarea{
  font-family:sans-serif;
}
などとする解決策は妥当なのかを判断するために、
TEXTAREAとTEXTとで文字フォントが違う理由が知りたいのです。

もちろん、上記のスタイルシート記述では、
Netscape系(6.0以上)では、
TEXTAREAとTEXTの文字フォントが違ってしまいます。
ただし、Netscape系(Safari等含む)でも、
同様の現象が起きるため、Netscape系の解決にはならずとも、
原因は知りたいのです。

どなたかご存知の方がいらっしゃいましたら、
ご教示いただければ幸いです。
34Name_Not_Found:2005/12/09(金) 15:47:48 ID:LSGQQ4Qr
mediatypeがprintの場合は
プリンタのユーティリティだかドライバだかが直接cssを解釈してレンダリング・印刷を行うのでしょうか?
それともプリンタへ送った際のブラウザなどのレンダリング能力(?)に左右されるのでしょうか?

●OSやブラウザの種類とヴァージョン
Windows2000
IE5.0/PortableFirefox/OperaUSB
35Name_Not_Found:2005/12/09(金) 15:48:27 ID:???
>>34
後者
36Name_Not_Found:2005/12/09(金) 15:49:32 ID:???
ああ、ただドライバとの連携によっては巧く連動が取れない
とかいう話は聞いたことがあるが・・・
37Name_Not_Found:2005/12/09(金) 15:56:12 ID:???
>>35-36どうもありがとうございます
環境によっては意図しない印刷がなされたりする可能性もあるが、
わざわざ印刷して表示確認をする必要もない、
って理解でいいんですね。
すばやい回答、感謝です。
38Name_Not_Found:2005/12/09(金) 15:57:02 ID:???
>>33
違う理由も何も、同じにする規定がない。
デフォルト表示を如何にするかなんてのは定められてないよ。
form部品に限らず、emだろうがdelだろうが、「このように表示しろ」という指定はない。
ただ慣例に従うとどのブラウザも似たような表示結果になるだけのこと。
それをするのはユーザないしブラウザの(デフォルト)CSS。
だからユーザがCSSでデフォルトを変更するのは当然妥当。

とはいえ君のブラウザがそういう表示仕様なのかどうかまでは知らん、スマソ。
3925:2005/12/09(金) 16:20:24 ID:???
>>33
>Netscape系(Safari等含む)

Sfafariってレンダリングエンジンゲッコーとは別だけど
4030:2005/12/09(金) 16:58:55 ID:dJAXwr1/
>>31 >>38
レス下さった方ありがとうございます。
textarea と text で同じフォントにする理由はない

当然フォントは違う
Win+IE: "MS ゴシック"+"Courier New"
Win+NS: "MS ゴシック"
41Name_Not_Found:2005/12/09(金) 17:11:36 ID:???
javascriptでなくcssで時間でbg変化させることできるの?
42Name_Not_Found:2005/12/09(金) 17:18:53 ID:???
どうやって時間を計るの?
43Name_Not_Found:2005/12/09(金) 17:22:58 ID:???
>>41
PHPで。[ if ]を調べれば少しは分かると思うよ。
4425:2005/12/09(金) 17:28:50 ID:???
>>43
>>41はCSSでと言っているが?
頭おかしくねーか?>>43
45Name_Not_Found:2005/12/09(金) 17:37:15 ID:???
>>44
m9(^m^)
46Name_Not_Found:2005/12/09(金) 17:37:54 ID:F0gFjAfv
PHPって言葉をかいてみたかったんだよ、きっと。
47Name_Not_Found:2005/12/09(金) 17:47:32 ID:???
m9(^д^)プギャー
48Name_Not_Found:2005/12/09(金) 17:49:33 ID:???
>>44
CSSでは確かに出来ないよ。
俺は、くだらないけど昼と夜で背景画像をphpで変えてる。
JScriptでやっても良いが…
4925:2005/12/09(金) 17:53:57 ID:???
>>48
だったら出来ないって云え。
>>46の通りじゃねーか。
どうせ、>>48はJSじゃ出来ないんだろ?
背景画像切り替えるのになんでサーバに負荷かけるんだ。
いまは、JS使って負荷を軽くする方向に進んでるのに、
時代に逆行してますよと。
50Name_Not_Found:2005/12/09(金) 17:54:06 ID:???
m9(^д^)プギャー
51Name_Not_Found:2005/12/09(金) 17:55:34 ID:???
>>49
お前馬鹿だろ?
52Name_Not_Found:2005/12/09(金) 18:05:35 ID:???
池沼はスルー。これ基本。
53Name_Not_Found:2005/12/09(金) 18:05:41 ID:???
>>49
何そんなムキになってるの?

>どうせ、>>48はJSじゃ出来ないんだろ?
>背景画像切り替えるのになんでサーバに負荷かけるんだ。
>いまは、JS使って負荷を軽くする方向に進んでるのに、
>時代に逆行してますよと。
イタタタタ…
5425:2005/12/09(金) 18:14:23 ID:???
死ねよおめーら
5541:2005/12/09(金) 18:15:04 ID:FF2EOrTG
すまかった、できなんだろうなと九割九分九厘思った
でも朝 昼 夜 と背景変わるサイトのソースみたら
cssしかなかったんだよ
javascriptでは知ってますよ昔からあるから
でもjavascriptだとブラウザ選ぶでしょう、だからそのサイトはcssでやってるのかなとおもただけです
gifやjpegの中にjavascript隠してるのかな?
56Name_Not_Found:2005/12/09(金) 18:17:41 ID:???
>>55
だからサーバサイドスクリプトっつてんだろボk.

> でもjavascriptだとブラウザ選ぶでしょう
>>49に喧嘩売ってるぞww
57Name_Not_Found:2005/12/09(金) 18:17:56 ID:???
>>55
そのサイトどこ?
58Name_Not_Found:2005/12/09(金) 18:18:10 ID:???
>>55
behaviorを使えば?
まあ結局はCSSから利用するjavascriptだけど
てかこれIE限定だっけ
59Name_Not_Found:2005/12/09(金) 18:20:59 ID:???
>>57
本人じゃないけど、、こことかな。
http://def4.jp/
6025:2005/12/09(金) 18:41:08 ID:???
>>54
オレはそんな事言わない
61Name_Not_Found:2005/12/09(金) 18:49:33 ID:???
cssだけでできるのかな?って考えるところからしておかしい
cssの役割を理解しろよ
62Name_Not_Found:2005/12/09(金) 18:59:16 ID:???
今年の冬厨は随分早いな。
63Name_Not_Found:2005/12/09(金) 19:01:40 ID:???
gifやjpegの中にjavascript隠してるのかな?
6425:2005/12/09(金) 19:04:38 ID:???
>>59
php使えば誰でも出来るよー
php使うんだったらSSI使った方が軽いし。
背景変えるぐらいだったらSSIでしょ普通。JS以外でね。

>>55
>でもjavascriptだとブラウザ選ぶでしょう
選ばないよ、今時OFFにしてるやつはどうでもいいし。
65Name_Not_Found:2005/12/09(金) 19:08:32 ID:???
>>41
背景変えるその情熱を、コンテンツに注いだ方がいいと思うよ。
66Name_Not_Found:2005/12/09(金) 20:37:50 ID:???
現在、論文をスタイルシートで縦書きにしているのですか、IEでは縦書きで表示されますがFirefoxやNetScapeでは通常の横書きで表示されてしまいます。

ちなみに指定した際のタグは
{ width: 100%; height: 80%; direction: ltr; writing-mode: tb-rl; background-color: #FFF; color: #000; line-height : 1.7;
margin-top : 10px; margin-left : 10px; margin-right : 10px; margin-bottom : 10px; padding-top : 25px; padding-left : 25px;
padding-right : 25px; padding-bottom : 25px; }
です。

FirefoxやNetscapeで表示させるようにしたいので、アドバイス宜しくお願いします
67Name_Not_Found:2005/12/09(金) 20:43:15 ID:???
>>66
縦書きは現在草案中のものをIEが勝手に盛り込んだだけです。
CSS1のまともな実装もできていないくせにそういう余計な先走りばかりして
お陰で草案は互換性を保つために大きな苦労をしています。
そんなものを使わないでください。
ということで無理。

どうしても縦書きが良いんなら
普通に横書きで作って縦書きブラウザで表示させるのが一番。
http://www.kagetaka.org/
68Name_Not_Found:2005/12/09(金) 20:46:13 ID:???
>>66
結論から言うと、WinIEぐらいしか縦書き表示はできない。
確か次期CSSで候補に挙がってたと思う。
論文ならワードプロセッサを使用することをお勧めする。
69Name_Not_Found:2005/12/09(金) 20:46:57 ID:???
>>9-10
ブロック要素の中の最後の子要素をフロートさせているとbr以外clearを入れる余地がないのです。
ブロック要素のoverflowをautoにすると高さを確保してくれるようですがIE6ではうまくいきませんよね。
こういうときはどうします?
70Name_Not_Found:2005/12/09(金) 20:49:15 ID:???
>>69
じゃあHRでも使ったら。
それよりそんなギチギチのレイアウトを考えない頭を作ることが大事だと思うけど。
71Name_Not_Found:2005/12/09(金) 20:49:30 ID:???
>>67

なるほどそういうわけだったのですね。知りませんでした
ありがとうございました

#早く規格統一してほしいですね。
72Name_Not_Found:2005/12/09(金) 20:52:25 ID:???
>>71
や、規格は統一されてるんだけど無視してるM$さんが…。

でも縦書きがどんな最新ブラウザでもOKになったって、
現在のフォントじゃまともな縦書きにならないからそっちの変更とかもありそうだなあ。
73Name_Not_Found:2005/12/10(土) 00:32:58 ID:???
メインコンテンツを右側、サイドバーを左側に
表示させる形式がありますが
メニュータブと同じ場所で背景の色が切れてしまいます。


左左 右右
左左 右右
    右右
   右右


左のバーの高さを右側とあわせるにはどうすればいいんでしょうか?
74Name_Not_Found:2005/12/10(土) 00:36:15 ID:???
>>73
メニュータブ、をメニューブロックの左側だと解釈して話を進める。
全体を囲むブロックの背景色を左側ブロックの背景色と同じにする。
7574:2005/12/10(土) 00:37:20 ID:???
>>73
あ、つまり高さを合わせる訳じゃないよ、ごまかすだけ。
高さを合わせたいんだったらCSSだけじゃ駄目。
ていうかmin-heightでいいんだったらそれでもいいけどIEが対応してな・・・
76Name_Not_Found:2005/12/10(土) 00:56:06 ID:???
即レスありがとうございます。
本来意図した背景色を右ブロックで指定してしまえばいいわけですね。
やってみます。
77Name_Not_Found:2005/12/10(土) 03:37:29 ID:???
IEはハックで小さいheight入れて
のばすのがラクっていばラク
78Name_Not_Found:2005/12/10(土) 10:58:28 ID:???
>>76
右ブロックで指定じゃないと思うぞ。
作用のコンテナを囲む全体コンテナを作って、
そのコンテナの色を短い方の背景色に合わせろ、
というのが常套手段だが。
79Name_Not_Found:2005/12/10(土) 11:51:43 ID:ml9U1q+m
IE6.0ではCSSで指定した領域にbackground-imageで背景画像表示されるのですが
IE5.0で表示すると背景画像が表示されない場合があります

他に作ったサイトでも同じようにしてどちらでも表示されてるのですが何が違うのでしょうか・・・
80Name_Not_Found:2005/12/10(土) 14:01:30 ID:???
>>79
エスパーよろ
81Name_Not_Found:2005/12/10(土) 14:45:32 ID:???
>>79
表示できてるサイトとできてないサイトのソースをよく見比べる

てかもうIE5.0はほっといてもいいよ
82Name_Not_Found:2005/12/10(土) 15:12:18 ID:???
>>79
表示できない場合を切り分ける。
バグ辞典(http://cssbug.at.infoseek.co.jp/)を見てバグであることを確認。
もし出てない現象だったらバグスレッドに報告。
83Name_Not_Found:2005/12/10(土) 15:27:00 ID:iT3FjTIM
質問です。

position: relative を使うとIEでスクロールが重くなるんですが、
一般的な回避方法はないでしょうか。

もちろんケースバイケースなのでしょうが、

フロートの左右にある行の端がずれる
ttp://cssbug.at.infoseek.co.jp/detail/winie/b151.html

の場合のように

> ブロックボックスのwidthまたはheightプロパティを具体的な値で
> 明示することでこのバグを回避することができます。

みたいに、明確な回避方法があれば知りたいです。

よろしくお願いします。
84Name_Not_Found:2005/12/10(土) 15:28:34 ID:???
>>83
ものによるんだけど、staticに変えちゃ駄目な部分?
8583:2005/12/10(土) 15:49:59 ID:???
>>84
どういうことでしょうか?
staticの意味がわかりません…(´・ω・`)

書き忘れましたが、HTMLはできるだけ弄りたくないです。
それから、dtdはHTML 4.01 Strictです。
86Name_Not_Found:2005/12/10(土) 16:04:31 ID:???
わからなければググれよ。
87Name_Not_Found:2005/12/10(土) 16:07:27 ID:???
>>85
position:relative;だろ?
relativeはstaticにしてもOKな場合が多いんだよ、
そうするとリソースの消費も少なくて済むから。
88Name_Not_Found:2005/12/10(土) 16:13:14 ID:???
あ、勿論relativeでtop/left等を指定してたなら、
marginとかに変える。
8983:2005/12/10(土) 16:27:48 ID:???
position の値に static があったのを度忘れしていましたorz
頓珍漢な発言をしてごめんなさいorz orz

推論ばかりだと埒があかないのでソース出します。

◆HTMLの構成
<head>ヘッダ</head>

<container>
  <main>本文</main>
  <menu>メニュー</menu>
</container>

◆CSS
container に { position:relative; }
menu に { position:absolute; top:0; left:0; }

◆表示
-----------
ヘッダ
-----------
メニュー
-----------
本文

-----------

で、staticに変えられないか、というのはNGですよね?
もし上手い方法があれば教えてくださいorz
90Name_Not_Found:2005/12/10(土) 16:29:57 ID:???
position: fixed;
にするとスゲースクロール重くなって、フリーズする。

何であんな重いの?
再描画してるの?ああーイライラ
91Name_Not_Found:2005/12/10(土) 16:33:56 ID:???
>>89
難しい<タグ>だな。
92Name_Not_Found:2005/12/10(土) 16:36:58 ID:???
>>89
おまえ、それを表示させてみろ。
本当にそれがおまえの望む表示になってるか?
頼むから確認してソースはまともに表示できるのにしてから出してくれ。
ついでにどうしてそれでrelativeの必要性がある?
そこに出てない部分でrelativeの必要性があるのか?
9383:2005/12/10(土) 16:49:15 ID:???
>>91
もちろん、このまま書いているわけではなく、<head> は <div id="head"> とかです。

>>92
すみません。抜け漏れがありました。
こんどこそ確かなの出します。

◆CSS
#container { position:relative; border: 1px solid red;}
#menu { position:absolute; top:0; left:0; border: 1px solid green;}
#main {margin-top: 2em; border: 1px solid blue;}

◆HTML
<div id="head">ヘッダ</div>

<div id="container">
  <div id="main">本文</div>
  <div id="menu">メニュー</div>
</div>

確認しましたが、
#container の { position:relative; } は必要でした。
(static だと表示が崩れました。)
94Name_Not_Found:2005/12/10(土) 16:55:10 ID:???
>>93
#container { border: 1px solid red;}
#menu { margin-top:-3em; border: 1px solid green;}
#main { margin-top: 2em; border: 1px solid blue;}
9583:2005/12/10(土) 17:03:21 ID:???
>>94
それだとmenuが2行以上になったとき崩れませんか?
もちろん本文は複数行 かつ 可変です。
(私の書き方がまずかったですね。言葉足らず過ぎですみません。)

すみませんが出かけてくるのでスレを離れます。
96Name_Not_Found:2005/12/10(土) 17:06:36 ID:???
>>93
どこかでつまらんものを吹き込まれたようですね?
97Name_Not_Found:2005/12/10(土) 17:10:31 ID:???
>>93
それでrelativeをやめたいなら、素直にHTMLのメニューを先に書くことだ。
SEO対策なんて言われてるほど意味のあるもんじゃない、
あれはほーむぺーじ屋がリニューアルを迫るための口実ってのが大きい。
98Name_Not_Found:2005/12/10(土) 17:13:10 ID:???
>>95
93のソースでも、メニューが何行にもなったときは本文と被るんだが・・・
9914:2005/12/10(土) 17:15:08 ID:???
解決しました。一応書いておきます。
幅が縮小したら崩れるのを防ぐつもりでいれた
(無駄にいくつも入れる必要が無かった)
#container部分のclearが原因でした。
すでにためしてた事だったのですがリロード
ではなく変更のたびにMacIEを再起動させなくては
うまく反映しなかったようです。
どうも失礼しました。
100Name_Not_Found:2005/12/10(土) 17:21:20 ID:???
>>14
おお、乙。
力になれなくてスマンかった。
101Name_Not_Found:2005/12/10(土) 17:50:20 ID:???
>>95
border関係はメタメタになるが
#main { position:absolute; margin-top:1em;} /* ←margin-topはメニューによって変えてね */
文章入れ替えなら#containerと#menuの設定消してこれだけでイケる。
102Name_Not_Found:2005/12/10(土) 19:00:23 ID:???
ギリシア・キリル文字等のフォントをCSSやHTMLで変更することは可能ですか?
103Name_Not_Found:2005/12/10(土) 19:23:08 ID:???
>>102
font-familyの話をしてるなら理論的には可能なはず
試したことはない
104Name_Not_Found:2005/12/10(土) 19:31:24 ID:???
>>103
実際に

dd{
  font-family:"MS PGothic","Osaka−UI",sans-serif;
}

と書いて、HTMLに<dd>〜</dd>(<dt>とかもありますが省略)としてもIEだと設定されているフォント(Times New Romanなど)になってしまうんですよ。
105Name_Not_Found:2005/12/10(土) 20:29:17 ID:???
>>104
先生、MSゴシックにギリシャ語って存在するんですか?

とりあえず書き方違わないか?
ttp://aor.ktplan.jp/fonts/cssfonts
106Name_Not_Found:2005/12/10(土) 20:34:15 ID:???
>>105
ある。XPならIEのフォント設定でギリシア語・キリル文字に設定できるし。

先生、下のほうに「MS PGothic」があります。
107Name_Not_Found:2005/12/10(土) 20:37:13 ID:???
>>106
XP知らなーい。勉強になった。

スマン
ttp://aor.ktplan.jp/fonts/allfonts
108Name_Not_Found:2005/12/10(土) 20:43:21 ID:???
兎に角、Windowsだと「MS Pゴシック」も「MS PGothic」もOK。

あと、
body{font-family:serif;}
と書いてやると<dd>〜</dd>だけMS PGothicになるから指定が効いているのは間違いない。
半角英数お日本語以外のフォントは設定されている標準になる。
109Name_Not_Found:2005/12/10(土) 20:49:15 ID:???
>>104=108?
110ntaich075048.aich.nt.adsl.ppp.infoweb.ne.jp:2005/12/10(土) 20:50:33 ID:???
>>109
その通り

フシアナしとく
111Name_Not_Found:2005/12/11(日) 01:30:57 ID:bKkfRIQT
クラス指定に関しての質問です。
クラス指定って差分プログラミングできないのでしょうか?
例えばAってクラス指定でフォントとサイズを指定し、
BとCでAを継承し(フォントとサイズを引継ぎ)、ボーダーの指定だけを
それぞれ指定する方法です。

ボーダーの組み合わせ(16種類)をクラスでやろうと思ったときに疑問になりました。

宜しくお願いします。
112Name_Not_Found:2005/12/11(日) 01:42:55 ID:???
>>11
BとCがAの内包クラスなら自然とそうなる
CSSの継承を調べてみて、それ以上のことはできないよ
113111:2005/12/11(日) 01:50:20 ID:bKkfRIQT
>>112
例えば、
div{
フォントとサイズを指定
}

div.B{
ボーダーのみ指定
(フォントとサイズは引継ぎ)
}

ってのは出来ないってことですか?

DOMにおける属性の継承は調べましたが、自分はJava屋でしたので
継承で差分プログラミングできないかな〜って思ったしだいです。
114Name_Not_Found:2005/12/11(日) 01:54:51 ID:???
>>113
できるよ
115Name_Not_Found:2005/12/11(日) 01:58:43 ID:???
class="A B C"
116Name_Not_Found:2005/12/11(日) 01:59:59 ID:???
>>113
できるよ。
それだとまずdiv全体にその指定がなされる。
次にclassがBのdivにのみ、divの設定+ボーダーの設定がなされる。
前スレからコピペ。

977 Name_Not_Found 2005/12/07(水) 22:35:59 ??? mailto:sage
>>976
うーん、もちっと基本勉強したほうがいいかも。
CSSは汎用装飾→特殊装飾の順にトップダウンしていく仕組みだから、
divで指定した場合、全部のdivにその装飾がいくワケね。これが汎用。
で、その中から特殊なclassなりidなりに、更に修飾を足す、または上書きする。
117111:2005/12/11(日) 02:03:03 ID:bKkfRIQT
>>113
えっ、出来ますか?
以前験したとき、親にあたる属性(divの親であるbody)の
属性を引き継いでしまいました。
なにか書き方があるのでしょうか?
118Name_Not_Found:2005/12/11(日) 02:03:26 ID:???
119Name_Not_Found:2005/12/11(日) 02:05:53 ID:???
>>117
ん?ちょっと待って、引き継ぎたいんじゃないの?
118のような規則になっているよ。
120Name_Not_Found:2005/12/11(日) 02:12:48 ID:???
>>117
あ、もしかして、divの設定を無視してbodyの設定がdiv.Bに反映されちゃったって意味?
↓を試しても君の環境でそうなるんだったら、環境がおかしいかも。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html401/strict.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>テスト</title>
<style type="text/css"><!--
body{font-size:12px;color:#f00;background:#fff;}
div{font-size:20px;color:#0f0;background:#000;}
div.b{border:solid 3px #00f;}
--></style>
</head>
<body>
<div class="b">黒地緑字になってる?</div>
<div>ここはボーダーなし黒地緑字</div>
</body>
</html>
121111:2005/12/11(日) 02:17:37 ID:bKkfRIQT
>>119
すみません。
説明が下手でした。
DOMツリーにおける親子関係での属性の引継ぎではなく、
Javaみたいにクラス間での継承による属性の引継ぎが
できないかなった思っていたのです。

まぁ、出来ないとしてもコピペで済みますので
支障はないですけど。
122Name_Not_Found:2005/12/11(日) 02:24:44 ID:???
>>122
JAVAのクラス継承よく知らんので変なこと言ってたらスマンが、
クラス間にDOM上の親子関係がない場合は引き継ぎはむりぽ。
>>115のようにクラスを幾つも指定してやることで沢山のスタイルも取り込めるから、
コピペはそこまで要らんと思うよ。
123111:2005/12/11(日) 02:25:22 ID:bKkfRIQT
>>120
あっ、うまく逝きました。

環境はIE6.0です。
HTMLの記述はDOCTYPEのところが曖昧です。
月曜日に会社で確認したからまた書き込みます。
そう言えばDOCTYPEの書き方でIEの挙動が変わるってどこかで
見た気が・・・
124Name_Not_Found:2005/12/11(日) 02:27:44 ID:???
125Name_Not_Found:2005/12/11(日) 02:30:43 ID:???
あ、因みに挙動変わるのはIEだけじゃないよ。
IEのCSS解釈はちょっとアレなので、
真面目にCSSをヤルんだったらFirefoxのほうがいいカモ。
126111:2005/12/11(日) 02:32:52 ID:bKkfRIQT
>>115 >>122
有難う御座います。
クラス複数していも月曜日会社で試してみます。
(組み合わせを考えなきゃ名〜)
127Name_Not_Found:2005/12/11(日) 02:36:44 ID:???
>>104
"MS PGothic","Osaka−UI"
に " はいらないよ
128Name_Not_Found:2005/12/11(日) 02:37:18 ID:???
>>127
ちょwwwおまwwwww
129111:2005/12/11(日) 02:40:54 ID:bKkfRIQT
>>125
今回の対象は社内アプリでIE6.0限定です。
(JScriptも使いまくり)

関係ないけど、111からの書き込み見直すと仮名漢字とかかなり変。
酔っ払ったまま書き込むのは危険ですね。
それでは退散します。
月曜日の夜に結果報告いたします。
130Name_Not_Found:2005/12/11(日) 02:45:45 ID:???
131Name_Not_Found:2005/12/11(日) 03:23:26 ID:???
<div id="left">...</div>
<div id="right">...</div>

というのを作り、leftは左に(メニューとか)、
rightは右に並べようと思ってます。
そのとき、leftよりもrightの方が長いと、leftが途中で切れて格好悪くなってしまいます。
なので、leftの高さをrightの高さと同じようにしたいのですが……

わかりにくいと思うので、理想通りのサイトを(これはテーブル)
http://www.rockbox.org/
これのメニューみたいに、左の柱が右の柱の高さと同期するようにしたいのですが……

どうやれば良いのでしょう。
132Name_Not_Found:2005/12/11(日) 03:30:39 ID:???
>>131
left{float:left; hight:100px;}
right{float:left; hight:100px;}
133131:2005/12/11(日) 03:37:37 ID:???
右は可変でお願いします……

というか、似たようなことも検討したんです。
メニューだけpx固定という。
しかしそれだと、画面サイズが指定サイズ以下だと、
無駄なスクロールバーがでちゃうのであきらめました。
134Name_Not_Found:2005/12/11(日) 04:46:25 ID:???
このスレ、ちょっと前まではいい感じだったのになぁ〜・・・・・
135Name_Not_Found:2005/12/11(日) 07:05:36 ID:???
背景に写真を使っているため、白い半透明のテキストボックスが欲しく、

.txtbox{background:#ffffff; filter:alpha(opacity=45);}
<div class="txtbox">

こんな感じに使っているのですが、
そのテキストボックス内で、普通にimgタグで画像を貼り付けると
テキストボックス内に貼り付けた画像まで透過率を継承してしまいます。

新たに貼り付けた画像は透過して欲しくないのですが、継承を拒否するようなやりかたはありませんでしょうか。
136Name_Not_Found:2005/12/11(日) 07:34:54 ID:???
.txtbox img {}
137Name_Not_Found:2005/12/11(日) 07:53:24 ID:???
filterて
138Name_Not_Found:2005/12/11(日) 09:30:22 ID:???
写真てことは固定? そうだったら
body {background-image:url(濃い背景写真)}
.txtbox {background-image:url(薄い背景写真)}
でも、filterって何ー
139Name_Not_Found:2005/12/11(日) 09:36:42 ID:???
filterはCSSじゃないからほっとけ
140Name_Not_Found:2005/12/11(日) 10:55:03 ID:???
えー!filter知らないんですかー!
141Name_Not_Found:2005/12/11(日) 11:03:00 ID:???
ごめーんしらないんですぅ><
142Name_Not_Found:2005/12/11(日) 11:12:44 ID:???
>>131
box {

}

<div class="box">
 <div class="left"></div>
 <div class="right"></div>
<div>
143Name_Not_Found:2005/12/11(日) 11:13:16 ID:???
間違って書き込んじゃったからここまで。
144Name_Not_Found:2005/12/11(日) 12:13:02 ID:???
>>135
ない
145Name_Not_Found:2005/12/11(日) 12:14:29 ID:???
>>131
JS使うかテーブルしかない。
CSSだけだと>>73-74のように背景でごまかす。
146131:2005/12/11(日) 12:33:15 ID:???
>>142
#box{
width:100%;
position:absolute;
background-color:#ffffcc;
}
#right{
width:84%;
float:right;
background-color:#FFFFFF;
}
#left{
width:16%;
float:left;
background-color:#ffffcc;
}
これでいけました。
147131:2005/12/11(日) 12:35:31 ID:???
ああ、rightがleftより短いと、
背景が後ろまで出てくるか……
そこは譲歩しないとダメか。
148Name_Not_Found:2005/12/11(日) 12:45:13 ID:???
>>147
本質を理解してないな・・・
「必ず短いほう」に背景色を合わせるんだよ。
それが嫌なんだったらテーブルレイアウトでもいいと思うぞ。
149Name_Not_Found:2005/12/11(日) 13:16:48 ID:???
質問させてください。
「ページの余白を指定するタグ」 <!--body{margin-top:**px;margin-left:**px;}……
で、400pxなどの大きな数字を入れ、好きな場所から文字が始まるように使用しても大丈夫なのでしょうか?
窓+IEでは普通に見れますが、Macなどだと酷いことになったりしないか不安で…
やっぱりこういう場合はテーブルタグをつかったほうがよいのでしょうか?
よろしくお願いします。
150Name_Not_Found:2005/12/11(日) 13:21:35 ID:???
スペーサーが欲しいってことでしょ?
別に問題ないとおもうけど
151Name_Not_Found:2005/12/11(日) 13:22:45 ID:???
>>149
それはタグじゃありません。CSSです。
好きな場所、というのがビルダーの何処でも配置モードと同じような絶対配置を指すのだとしたら
UA間によって差異が大きく出る可能性があります。
152Name_Not_Found:2005/12/11(日) 13:27:34 ID:???
>>149
とりあえずMacを買うのは大変だろうから、色んなブラウザをインストールしてみて御覧。
http://www.mozilla-japan.org/products/firefox/
http://www.mozilla.gr.jp/news/topics/viewonetopic.php?topic=mozilla&num=39
http://wp.netscape.com/ja/downloads/
http://www.jp.opera.com/
http://www.kagetaka.org/
あと今HTMLで装飾してるのをCSSに変えたいんだったら
ttp://deztec.jp/lecture/rn/index.html
HTML自体が正しくないとCSSはどうしようもないから、HTMLの勉強用に
ttp://www.ne.jp/asahi/minazuki/bakera/html/reference/reference
153Name_Not_Found:2005/12/11(日) 13:46:45 ID:???
>>146
#box{
margin: auto;
width: 800px;
background: url('n.gif') repeat-y;
}
#right{
width:640px;
float:right;
}
#left{
width:160px;
float:left;
}

n.gifは幅800pxでright,leftの背景に対応する画像を用意
154Name_Not_Found:2005/12/11(日) 13:54:39 ID:???
>>148
そうなる可能性もあるということです。
メニューは全ページ同じでも、
右の柱が長くなったり短くなったりするので、
たまにメニューの長さに負ける可能性が無くもないと。
普段はメニューの方が短いのですがね。
必ず短いという保証はないのです……

>>153
width固定にするなら、その方法もありですね。思いつきませんでした。
固定にする気は今のところありませんが、参考にさせてもらいます。
155Name_Not_Found:2005/12/11(日) 17:30:34 ID:???
・font-size:90%
・font-size:0.9em
この2つってどう違うのですか?
OperaやNNだと大丈夫なのですが、
IEだと前者は正しく表示されるのに、
後者だと「文字サイズ:小」と設定したときに
文字が異常なほど小さくなってしまいます。
IEのバグなのか、私の見当違いなのか……
教えてください。
156Name_Not_Found:2005/12/11(日) 17:34:00 ID:???
157Name_Not_Found:2005/12/11(日) 17:35:31 ID:???
どうもありがとう
158Name_Not_Found:2005/12/11(日) 17:38:30 ID:???
>>150-152
火狐で見たら酷いことになったので変えようと思います。
ありがとうございました。
159Name_Not_Found:2005/12/11(日) 17:43:30 ID:???
>>158
あ、IEは標準モードと互換モードで全然挙動違うんで、標準で合わせたほうがいいよ。
ttp://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_situation.html
ttp://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_example.html
160Name_Not_Found:2005/12/11(日) 18:19:23 ID:???
1行目にXML宣言入れてるんでムリ
161Name_Not_Found:2005/12/11(日) 18:25:28 ID:???
>>160
だったらIEには入れなきゃいいじゃん
162Name_Not_Found:2005/12/11(日) 21:12:13 ID:???
>>159
気持ち悪いサイト貼るなや
163Name_Not_Found:2005/12/11(日) 21:39:01 ID:???
>>162
GJ
164Name_Not_Found:2005/12/11(日) 22:00:24 ID:???
両 float の問題は FAQ だけど、overflow で解決できるのを知らない人が
割と多いみたいなので、以下の The New Solution を参照。
http://www.quirksmode.org/css/clearing.html

>>154 の場合には、親の container.div に background-image をあわせて指定。

結論だけ知りたい人は上の記事を日本語で紹介したやつ
http://www.lucky-bag.com/archives/2005/03/float_overflow.html
どういう指定でどういうトラブルが出るかまでは書かれていない。
165Name_Not_Found:2005/12/11(日) 22:54:31 ID:???
関係ないけど
コンテナ(container)をずーと
コンタイナーって読んでたよ
166Name_Not_Found:2005/12/11(日) 23:15:07 ID:???
>>164
それは全然的外れなことを言ってる・・・
左右どちらが長くなるかわからない、かつ
左右の背景色が違うんだったら
短いことが多いほうで設定して、そっちが長くなっても妥協するしかないでしょ。
167Name_Not_Found:2005/12/11(日) 23:29:08 ID:???
テーb
168Name_Not_Found:2005/12/12(月) 00:25:09 ID:???
>>166
あれ、>>131 で float が clear されてないから、長い方が切れるって話じゃないのか
169Name_Not_Found:2005/12/12(月) 00:26:19 ID:???
それは解決されてるでガス
170Name_Not_Found:2005/12/13(火) 01:03:23 ID:???
ブロックレベル要素(h1要素など)の幅を内容に合わせて自動的に
変化させることはできませんか?display:inlineとしてやれば
可能ですが、そうするとインライン要素のようにレンダリングされて
しまうので、表示はブロックレベルのまま前後に改行が入るように
したいです。
171Name_Not_Found:2005/12/13(火) 01:50:53 ID:???
幅って?縦?横?
172170:2005/12/13(火) 04:23:36 ID:???
横です。
173Name_Not_Found:2005/12/13(火) 04:39:58 ID:???
次にbr入れるか、テーブルでやるか・・・
174Name_Not_Found:2005/12/13(火) 04:43:15 ID:???
すまそ、もっといい方法が。
ttp://www.stylish-style.com/csstec/basic/m-back.html

display:inlineしたのをdivで囲む。でもdiv厨かも。
175Name_Not_Found:2005/12/13(火) 06:35:01 ID:???
なんでdivが嫌われるのかわからん
176Name_Not_Found:2005/12/13(火) 09:33:46 ID:???
>>170
display: table;

まぁ、IEには無いけど…
177Name_Not_Found:2005/12/13(火) 12:19:37 ID:???
>>170
正しくHTMLを書けばH1の下はブロック要素のハズ。
とすればh1をinlineにしておけば、自然とさの次のブロック要素との間には改行ができる。
178Name_Not_Found:2005/12/13(火) 12:30:13 ID:???
>>174
回りくどい。<h1><span>..</span></h1> と表示結果は似たようなものだろ。

>>177
行が折り返されても背景色は全体に行き渡るようにしなきゃ駄目なんじゃないの?
仮にそうなら、display:inline; は使えないから、shrink-to-fit されるように、
display:table;, position:absolute;, float:left(right); しかないだろ。
でも、display:table; を除いて、後続の心配をしなきゃならないから、結局、>>176になる。

現実には、<table>要素型(抽象的な表定義)の具体的利用形態の一つである、
「視覚に対して表としてのレイアウト(紙媒体のようなレイアウト)を提供する [RFC1942]」
を素直に利用する。
<table><tr><td><h1>..</h1></td></tr></table>
で問題無い。
179Name_Not_Found:2005/12/13(火) 12:39:29 ID:???
>行が折り返されても背景色は全体に行き渡るようにしなきゃ駄目
???
これは逆だと読めたんだが、
背景色やボーダーがないなら幅なんて考える必要ないじゃん
180Name_Not_Found:2005/12/13(火) 12:46:15 ID:???
>>177
HTML4.01 Transitional DTD などでは、body 要素直下にHTMLのインラインレベルエレメントを置ける。
言うまでも無く、HTMLのインラインレベルエレメントは、普通、display:inline; な表示である。
181Name_Not_Found:2005/12/13(火) 12:50:28 ID:???
>>179
> 背景色やボーダーがなければ幅なんて考える必要無い
>>178 幅を考える必要がない (というか適用されない) display:inline; じゃあ駄目
182Name_Not_Found:2005/12/13(火) 13:03:30 ID:???
>>181
170の望んでるのはdisplay:inlineじゃ改行がされないから駄目、というだけだぞ
183Name_Not_Found:2005/12/13(火) 13:07:53 ID:???
>>180
それは現在のW3Cの求めるところではないから
「正しい」とは言い難いじゃろ。
184Name_Not_Found:2005/12/13(火) 13:11:43 ID:???
>>180
ISOが聞いたら泣き出しそうな仕様だな
185Name_Not_Found:2005/12/13(火) 13:25:13 ID:???
h1{display:inline;}
h1:before{content:"\A";}
h1:after{content:"\A";}
次の要素がインラインでもこれでイケるかと思ったんだが、
テキスト相当の改行=半角スペースが入るだけでbr相当の改行は入らなかったな、
何か間違ってる?
186Name_Not_Found:2005/12/13(火) 14:21:05 ID:???
みんなもっとdivをいっぱい使おうよ。
187Name_Not_Found:2005/12/13(火) 15:25:21 ID:???
次スレからテンプレきぼん
http://www.divlayout.com/
188170:2005/12/13(火) 15:30:48 ID:???
レスを下さった方々、ありがとうございます。
紹介していただいた方法をまとめると、
・display: inline; (Strictにマークアップしてあることが前提)
・display: table; (IEは未対応)
・<table><tr><td><h1>〜</h1></td></tr></table>
・<h1><span>〜</span></h1>
・<div><h1>〜</h1></div>
などですが、下の三つの方法は見た目を制御するためにHTMLを書き換える
ことになって保守性が下がってしまうので、私にとっては使いにくく感じました。
私の書く文書はXHTML1.1としてマークアップしているので最初の方法でも
とりあえずは問題ないのですが、要素の内容が多いと改行が入り枠線や
背景色が意図したものとは違ってくる、margin-topなどのプロパティが
使えない(なぜ?)、などの不満もあります。ひとまずはタイトルを長く
しすぎないことで対応したいと思います。(TransitionalなHTMLでも
使える方法があればそれが一番なんですが)
189Name_Not_Found:2005/12/13(火) 16:05:51 ID:???
.XXX

#XXX

クラスとIDってすみわけらしいのだが
って何が違うん?
190Name_Not_Found:2005/12/13(火) 16:13:37 ID:???
オ ゥォ ッョ  ググレ カレー
191Name_Not_Found:2005/12/13(火) 16:18:14 ID:???
>>189
<p id="MAKIKO-TANAKA" class="name">田中真紀子</p>
<p id="KAKUEI-TANAKA" class="name">田中角栄</p>
IDはその要素「固有の」名前を表す、だから1ファイルに同じIDがあってはならない。
classはその要素の性質を表す。
192Name_Not_Found:2005/12/13(火) 16:27:28 ID:???
>>191
???
固有の設定?をしたいときにIDを使うでおk?
193Name_Not_Found:2005/12/13(火) 16:38:51 ID:???
>>192
「設定」をするしないとは別物。
たとえば生きてるときでも、「私」がID(名前)を有していて、
更に「男」「人間」というclass(性質)を有しているように、
文書もその中身に名前と性質を有してるだろ?
それを踏まえて適切にマークアップすれば、自然とIDとCLASSは棲み分けられる。
CSSで設定をしたいからidがあるわけでもclassがあるわけでもない。
元々そういう性質(class)を持っているから、同じ性質には同じ設定をするんだし、
元々そういう名前(id)を持っているから、それには固有の設定ができるだけ。
設定をしたいからid/classを振るのは本末転倒。

これに関してはCSSじゃないから、Strict-HTMLスレのが適切な希ガス。
http://pc8.2ch.net/test/read.cgi/hp/1132669841/
194Name_Not_Found:2005/12/13(火) 17:07:35 ID:???
>>187
大してこったレイアウトでもないのに
自信有り過ぎw
このデザインなら確認しなくてもどのブラウザでも見られるし。
hタグの使い方間違えてるしw
fontsizeピクセル指定だしと

挙げたらきりがないなー。
無視でよろ
195Name_Not_Found:2005/12/13(火) 17:15:28 ID:???
>>194
みんなが無視してたのに何を構ってるんだ
196Name_Not_Found:2005/12/13(火) 18:26:20 ID:???
自演臭いな
197Name_Not_Found:2005/12/13(火) 20:30:01 ID:???
 へ へ
 の の
  も
  へ
198Name_Not_Found:2005/12/14(水) 23:01:32 ID:2fZ17BR0
<ul class="menu">
<li class="menulink"></li>..
</ul>
としているところを、いちいち<li>にクラス指定せずに、
ul li{...}
という様にcssの方で一括指定するにはどうすれば良いでしょうか?
199Name_Not_Found:2005/12/14(水) 23:04:51 ID:???
>>198
.menu li {..........}
200Name_Not_Found:2005/12/15(木) 00:30:58 ID:JXWnMn1B
IE6使用です。3段組+ヘッダ+フッタのレイアウトで
縦スクロールした時に両サイドとヘッダ部分のみ
固定した状態でブラウザでの表示位置を変えない
ようにする事は出来ないでしょうか?
(3段組の中央部のみスクロールされる状態)
よろしくお願いします。
201Name_Not_Found:2005/12/15(木) 00:33:39 ID:???
>>200
いいアイディアだね。パクるヮ。
202Name_Not_Found:2005/12/15(木) 00:36:45 ID:???
>>200
ttp://p2b.jp/index.php?UID=1127227173
これのことか?
これが理解できないんだったら素直に縦割りフレーム使うがよろし。
203Name_Not_Found:2005/12/15(木) 00:40:53 ID:???
擬似フレームはFAQだよ。
http://web2ch.s31.xrea.com/?CSSFAQ#content_1_4

このスレッドでは>>1がFAQを全部書き込まないで立て逃げしたけどな。
204Name_Not_Found:2005/12/15(木) 00:53:52 ID:JXWnMn1B
>>202
>>203
助かりました。何とか解決出来そうです。
ありがとうございます<(_ _)>
205Name_Not_Found:2005/12/15(木) 01:51:39 ID:???
FONTの埋め込みってできるんですか?
206Name_Not_Found:2005/12/15(木) 01:56:02 ID:???
エスパーキボンヌ
207Name_Not_Found:2005/12/15(木) 09:07:17 ID:???
position: fixed;
top: 32px;

Netscape,Mozilla,Firefox,Opera,IEだと正常なのに
Safariだと崩れる。

32pxって書いてあるのに下行きすぎ!
重なって文字が見えねーよ。
これはバグ?それとも仕様??
208Name_Not_Found:2005/12/15(木) 10:43:56 ID:???
エレガントなsafariにバグなどあろうはずもない
209Name_Not_Found:2005/12/15(木) 10:56:27 ID:???
IE は :hover使えますか?
210Name_Not_Found:2005/12/15(木) 11:00:13 ID:???
おまいは試すと死んでしまうのか?
211Name_Not_Found:2005/12/15(木) 11:41:32 ID:???
はい
212Name_Not_Found:2005/12/15(木) 12:54:36 ID:???
>>209
a:hoverのみサポート
213Name_Not_Found:2005/12/15(木) 13:03:29 ID:???
:visitedとかIE使えないのか。
使えないんだ。
使えないIE
214Name_Not_Found:2005/12/15(木) 13:05:39 ID:???
215Name_Not_Found:2005/12/15(木) 13:11:33 ID:???
はい
216Name_Not_Found:2005/12/15(木) 13:12:18 ID:???
うんこ
217Name_Not_Found:2005/12/15(木) 14:56:01 ID:/qlXhHgU
全称セレクタ*とhtmlとbodyは、同じものですか?
どれで設定しても、それにすべての要素に適用されると思うのですが。
218Name_Not_Found:2005/12/15(木) 15:20:02 ID:???
はぁ?
219Name_Not_Found:2005/12/15(木) 17:12:48 ID:???
「継承」で調べんさい。>>217
220Name_Not_Found:2005/12/15(木) 17:31:00 ID:???
肉を食え肉を
221Name_Not_Found:2005/12/15(木) 19:40:03 ID:???
body{
 margin:0;
 padding:0;
 background-image:url(../images/bg.gif);
 background-position:center;
 background-repeat:repeat-y;
 text-align:center;
}

#hogehoge{
 width:750px;
 margin:auto;
 padding:auto;
 text-align:left;
}

上記のようにして背景画像とセンタリングしたボックス(div)を
配置すると、WinIE 6 で横位置が1px分ずれるんです。
(※他のブラウザでは背景画像(幅750px)とボックスの両端がちゃんと合う)

これってどこに原因があるんでしょうか。
222Name_Not_Found:2005/12/15(木) 20:33:40 ID:???
>>221
IEが標準モードでもそうなる?
223Name_Not_Found:2005/12/15(木) 20:35:58 ID:2qoUVvWo
>>222
>IEが標準モードでも
?
「が」
224Name_Not_Found:2005/12/15(木) 20:37:10 ID:???
どっちにずれるか聞かせてよ
225221:2005/12/15(木) 20:47:42 ID:???
>>222
一応、標準準拠モードにしてます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

>>224
div要素がずれているのか、背景画像がずれているのかはっきりしませんが、
背景画像を基準にすれば、div要素が左に1pxずれます。
226Name_Not_Found:2005/12/15(木) 21:05:18 ID:???
>>228
ホントだ、ずれるな。50%でも同様。
これ、偶数ピクセルのせいで「明確な中心」が出ないんじゃないかな、
多分切り捨て/切り上げのラウンドがもじら系とは違うんだと思う。
だから結論としては、画像とdivを749pxにしてやれば*IEでは*直る。
ただこれをするとFirefoxで逆にずれてくれるんでorz
そっちは750pxのままで振り分けて。
227Name_Not_Found:2005/12/15(木) 21:09:31 ID:OSlz4Ee6
>749px
のような指定ではなくて%指定のほうがいいのでは?
228Name_Not_Found:2005/12/15(木) 21:12:49 ID:???
後ろ向きな手段ではあるがホゲホゲに背景画像
229221:2005/12/15(木) 21:23:49 ID:???
>>226
背景画像2枚用意して切り換える訳ですね。
試してみます。

>>228
中身がなくてもページ下端まで背景画像を表示させたいのです。
bodyに背景画像をセットする以外にやり方ってあるのでしょうか?
230Name_Not_Found:2005/12/15(木) 21:24:58 ID:OSlz4Ee6
>>229
%指定のほうがいいのでは?
231Name_Not_Found:2005/12/15(木) 21:26:38 ID:???
232Name_Not_Found:2005/12/15(木) 22:42:51 ID:???
俺もpx指定でIEでずれたから、IE用のスタイルシートを別に書いて、
サーバサイドスクリプトでブラウザ取得してスタイルシートを返してる。
IEのバグじゃないのかな。
233Name_Not_Found:2005/12/15(木) 23:00:26 ID:???
>>232
UA偽装
234Name_Not_Found:2005/12/16(金) 00:05:02 ID:???
UA偽装はそいつの責任
235Name_Not_Found:2005/12/16(金) 00:22:24 ID:???
>>234
いやお前の責任
236Name_Not_Found:2005/12/16(金) 00:30:05 ID:???
偽装する知恵があるのなら、ページが正常に表示されない問題も自己解決できるさ。
好きに泳がせておけばいい。
237Name_Not_Found:2005/12/16(金) 03:00:03 ID:???
非常に素朴な疑問
CSSで“本来正しい記述”はどれ?

例題
body@{Abackground-colorB#FFFFFFC}

@半角スペースを開ける YES/NO
A半角スペースを開ける YES/NO
B
 1 ":"(コロンのみ)
 2 ": "(コロン+半角スペース)
 3 " : "(半角スペース+コロン+半角スペース)
C
 1 ";"(セミコロンのみ)
 2 "; "(セミコロン+半角スペース)
 3 " ;"(半角スペース+セミコロン)
 4 " "(半角スペースのみ)
238Name_Not_Found:2005/12/16(金) 03:05:57 ID:???
これほどどうだっていい質問はそうは無かろう
C−4以外は
239Name_Not_Found:2005/12/16(金) 03:37:08 ID:???
スルーしろよ
240Name_Not_Found:2005/12/16(金) 03:45:24 ID:???
C−4が正じゃなかったっけ?
241Name_Not_Found:2005/12/16(金) 04:04:34 ID:???
>>237
どれでもいい。
ただ4がそのセレクタ最後のプロパティでなかった場合はセミコロンが必要と言うだけ。
個人的には
body {
background-color : #fff;
color : #000;
}
↑タブ           ↑タブでコロンを合わせる。
242Name_Not_Found:2005/12/16(金) 04:58:33 ID:???
body { background-color : #FFFFFF }
これが綺麗
243Name_Not_Found:2005/12/16(金) 06:40:36 ID:???
好きなように書けよ
244Name_Not_Found:2005/12/16(金) 06:51:47 ID:???
今は俺が考えたインデント式が海外でも広まってるんだぜ
245Name_Not_Found:2005/12/16(金) 08:35:10 ID:???
>>244
??
246Name_Not_Found:2005/12/16(金) 10:27:07 ID:???
>>241
無駄なバイト数が増えるだけ。
247Name_Not_Found:2005/12/16(金) 10:38:23 ID:???
>>244
kwsk
248Name_Not_Found:2005/12/16(金) 12:14:17 ID:???
タブやスペースで容量云々言うより
画像やCSSの書き方自体のが問題だ罠
249Name_Not_Found:2005/12/16(金) 12:14:56 ID:???
>>248
ありえねー
250Name_Not_Found:2005/12/16(金) 12:29:09 ID:???
>>248
殆どCSSで何も書いてないくせに
背景画像で70MB超えてたりするともうアボガドバナナ
251Name_Not_Found:2005/12/16(金) 14:03:38 ID:tI4A2zdK
初心者ですいません。

CSSでボックスを作りheightを指定して上下にborderを入れた場合、
IEですとheight内にborderの幅が収まるのですが、Firefoxですと
height+borderの幅というふうになってしまいます。
これをどのように回避すればよろしいでしょうか?
252Name_Not_Found:2005/12/16(金) 14:04:32 ID:???
IEのバグだからハック汁
253Name_Not_Found:2005/12/16(金) 14:10:16 ID:???
>>251 FAQ既出。>>6見なさい。
254Name_Not_Found:2005/12/16(金) 14:51:04 ID:???
>>251
ttp://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_situation.html
DOCTYPEで標準モードにすれば、IEもheight+borderの正しい動きになってくれる。
255Name_Not_Found:2005/12/16(金) 14:52:01 ID:???
>>254
6からはね
256Name_Not_Found:2005/12/16(金) 14:52:39 ID:???
5.5以下なんてクソ以下のIEの話はしなくていいんジャマイカwww
257Name_Not_Found:2005/12/16(金) 15:18:01 ID:???
FireFoxも糞以下
258Name_Not_Found:2005/12/16(金) 15:24:36 ID:tI4A2zdK
>>254
ありがとうございます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
を入れてみたらFirefoxと同じ表示になりました
259Name_Not_Found:2005/12/16(金) 16:10:25 ID:???
>>258
リンク先見たかー!
それじゃ不十分だぞ、ちゃんとシステム識別子入れろー!
260Name_Not_Found:2005/12/16(金) 16:20:23 ID:???
>>259
互換モードになるだけだから、別に良いだろ。
古いブラウザでも同じ表示になるんだし。
261Name_Not_Found:2005/12/16(金) 16:44:07 ID:???
>>260
ちゃんと流れを読めや
262Name_Not_Found:2005/12/16(金) 19:54:31 ID:???
>>261
空気を嫁屋
263Name_Not_Found:2005/12/16(金) 20:03:09 ID:???
オマエガナー
264Name_Not_Found:2005/12/16(金) 20:25:05 ID:???
>>263
オマエモナー
265Name_Not_Found:2005/12/16(金) 20:30:15 ID:???
オマイモナー
266Name_Not_Found:2005/12/16(金) 20:37:13 ID:???
モマエモナー
267Name_Not_Found:2005/12/16(金) 20:45:32 ID:5m9b6ZKJ
http://www.ctscan.jp/
すごく重いんだけどなんで????
やっぱCSSが原因?
268Name_Not_Found:2005/12/16(金) 20:52:24 ID:???
全然重くない
269Name_Not_Found:2005/12/16(金) 21:49:09 ID:???
>>267
Javascriptが原因。
270Name_Not_Found:2005/12/16(金) 22:24:46 ID:???
>>267
0.5秒くらいで表示されたが。
おまいのPCか回線がしょぼすぎるんじゃね?
271Name_Not_Found:2005/12/16(金) 23:41:50 ID:???
>>270
うせろカス
272Name_Not_Found:2005/12/17(土) 00:05:06 ID:???
>>271
新しいマシン買えや
273Name_Not_Found:2005/12/17(土) 00:13:49 ID:???
>>267
ダイヤルアップ28kでクラシックペンティアムだろwwwww
274Name_Not_Found:2005/12/17(土) 00:31:39 ID:???
486DXはいい石だった
275Name_Not_Found:2005/12/17(土) 01:02:07 ID:???
へ へ
の の
 も
 < カスが馴れ合うスレはここですか?
276Name_Not_Found:2005/12/17(土) 01:15:50 ID:???
277Name_Not_Found:2005/12/17(土) 07:25:49 ID:???
>>267は、自分のPCがそれほどしょぼかったのかと
打ちのめされました。
しかし負けず嫌いの>>267は、必死で罵声を
飛ばすことで意地を張ろうとしましたが、
結局は自演を見破られ、むなしくそのスレを去りましたとさ。
278Name_Not_Found:2005/12/17(土) 07:55:26 ID:???
ちゃんちゃん
279Name_Not_Found:2005/12/17(土) 13:40:22 ID:???
かすいけスレ落ちたの?
280Name_Not_Found:2005/12/17(土) 13:54:38 ID:???
>>279
落ちたみたいだ。


・Web制作初心者用質問スレッド
・CSSでイケてるデザインサイト

携帯からどっちか立ててみるか・・・
●持ちの人よろしく。
281Name_Not_Found:2005/12/17(土) 13:56:39 ID:5q2vIVap
tdやddを、リストのように■を付けたいと思っています。
(2行にわたってもあたまの■の後に文字がくるように)

いろいろやってみましたがうまくいきません。
できないものなのでしょうか…。
282Name_Not_Found:2005/12/17(土) 14:00:26 ID:???
>>280
自己レスだけど、スレ立て代行スレで頼んでおいた。
283Name_Not_Found:2005/12/17(土) 14:03:02 ID:???
>>281
display:block
284Name_Not_Found:2005/12/17(土) 15:19:26 ID:???
list-item
285Name_Not_Found:2005/12/17(土) 15:43:31 ID:???
>>284
リストじゃねーよ!
286Name_Not_Found:2005/12/17(土) 16:51:46 ID:???
>>281
IEにも適用させようとするなら、テーブルレイアウトがいいと思うよ。
CSSだけだとまたIEがね・・・
287初心者マーク10個必要な人:2005/12/17(土) 17:28:54 ID:IvSkoIfv
ブログ全体が、画面左によってしまいます。
マージンを0pxにしたり、
マージンライト0pxにしても、変わりません。
どうしても、左によっているのが不細工なので何とかしたいです。
ご教示お願いします<(_ _)>
288Name_Not_Found:2005/12/17(土) 17:31:37 ID:???
>>287
中央揃えにしたいってこと?
289Name_Not_Found:2005/12/17(土) 17:33:12 ID:???
元々表示していた線あり表の情報を線なしにして表示しようと
考えているのですが、以下のソースだと
<p>と<td>の(「な」と「あ」の)左位置が異なっているのですが
合わせる事は可能でしょうか?

table.sample3
{margin: 0px;padding: 0px;}
tr.sample3
{margin: 0px;padding: 0px;}
td.sample3
{margin: 0px;padding: 0px 10px 0px 0px;}

<p>なんちゃらかんちゃら組み合わせは以下</p>
<table class="sample3" summary="test">
<tr class="sample3"><td class="sample3">あああ</td><td class="sample3">いいい</td></tr>
</table>
290初心者マーク10個必要な人:2005/12/17(土) 17:37:12 ID:IvSkoIfv
>>288
そうです。
291Name_Not_Found:2005/12/17(土) 17:42:20 ID:???
>>286
机厨氏ね!
292Name_Not_Found:2005/12/17(土) 17:42:56 ID:???
>>290
どこのブログ?
293Name_Not_Found:2005/12/17(土) 17:47:23 ID:???
このままだとエスパーを呼ぶしかないな・・・・
294初心者マーク10個必要な人:2005/12/17(土) 17:47:26 ID:IvSkoIfv
>>292
269gです。
書く必要あるかわからないけど、一応、わかっていることを書いておきます。
269gはシーサーのシステムを使っています。
シーサーでやっていたときも同じでした。
3カラムです。
どこかのブログで、中央ぞろえか、左か右かと選べるようになっていましたが、
269g、シーサーは選べません。
295Name_Not_Found:2005/12/17(土) 17:55:27 ID:???
>>291
表厨…………………?
296Name_Not_Found:2005/12/17(土) 18:25:02 ID:???
>>287
先生、テンプレは見てくださいましたか・・・・
マージンは左右共に標準モードでautoですよ。
297Name_Not_Found:2005/12/17(土) 18:31:42 ID:???
>>289
table{border-spacing:0;}
298初心者マーク10個必要な人:2005/12/17(土) 18:43:02 ID:IvSkoIfv
>>296
どこにautoと入れるのでしょうか・・・
299Name_Not_Found:2005/12/17(土) 18:46:25 ID:???
うーん・・・
300Name_Not_Found:2005/12/17(土) 18:50:11 ID:???
>>298
全体を囲うコンテナブロックに対してmargin:auto;
これで理解できなかったら、上のテンプレ一通り呼んで再勉強したほうがいいかも。
301Name_Not_Found:2005/12/17(土) 19:25:40 ID:???
281です。

display:block
はやってみたんですがダメだったんです。

>>286
IEで確認したから適応されていなかったのでしょうか。
IEのバグってことですか。


302Name_Not_Found:2005/12/17(土) 19:27:47 ID:???
>>301
いや、IEがこれに対応してないだけ
ttp://www.swlab.it.okayama-u.ac.jp/man/rec-css2/generate.html
303Name_Not_Found:2005/12/17(土) 21:53:13 ID:???
>>298
body { text-align:center; }
#container { margin:auto;
        text-align:left; }
この3つの要素を入れれば何とかなるはず。
304Name_Not_Found:2005/12/17(土) 23:34:41 ID:???
>>303
text-align:center;
初心者スレならともかく
このスレでそういう間違いを教えるのはどうかと
305Name_Not_Found:2005/12/17(土) 23:42:37 ID:yXmAmtfV
306Name_Not_Found:2005/12/18(日) 00:07:27 ID:???
('A`)
307Name_Not_Found:2005/12/18(日) 00:22:58 ID:???
308Name_Not_Found:2005/12/18(日) 00:33:59 ID:???
>>307
ありがとうございました
309Name_Not_Found:2005/12/18(日) 01:04:31 ID:???
>>304
じゃあ正しい答えは?
310Name_Not_Found:2005/12/18(日) 01:07:02 ID:???
つ【テンプレ】
311Name_Not_Found:2005/12/18(日) 01:08:27 ID:???
>>309
text-alignはブロック要素の位置を定めない。
よって正解は>>296
312Name_Not_Found:2005/12/18(日) 01:50:07 ID:???
だから、馬鹿(IE)に合わせる必要があるわけで。
313Name_Not_Found:2005/12/18(日) 01:52:55 ID:???
バカも一応標準モードくらいはあるんだよ
314Name_Not_Found:2005/12/18(日) 02:00:55 ID:???
つーことは、俺が標準語をしゃべれるのと同じだな?
315Name_Not_Found:2005/12/18(日) 02:05:59 ID:???
そうそう。
ってンなはずあるかいっ!
316Name_Not_Found:2005/12/18(日) 02:07:51 ID:???
んにゃぁ
317Name_Not_Found:2005/12/18(日) 09:15:00 ID:???
IE5.5以前は margin:auto; が効かない。
318Name_Not_Found:2005/12/18(日) 09:47:52 ID:???
>>317
margin-left:auto;
margin-right:auto;
319Name_Not_Found:2005/12/18(日) 10:30:34 ID:???
IE5.5ww
320Name_Not_Found:2005/12/18(日) 16:19:48 ID:???
>>317
NN4でもmargin:autoが効きません!><
321Name_Not_Found:2005/12/18(日) 16:59:41 ID:???
スレ違いかもしれませんが
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
これって標準モード?
322Name_Not_Found:2005/12/18(日) 17:06:33 ID:???
>>321
あのな、3年ロムってろ。
323Name_Not_Found:2005/12/18(日) 17:20:24 ID:???
324Name_Not_Found:2005/12/18(日) 18:50:57 ID:???
リストそのものををfloat:left出来ませんか?
divで括らないと駄目?

・あああ ・いいい
・あああ ・いいい

<ul>
<li>あああ</li>
<li>あああ</li>
</ul>
<ul>
<li>いいい</li>
<li>いいい</li>
</ul>

ul{
width: 45%;
float: left;}
325Name_Not_Found:2005/12/18(日) 18:51:45 ID:???
>>324
なんで?
326324:2005/12/18(日) 18:55:47 ID:???
>>325
当方マカですが、324のソースではfloatしてくれません。
divでulを囲めば、かろうじて成功。
リストはfloatするものかどうか知りたかったので。
327Name_Not_Found:2005/12/18(日) 19:18:14 ID:???
>>326
WinのFirefoxでは綺麗にfloatしたよ。環境のせいじゃないかな。
バグリストで探してみたら。
http://cssbug.at.infoseek.co.jp/
328324:2005/12/18(日) 19:33:21 ID:???
>>327
thxです。
やっぱりIEでもNCでも駄目でした。
理屈ではフロート出来るはずなのに、変だなーと思ったので。
phpで作っているので、macにだけdivで囲むよう指定してみます。
329Name_Not_Found:2005/12/18(日) 19:42:37 ID:???
>>322
回答者ならともかく、質問者に3年ROMって…w
330Name_Not_Found:2005/12/18(日) 21:12:04 ID:4yIGxWki
CSSで右クリック&ドラッグ禁止の指定ってできますか?

JavaScriptでの
oncontextmenu="return false;"
onselectstart="return false;"
みたいなやつです。
331Name_Not_Found:2005/12/18(日) 21:13:17 ID:???
釣りは余所でやれ
332Name_Not_Found:2005/12/18(日) 21:19:38 ID:???
>>330

できるよ。教えてやるから、ケツの穴をまずかせ。
333Name_Not_Found:2005/12/18(日) 21:36:55 ID:???
>332
嫌です
334Name_Not_Found:2005/12/18(日) 23:00:31 ID:???
>>320
できない。
ていうかCSSの成立意味に反する。
335Name_Not_Found:2005/12/18(日) 23:00:42 ID:???
Strictの標準モードでhtmlを作成しました。
CSSで
* {
margin: 0;
padding: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
とやってみたのですが
divブロックのwidthを指定すると
borderやpaddingの幅が含まれません。
divブロックの幅+border幅+padding幅といった感じになります。

どこが間違っているのか分かりません。
希望としてはdivブロックの幅=要素+border幅+padding幅といったようにしたいです。

よろしくお願いします。
336Name_Not_Found:2005/12/18(日) 23:10:43 ID:???
標準モードになってないです
337Name_Not_Found:2005/12/18(日) 23:11:30 ID:???
まちがった。標準モードになっています。
338Name_Not_Found:2005/12/18(日) 23:12:59 ID:???
339Name_Not_Found:2005/12/18(日) 23:14:27 ID:???
>>335
box-sizingが入ってる時点で(+moz)が入ってる時点でIE以外はOKなはずだけど・・・
どっか書き方間違ってないか?
340335:2005/12/18(日) 23:18:42 ID:???
>>339
後出しでスミマセン。確認した環境はIE6.0です。

IEでもOKにする方法を教えてください。
341335:2005/12/18(日) 23:20:49 ID:???
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html401/strict.dtd">
↑Strictの標準モードはこれでいいんですよね?
342Name_Not_Found:2005/12/18(日) 23:28:38 ID:???
>>341
IE標準モードでbox-sizingはStrictな方法では存在しない。
正規のbox計算で慣れといたほうがいいか
IEは互換モードでその他はbox-sizingにしといたほうがいい。
343Name_Not_Found:2005/12/18(日) 23:40:36 ID:???
タグに括られていないテキストだけを装飾するにはどうすればいいのでしょうか?
344Name_Not_Found:2005/12/19(月) 00:00:17 ID:???
>>343
テキストの内容を正規表現で検索するスクリプトをOK。
345Name_Not_Found:2005/12/19(月) 00:13:48 ID:???
>>342
了解です。ありがとうございました。
346Name_Not_Found:2005/12/19(月) 01:14:24 ID:???
>>344
で、どうすんだよ、低脳。
そういう抽出操作の後、タグ付けせずにCSS装飾できますか、という質問かもしれないだろ。
347Name_Not_Found:2005/12/19(月) 01:22:57 ID:???
>>346
で、どうすんだよ低脳。
おまえがタグづけせずにCSS装飾できる方法を教えろよwww
348Name_Not_Found:2005/12/19(月) 02:52:51 ID:ckM/OVLl
>>347
全ての要素はbodyのなかだ
body{}にかけばいいだろコンボイ
349Name_Not_Found:2005/12/19(月) 03:01:31 ID:???
>>348
時々でいいから head, title {display:block;} のことを思い出してあげてください
350Name_Not_Found:2005/12/19(月) 13:14:30 ID:dxAyHPSG
初心者ですいません。

テキストリンクのCSS装飾を2種類欲しいのですが、
CSSでどのように装飾すればいいのでしょうか?
idやclassでできるのでしょうか?
351Name_Not_Found:2005/12/19(月) 13:24:14 ID:???
>>350
無理だと思います。
テキストリンクの装飾を複数欲しい場合は、
Javascriptなどの言語を使う必要が有ります。
352Name_Not_Found:2005/12/19(月) 13:56:18 ID:ckM/OVLl
>>350
.hoge a:link{color="#D50000"}
.hage a:link{color="#0000D5"}


<ul>
<li class="hoge"><a href="http://yahoo.co.jp/">Yahoo</a></li>
<li class="hage"><a href="http://google.co.jp/">google</a></li>
</ul>
353Name_Not_Found:2005/12/19(月) 14:37:46 ID:dxAyHPSG
>>352
すいません。こういうことでしょうか?
これだとうまく表示されないようです。

.hoge a:link {
color: #FF9933;
}
.hoge a:visited {
color: #FF9933;
}
.hoge a:hover {
color: #FF9933;
}
.hoge a:active {
color: #FF9933;
}

.hage a:link {
color: #666666;
}
.hage a:visited {
color: #666666;
}
.hage a:hover {
color: #666666;
}
.hage a:active {
color: #666666;
}

<a class="hoge" href="http://yahoo.co.jp/">Yahoo</a>
<a class="hage" href="http://google.co.jp/">google</a>
354Name_Not_Found:2005/12/19(月) 16:41:51 ID:???
355Name_Not_Found:2005/12/19(月) 16:45:29 ID:???
>>353
基本を勉強しなさい
そのHTMLの場合は
a:link.hoge
356Name_Not_Found:2005/12/19(月) 17:25:23 ID:dxAyHPSG
>>355
できました。ありがとうございます。
>>352はなんだったんでしょう
357Name_Not_Found:2005/12/19(月) 17:33:49 ID:???
>>356
いわゆる釣りってやつ
358Name_Not_Found:2005/12/19(月) 18:14:26 ID:???
>>356
だから基本を覚えろって。
>>352は正しい。
>>357はアホ
359Name_Not_Found:2005/12/19(月) 19:04:47 ID:2QmKv3U+
初心者ですが、大至急で商用HPを作っています。
レンタルサーバー屋のフォーマットにHTMLを打ち込んでも、なんかタグの通りにならないと思って
問い合わせたら、「共通CSSです。」と言われました。
何がしたいかと言うと、文章の一部にリンクを入れました。その部分の文字だけ色が変わるとか
下線が付くとか見て、ここにリンクがあるとわかる様にしたいのです。
どうタグを打ったらよろしいですか?
また、GoLiveを持っております。面倒な時はGoLiveでとりあえず作って、
HTMLソース画面をコピーして他に移しております。CSSでもそれが出来そうなのですが、
マニュアルを読んでもわかりませんでした。
どなたか詳しい方アドバイスを下さい。宜しくお願い致します。
360Name_Not_Found:2005/12/19(月) 19:10:12 ID:???
>>359
インラインで書けば?
361359:2005/12/19(月) 19:22:01 ID:2QmKv3U+
>>360
ありがとうございます。
しかし、インラインで書くとはどういうことなのでしょうか?
たぶん基本的なことなのでググツたのですが、スケートの内容になってしまいます。
度々すみませんが、また教えて下さい。
362Name_Not_Found:2005/12/19(月) 19:30:42 ID:Q1Fgok6p
インラインフレームで読み込む形のこといってるんじゃない。
363Name_Not_Found:2005/12/19(月) 20:02:47 ID:???
>ググツたのですが、スケートの内容になってしまいます。
わろた
364359:2005/12/19(月) 20:04:25 ID:jtOtsdyj
質問してみたものの、皆様のアドバイスについていけないです。
もうちょっと勉強してから出直します。
365Name_Not_Found:2005/12/19(月) 20:10:05 ID:Q1Fgok6p
役に立つかどうか分からないけど、これのことね。
http://www.tagindex.com/html_tag/frame/iframe2.html
366359:2005/12/19(月) 20:19:46 ID:jtOtsdyj
>>365
ご親切にどうもありがとうございます。
HPを自分で作るのは10年早い気がします。
よく勉強してみます。
367Name_Not_Found:2005/12/19(月) 20:30:30 ID:WPsqHsxy
縦方向に中央配置するにはどうしたら
368Name_Not_Found:2005/12/19(月) 20:43:45 ID:???
「インラインで書け」でなんで「インラインフレーム」がでてくるんだ?
知識もねーくせに回答すんな
369Name_Not_Found:2005/12/19(月) 20:45:09 ID:Q1Fgok6p
{ vertical-align: middle } でいいんでない。
370Name_Not_Found:2005/12/19(月) 21:03:01 ID:???
>>362
面白いね、君。5点くらいかな?
371Name_Not_Found:2005/12/19(月) 21:04:32 ID:???
ラベル低いな。
372Name_Not_Found:2005/12/19(月) 21:23:57 ID:???
divの外側に1emでmarginを取っているのですが
IEとFFでサイズ(幅)が異なります。

これは仕様なのでしょうか?
それとも特殊なバグですか?
373Name_Not_Found:2005/12/19(月) 21:30:49 ID:???
DOCタイプは?
374Name_Not_Found:2005/12/19(月) 21:31:52 ID:???
>>372
1em=1文字の高さ。
デフォルトの文字の大きさが元々人によっても違うんだからさ。
375372:2005/12/19(月) 21:33:58 ID:???
>>373
ストリクトのdtd付きです。
376Name_Not_Found:2005/12/19(月) 21:36:25 ID:WPsqHsxy
初歩ですいません。
emって絶対指定か相対指定のどちらなんでしょか
377Name_Not_Found:2005/12/19(月) 21:39:55 ID:???
直ぐ上も読めないのか?
378Name_Not_Found:2005/12/19(月) 22:05:39 ID:???
>>377
質問者は俺達みたいにスレにはりついていないからな。
379Name_Not_Found:2005/12/19(月) 22:07:56 ID:???
>>378
インラインフレームで読み込む形のこといってるんじゃない。
380Name_Not_Found:2005/12/19(月) 22:34:42 ID:???
>>376
>>>374
相対
381Name_Not_Found:2005/12/19(月) 22:49:43 ID:???
質問です
header領域内にh1を入れてマージン指定をしています。
左のマージンは良いのですが上のマージンを指定すると
ie6ではちゃんとh1のみが移動してるのですが、ffやnnだとheaderの背景も移動してしまいます。
これはバグなんでしょうか?
対処法を教えてください。
382381:2005/12/19(月) 22:53:16 ID:???
間違えました。
headerの背景ではなくheader自体が移動してしいます。
例えば上のマージンを10pxとするとheader自体が上から10pxの位置に表示されます。
そしてh1はheaderの一番上に表示されるって感じです
383Name_Not_Found:2005/12/19(月) 22:55:30 ID:???
何の要素に対してmarginを指定してるの?
384Name_Not_Found:2005/12/19(月) 23:01:32 ID:???
>>381
ソース出せ。
多分IEのほうがオカシイとは思うが、その程度の書き方じゃ推測しかできん。
385381:2005/12/20(火) 00:16:19 ID:???
>>383
h1です
386381:2005/12/20(火) 00:21:44 ID:???
>>384
#header {
width: 760px;
background-image: url(img/headback.jpg);
background-repeat: no-repeat;
position: relative;
margin: 0px;
padding: 0px;
height: 80px;
}
h1 {
margin-left: 30px;
margin-top: 20px;
}
って感じです。
387Name_Not_Found:2005/12/20(火) 00:23:15 ID:???
>>386
HTMLは
<div id="header">
<h1>ちゃらら</h1>
</div>
って感じ?
388Name_Not_Found:2005/12/20(火) 00:30:09 ID:???
>>386

なんで、position: relative; してんの?
389Name_Not_Found:2005/12/20(火) 00:30:47 ID:???
>>386
Win2kのFxとN7共に確認できず。
むしろIEのが、margin-topを大きく取ってもそれに合わせてheaderが伸びてしまう
よくあるバグが見られた。
390381:2005/12/20(火) 00:53:52 ID:???
>>387
そうです。
>>388
他の物を絶対配置でheader内に置く為です。
>>389
そうですか。。。もう一度やり直してみます。
391381:2005/12/20(火) 01:20:54 ID:???
余計な要素を全てはずして最初から作り直してみたけど変らなかったです。
ちなみにoperaでもffとかと同じになるのでIEが違うんだと思うのですが。。。
何処が間違っているのかまったくわかりません。
392359:2005/12/20(火) 01:24:06 ID:kvaBVs5C
! ! ! 内部CSSのことを「インライン」と言っていたんですね。
なんとかGoLiveで内部CSSのページを出すまでは出来たのですが、
ソースのページに行くとHTMLと変わりがなかったです。
何か根本が違ったんだと思います。
また勉強してきます。
お邪魔しました。
393Name_Not_Found:2005/12/20(火) 01:27:57 ID:???
>>390
>他の物を絶対配置でheader内に置く為です。
他の物ならheaderに入れなくてよいのでは?
z-indexの問題かな?
relativeの時って
top:0px;
left:0px;
とかっていれなくてよいの?
positionって使ったことないからわからんのだが
394Name_Not_Found:2005/12/20(火) 01:30:30 ID:???
>>391
えーっと、つまりFxでもOperaでも、
h1のマージントップでヘッダーのマージンが設定されてしまうってことでいい?
だとしたらそれは確かにおかしいんだが・・・
395Name_Not_Found:2005/12/20(火) 01:32:23 ID:???
>>393
入れなければ自然とtop:0;left:0;になる。
position:absoluteのdivをdivの中に設定するとき、
親divをrelativeにするのとしないとで動作が変わってくるんだよ。
396Name_Not_Found:2005/12/20(火) 01:39:24 ID:???
>>395
なるほど。
勉強になったサンクス
397381:2005/12/20(火) 02:10:56 ID:???
>>394
はい。そういうことです。

一応positionなどはとりあえずなくして作り直したんですがかわりません。
398Name_Not_Found:2005/12/20(火) 02:16:50 ID:???
>>397
一応こっちで症状の出なかったソース↓
これでダメだったらおまいの環境が不思議・・・

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html401/strict.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>テスト</title>
<style type="text/css"><!--
*{margin:0;padding:0;border:solid 1px #0f0;}
#header {width: 760px; background-image: url(bg.png); background-repeat: no-repeat; position: relative;
margin: 0px; padding: 0px; height: 80px; }
h1 {margin-left: 30px; margin-top: 100px; }
--></style>
</head>
<body>
<div id="header">
<h1>ちゃらら</h1>
</div>
</table>
</body>
</html>
399Name_Not_Found:2005/12/20(火) 02:32:16 ID:???
>>398
</table>ってなんでいるの?
400Name_Not_Found:2005/12/20(火) 02:38:30 ID:???
ごめんゴミorz
401381:2005/12/20(火) 03:01:28 ID:???
>>398
ありがとうございます。今試して見ましたが、確かにこれならOKでした。
ただユニバーサルセレクタのborder:solid 1px #0f0;を無くすと同じになってしまいます。
線無しにするにはどうしたらよいでしょう?
402Name_Not_Found:2005/12/20(火) 03:10:31 ID:???
>>401
!!
マジだすまん、気付かなかった。確かになるわ。
線を消したいだけなら
border:solid 1px transparent;
でいいけど、根本的な解決じゃないな、これ。
403Name_Not_Found:2005/12/20(火) 03:12:20 ID:???
あとスマン、限界なんで寝る・・・
404Name_Not_Found:2005/12/20(火) 06:05:37 ID:???
>>403 border-colorのtransparentはWinIEその他で非対応なので不可。
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/box.html#border-color
405Name_Not_Found:2005/12/20(火) 07:16:12 ID:???
不可ww
406Name_Not_Found:2005/12/20(火) 07:34:33 ID:???
ワラタ
407Name_Not_Found:2005/12/20(火) 10:56:16 ID:rmEitWVo
ちょっと教えてほしいのですが
テーブルのborder,cellspacing,cellpadding等のオプションを
CSSに入れる方法はありませんでしょうか?

また、フォーム関係のonclick=等のjavascriptの動作を入れる事は・・・
できないですよねぇ??

重複するので何かスマートな方法はありませんでしょうか?
408Name_Not_Found:2005/12/20(火) 10:58:58 ID:???
cssで小作りできますか?

headerがまるごと動いちゃう現象は
safariでも起きました。
divだからだねきっと
409Name_Not_Found:2005/12/20(火) 11:12:52 ID:???
410Name_Not_Found:2005/12/20(火) 11:13:52 ID:???
HTML でのレイアウト指定の、 CSS での指定との対応表
http://deztec.sakura.ne.jp/x/01/tips/page/p0037.html#table
411Name_Not_Found:2005/12/20(火) 12:49:54 ID:rmEitWVo
>>409 ありがとうございました。
412Name_Not_Found:2005/12/20(火) 17:08:59 ID:???
>>404
それって複数指定にしなきゃいいだけじゃwww
413Name_Not_Found:2005/12/20(火) 17:34:49 ID:???
すみません、IEのスタイルシートで、
font-familyで英字フォントを含むよう指定したら
font-sizeの指定を無視するのですが、どうすれば指定を認識してくれますでしょうか?
(例)
.text10B {
font-family: "Century", "MS ゴシック", "Osaka−等幅";
font-size: 10px;
}
とすると
<span class="text10B">sitemapはこちら</span>
が、Firefoxでは正常に見えるが、IEだと指定を無視する
という状態になります。
414Name_Not_Found:2005/12/20(火) 17:39:49 ID:???
質問する時はメール欄を空白にしろって書いてあるだろ。
415Name_Not_Found:2005/12/20(火) 17:39:58 ID:???
>>413
それをコピってWin2000 IE6でも正常に動作を確認。
多分他のトコの指定とコンクリフトを起こしてると思われ。
416415:2005/12/20(火) 17:42:06 ID:???
あ、ゴメン、嘘吐いたかも。
それ、12pxだとならないでしょ。
確か10、11px程度だとおかしくなるバグがあったと思う。
そんな小さな文字を使うなってことで納得してくれorz
417Name_Not_Found:2005/12/20(火) 20:21:23 ID:???
418Name_Not_Found:2005/12/20(火) 20:24:25 ID:???
>415
本題とまるで関係ないけど 「コンフリクト」な
もしこれが2ch用語なんだったら 野暮を謝る
419Name_Not_Found:2005/12/20(火) 20:57:18 ID:???
>>417
ん?
border-color-*/border-style-*/border-width-*
で全部分けたらWinIEでOKだったぞ。
420Name_Not_Found:2005/12/20(火) 21:37:52 ID:???
そんな2ch用語聞いたこと無いよ
421Name_Not_Found:2005/12/20(火) 21:45:46 ID:???
IEってうっといね。
422Name_Not_Found:2005/12/20(火) 21:49:34 ID:???

【IT】マイクロソフト、Mac版IEのサポートを打ち切りへ [12/20]
http://news18.2ch.net/test/read.cgi/bizplus/1135063085/l50
423Name_Not_Found:2005/12/20(火) 21:51:44 ID:cSiw3wCt
すみません。
テーブルのセルにリンクを置いた時、セルの空白の部分にもカーソル反応させたくて
a{display: block;}
とスタイルシートで設定したのですが、
<table border>
<tr><td width=100><a href=#>aaa</a></td></tr>
<tr><td width=100><a href=#>bbb</a></td></tr>
<tr><td width=100><a href=#>ccc</a></td></tr>
</table>
上記のような縦に連続したセルの場合、Firefoxだと正常に反応するのですが、
IEだと2段目以降反応しなくなります。
これはIEのバグなのでしょうか?
424Name_Not_Found:2005/12/20(火) 22:05:06 ID:???
A! display-mode::brock;
425Name_Not_Found:2005/12/20(火) 22:13:48 ID:???
>>423
うん。
tdの幅が100pxなら、aにもwidth:100px;を指定汁。
426Name_Not_Found:2005/12/21(水) 01:55:21 ID:???
うそこけ。>>419
WinIE6で確認したが、枠線は文字色になり、透明にならんぞ。
div {
border-width:10px;
border-style:solid;
border-color:transparent;
color:blue;
}
<div>透明ボーダー</div>
427Name_Not_Found:2005/12/21(水) 02:06:38 ID:???
>>426
横から口を出すが、419はハイフン*なんだから
border-color-top(その他四方向)を言っていると思われ
428Name_Not_Found:2005/12/21(水) 02:43:19 ID:???
>>418
誤字orz
429Name_Not_Found:2005/12/21(水) 02:56:43 ID:???
>>427
border-color-topって……正しくはborder-top-colorだろ。
でも、同じこと。下記を試してもボーダーは透明ではなく文字色のまま。
div {border:10px solid red; color:blue;}
.transp {
border-top-width:10px;
border-top-style:solid;
border-top-color:transparent;
}
<div>ボーダー</div>
<div>透明ボーダー</div>
430Name_Not_Found:2005/12/21(水) 03:00:31 ID:???
429訂正。
<div>ボーダー</div>
<div class="transp">透明ボーダー</div>

ま、WinIEのborderではtransparentが効かないのには変りない。
431Name_Not_Found:2005/12/21(水) 03:47:33 ID:???
>>427>>429
で、おまえらのその議論が>>381の一体何の役に立つのかと。
432Name_Not_Found:2005/12/21(水) 04:04:55 ID:???
>>431 これで>>402が全く役に立たないことだけは明らかになった。
433Name_Not_Found:2005/12/21(水) 09:35:57 ID:???
久しぶりに来てみた。なんだこれは!
がんばって検証や回答してるのはいいんだけどラベルが・・・
質問者が可哀想になってくるぜ!
434Name_Not_Found:2005/12/21(水) 12:45:01 ID:???
結局381が解決してない件
そして俺も解決できない件
435Name_Not_Found:2005/12/21(水) 12:50:41 ID:???
padding で解決するようなことが解らんの?
436Name_Not_Found:2005/12/21(水) 13:19:28 ID:???
<div id="nodisplay">テスト</div>

#nodisplay{display:none;}

で上記の「テスト」は表示されなくなりますが、ソースを見ると
記述はあります。やはり表面上で見えにくくするだけで
CSSのみでソース表示もしない方法はないのでしょうか?
437Name_Not_Found:2005/12/21(水) 13:27:02 ID:???
<head>
<style>dt {font-family: courier new;color: #aaaaff;border-bottom: #cccccc 1px dotted;}
dd {border: #cccccc 0px dotted;}
dd dt {float: left;width: 30px;}</style></head>
<body>
<dt>A</dt>
<dd>aaaaaaaa</dd>
<dd>
<dl><dt>A1</dt><dd>BBBBBBBBBBBB</dd>
<dt>A2</dt><dd>CCCCCCCCCCCC</dd>
<dt>A3</dt><dd>DDDDDDDDDDDD </dd></dl>
</dd>
</body>
</html>

上のソースでA1〜A3を縦に並べたいんですが、どうやってもフォントサイズによってはズレてしまいます。
dtセレクタをコメントアウトするとOKなのですが・・・。
どうしたらきちんと並べられますか?
438Name_Not_Found:2005/12/21(水) 13:29:54 ID:???
>>437
フォントサイズを固定すれば良い
439Name_Not_Found:2005/12/21(水) 13:32:52 ID:???
>>436
書かなきゃいいんだよ。
440Name_Not_Found:2005/12/21(水) 16:05:45 ID:???
>>436
画像にする。
441Name_Not_Found:2005/12/21(水) 16:25:34 ID:wuoclF2x
<form>
<input type="image" border="0" name="imageField2" src="img/yes.gif" width="110" height="38">
</form>
<form>
<input type="image" border="0" name="imageField2" src="img/no.gif" width="110" height="38">
</form>

というソースで、ボタン画像を二つ横並びにした上で右寄せにしたいのですが、良い手段は無いでしょうか。そのままだと折り返して2行になってしまいます。
442441:2005/12/21(水) 16:43:11 ID:wuoclF2x
>>441
yes.gifにstyle="float:left"をかけると1行にはなってくれるのですが、
左寄せになってしまいます。
ものすごく簡単な事でつまづいてて申し訳無いですが、
よろしくご指導お願いいたします。
443Name_Not_Found:2005/12/21(水) 16:46:18 ID:???
floatを知っていて、ま〜じんを知らないのかい?
444441:2005/12/21(水) 16:49:36 ID:wuoclF2x
>>443
marginをどうかけてやれば1行右寄せになるでしょうか…。
ホントにアフォで申し訳無いですが、ヒントplz
445Name_Not_Found:2005/12/21(水) 16:53:01 ID:???
ググる気がないなら帰れ!
446441:2005/12/21(水) 17:26:08 ID:???
自己解決しました。
スレ汚し失礼いたしました。
447Name_Not_Found:2005/12/21(水) 17:52:03 ID:???
448Name_Not_Found:2005/12/21(水) 17:55:13 ID:???
>>441
CSS以前に、form直下にはブロック要素しか許されてないから
そのHTMLは間違っているわけだが。
449Name_Not_Found:2005/12/21(水) 18:16:12 ID:???
???
450Name_Not_Found:2005/12/21(水) 18:59:43 ID:???
仕様書読んでない香具師多いのか

<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->

正しくCSSを適用させるには正しいHTMLから
451Name_Not_Found:2005/12/21(水) 19:35:15 ID:???
??????????????????????????????????????????
452Name_Not_Found:2005/12/21(水) 19:36:58 ID:???
>>447
何とかなりました。どうもありがとうございました。
453Name_Not_Found:2005/12/21(水) 19:52:06 ID:???
>>448
Transitionalな場合もあるから
454Name_Not_Found:2005/12/21(水) 20:06:54 ID:???
Transitionalだろうがインラインをbodyの下に置くような書き方してる奴は(ry
455Name_Not_Found:2005/12/21(水) 20:23:57 ID:???
別にどういうHTMLを書いててもいいが
そういうHTMLにCSSを被せるのは至難の業・・・
456Name_Not_Found:2005/12/21(水) 21:03:49 ID:???
idとclass振りまくりでwww
457Name_Not_Found:2005/12/21(水) 21:56:04 ID:???
>>454
質問理解してる?
458Name_Not_Found:2005/12/21(水) 22:08:46 ID:???
>>457
理解してる奴が答えたら?
459Name_Not_Found:2005/12/21(水) 22:08:56 ID:???
>>454
信者乙
460Name_Not_Found:2005/12/21(水) 22:15:18 ID:???
ぁぁ  ラベルが・・・
461Name_Not_Found:2005/12/21(水) 22:15:53 ID:???
つーか100%CSS装飾やってると、単純に効率の問題でストリクターになる罠
462Name_Not_Found:2005/12/21(水) 22:19:23 ID:???
>>381
marginではなくpaddingで指定する。

これ1.5になってから出始めた症状のような気がするが、
前バージョン持ってる香具師検証頼む。
463Name_Not_Found:2005/12/21(水) 22:20:37 ID:???
>>460
Strict信者乙
464Name_Not_Found:2005/12/21(水) 23:12:29 ID:???
>>462
>>435で出ている
465Name_Not_Found:2005/12/22(木) 00:00:18 ID:???
>>461
ならない。
趣味でクラシカルなほうむぺいじ作ってるだけのおまえといっしょにするなという声が聞こえてきそうだ。
466Name_Not_Found:2005/12/22(木) 00:42:21 ID:???
CSS使っててクラシカルもクソもない罠
467Name_Not_Found:2005/12/22(木) 01:37:30 ID:???
>>465
クラシカルでレガシーなホームページというと、StrictよりTransitionalだと思うんだが。
企業もこの頃SEOSEOうるさいしなあ。
468Name_Not_Found:2005/12/22(木) 01:40:34 ID:???
企業の担当が言ってるSEOなんて大したこと無いから
適当にごまかせるし、SEO対策とか言ってぼったくれるから
昨今の状況はありがたい。
469Name_Not_Found:2005/12/22(木) 02:11:29 ID:???
でもSEO対策汁というとStrictだの言ってくるよなオジサン
下手するとブログに汁とかワケわからん
470Name_Not_Found:2005/12/22(木) 02:26:46 ID:???
MTならカスタマイズ簡単だからなおさら良いじゃん。
471Name_Not_Found:2005/12/22(木) 03:22:33 ID:???
企業サイトにMTもどうなのか。
472Name_Not_Found:2005/12/22(木) 04:40:20 ID:???
新しくつくんのめんどくせ
473Name_Not_Found:2005/12/22(木) 07:33:19 ID:???
>>164
フロートの問題でoverflowも良いですが、display:tableで解決するのは使えると思いますか?
IEは対応してないようですが、IEはwidth指定しただけで解決するようなので大丈夫でした。

HTML
<div class="container">
<div class="left">
<p>The left column.</p>
<p>The left column.</p>
<p>The left column.</p>
<p>The left column.</p>
</div>
<div class="right">
<p>The right column.</p>
<p>The right column.</p>
<p>The right column.</p>
</div>
</div>

CSS
div.container {display:table;width:100%;border: 1px solid green;}
div.left {width: 45%;float: left;border: 1px solid red;}
div.right {width: 45%;float: right;border: 1px solid blue;}
474Name_Not_Found:2005/12/22(木) 11:24:44 ID:+P2mBHY0
質問させてください
画像アルバムをレイアウトしてるのですが
画像などの情報を
<div><img ...><p>タイトル</p><p>日時とか</p></div>
のようにして連続して何十個かを出力しています。
これを
float: left;
で並べてるのですが、
高さが可変なので途中に高さの高い<div>があったりすると
そこの次に並べられてしまって順番がおかしくなります。

HTMLをいじらずにCSSだけで
うまく並べる方法はないでしょうか?

475Name_Not_Found:2005/12/22(木) 11:26:28 ID:???
ありますん
476Name_Not_Found:2005/12/22(木) 12:46:26 ID:???
>>473
それってMacでおかしくなるんじゃなかったっけ?

>>474

これのこと?
http://cssbug.at.infoseek.co.jp/detail/winie/b093.html
477474:2005/12/22(木) 14:03:12 ID:???
>>476
A,B,C,D・・・・
と並んでる場合で
Windowの幅を小さくして
Dが入りきらなくなった場合に
Aの下からD,E,F・・・と続いてほしいのですが
Cの下にDが来たりしてしまいます。
開発はIE6を使っています。
やはり無理なのでしょうか?
478Name_Not_Found:2005/12/22(木) 14:10:23 ID:???
>>477
ていうかフロートはそれが仕様
そういう動きをさせたいからこそフロートを使うもんなんだが・・・
479Name_Not_Found:2005/12/22(木) 14:12:46 ID:???
どうしてもくっつけて段落上げ下げしたいときは、
そのブロックを更にブロックで囲ってやって、
そっちにフロート制御してやるしかないよ。
480Name_Not_Found:2005/12/22(木) 15:31:33 ID:???
>>476
レスありがとうございます。MacIEだと不安定みたいですね。(Safariは大丈夫)
164のリンク先でも、overflowもMacIEだとよくないっぽいですね。
MacIEの利用者って殆どいないんですが、念のためbrでクリアする方法にしておきます。
481Name_Not_Found:2005/12/22(木) 16:33:38 ID:???
>>477
A,B,C,D・・・の高さをそろえれば良い。
多分Bが長いのだろう。
482Name_Not_Found:2005/12/22(木) 18:18:36 ID:???
>>478-479
なるほど
納得しました。ありがとうございました。

483Name_Not_Found:2005/12/23(金) 05:41:06 ID:???
>>478
> ていうかフロートはそれが仕様
違うだろ。
http://www.w3.org/TR/CSS21/visuren.html#float-position
Here are the precise rules that govern the behavior of floats:
にある規則を、特に、2と3に注意して読め。

>>482
納得すんなどあほ。
484483:2005/12/23(金) 05:47:50 ID:???
> Aの下からD,E,F・・・と続いてほしいのですが
> Cの下にDが来たりしてしまいます。
申し訳ない。
「Dの下から
 Aの下に」
と完全に読み違えていた。吊ってくる。o...rz
485Name_Not_Found:2005/12/23(金) 07:24:07 ID:???
釣り禁止
486Name_Not_Found:2005/12/24(土) 00:49:43 ID:???
StrictでTransitionalみたいにborderを含めた寸法でボックス幅を割り振るにはどうすればいいですか?
487Name_Not_Found:2005/12/24(土) 02:42:05 ID:???
>>486
それはStrict/Transitionalの問題じゃないんだが・・・
とりあえずIE以外ならborder-boxというプロパティ値を調べてみろ。
488Name_Not_Found:2005/12/24(土) 09:11:05 ID:3BLpfNmx
朝から質問すみません。

h1.PageHeaderTitle {
           background: #fff url('./bg.gif') 0 0 no-repeat;
           color: #000;
           font-size: 3em;
           height: 120px;
           margin: 0;
           padding: 5px 0 0 26px;
}
これで背景画像がうまく表示されました (※1)。
しかしIE6で確認したところ、height の解釈が他のブラウザと違うみたいで、背景画像
が下まで表示されません。

この場合、IE6のために対策は無いでしょうか?
お願いします。
-------------[Note]------------
※1:Epiphany 1.4.8 , Firefox 1.0.4 , Galeon 1.3.20 , Konqueror 3.3 , Mozilla 1.7.8 , Safari 2.0
489Name_Not_Found:2005/12/24(土) 09:19:07 ID:???
>>488
背景画像のサイズは?
IEだと背景画像が途中で途切れるってこと?

あとその確認したブラウザって描画エンジンが
GeckoとKHTML(とWebKit)しかないから
Operaでも確認したほうがよくない?
490Name_Not_Found:2005/12/24(土) 09:24:44 ID:3BLpfNmx
>>489
背景画像のサイズは 130*90です。
しかもCSSに間違いがありました。訂正します:

h1.PageHeaderTitle {
           background: #fff url('./bg.gif') 0 0 no-repeat;
           color: #000;
           font-size: 3em;
           height: 60px;
           margin: 0;
           padding: 27px 0 0 90px;
}
> IEだと背景画像が途中で途切れるってこと?
はい、そうです。

ちなみにOperaでも確認してみましたが、特に大丈夫みたいです。
491Name_Not_Found:2005/12/24(土) 09:32:54 ID:???
>>489
height:90px;の画像だから。
492Name_Not_Found:2005/12/24(土) 09:40:06 ID:3BLpfNmx
>>491
paddingのサイズは含めないのでしょうか?
90pxに指定すると逆に画像の境界が見えてしまい、不自然です。
493Name_Not_Found:2005/12/24(土) 09:50:33 ID:???
画像の境目ってなんじゃそりゃ。
画像ぴったりの高さにしたいなら、padding:0;でいいじゃん。
494Name_Not_Found:2005/12/24(土) 09:58:08 ID:3BLpfNmx
>>493
やってみましたが、画像の上に文字がきてしまい
上とピッタリ(余白が無い)状態に…。
495Name_Not_Found:2005/12/24(土) 10:08:19 ID:???
>>494
スクリーンショット撮れる?
最終的にどうしたいのか説明できる?
496Name_Not_Found:2005/12/24(土) 10:19:08 ID:???
このスレの回答者のラベルってどれくらいでしょうか?
497Name_Not_Found:2005/12/24(土) 10:27:33 ID:3BLpfNmx
自己解決しました。
ありがとうございました。


#header {
           background: #fff url('./bg.gif') 0 0 no-repeat;
           color: #000;
           font-size: 3em;
           height: 90px;
}
h1.PageHeaderTitle {
           margin: 0;
           padding: 20px 90px;
}
498486:2005/12/24(土) 11:27:52 ID:???
>>487
IE(6.0)でも含まれないのです。
499486:2005/12/24(土) 11:48:47 ID:???
現状をまとめなおします。
・DOCTYPE設定はHTML4.01のstrict.dtd
・firefoxやNetScapeは-moz-box-sizing: border-box; box-sizing: border-box; で解決しました。

残るはIE。
borderの幅がボックスのwidthに含まれないのです。
これを含ませるためにはどうすればよいですか?
500Name_Not_Found:2005/12/24(土) 14:37:47 ID:???
xhtmlのstrictにしてxml宣言を書く
501Name_Not_Found:2005/12/24(土) 14:38:38 ID:???
>474
アルバムは「table」じゃねえのかな。
502Name_Not_Found:2005/12/24(土) 15:07:07 ID:7e9fEU4J
ブロック要素の幅を文字の分量で変動させるにはどうすれば良いでしょうか?
503Name_Not_Found:2005/12/24(土) 15:08:31 ID:???
>>474 は俺も悩んでる質問だな
テーブルを使わないとなると、ここみたいにするしかないのか…
http://www.ch-hokkaido.net/category.asp?cat_id=00301
504Name_Not_Found:2005/12/24(土) 15:10:52 ID:???
直リンしちまった。スマン。俺もぶっちゃけテーブルでいいや…とか思ってる。
505Name_Not_Found:2005/12/24(土) 16:19:01 ID:???
>>502
display:inline
506502:2005/12/24(土) 17:06:39 ID:???
>>505
レスありがとうございます。
ただ、それだと折り返しがある時に綺麗な四角にならないので。。。
display:tableもやってみたんですがブラウザが。。。
507Name_Not_Found:2005/12/24(土) 17:38:37 ID:???
>>506
widthをemで指定しる!
ユーザー側でフォントサイズを大きくしたら横幅も広くなる。
508Name_Not_Found:2005/12/24(土) 21:15:08 ID:???
無理しないでtable使えって
509Name_Not_Found:2005/12/24(土) 21:23:49 ID:???
ハックすればいい
510502:2005/12/24(土) 22:00:22 ID:???
>>507
レスありがとうございます。
文字数によって幅が変更するようにしたいので、それだとちょっと。。。
やっぱり、floatとclearを組み合わせるのが一番なんでしょうか?
widthにfitとかあれば良かったんですが。。。
511Name_Not_Found:2005/12/24(土) 23:04:16 ID:???
>>508
tableは表だってば
512Name_Not_Found:2005/12/24(土) 23:20:40 ID:???
次のように、ブロック要素の右下にテキストを配置したいのですが、
上手くいきません。

■■■■■■■■■■■■■■■■■■■
■□□□□□□□□□□□□□□□□□■
■□□□□□□□□□テキストテキスト■
■□□□□□□□□□テキストテキスト■
■■■■■■■■■■■■■■■■■■■

HTML
<div>
<p>テキストテキスト<br>テキストテキスト</p>
</div>

CSS
div {
display: block;
width: 200px; height: 50px;
text-align: right;
}

自分でいろいろやってみて、<p>の部分も<div>にし、入れ子にしてみま
したが、どうやって下側に配置するのかわかりません。。。
環境は、WinXP+IE、Operaなどです。
よろしくお願いします。
513Name_Not_Found:2005/12/25(日) 00:03:07 ID:???
自分なら↓こうやる。
div {
width: 200px; height: 50px;
position:relative;
}
p {
position: absolute;
bottom: 0px;
right: 0px;
}
514512:2005/12/25(日) 00:14:46 ID:???
>513さん
レスありがとうございます。
さっそく試してみましたが、IE以外、表示がおかしかったです。
512に書いたソースはサンプルで、<div>が他にも存在し(もち
ろん、個別にidを持っています)、position:relative;の指定も他
でしているのでうまくいかないのでしょうか。。。
今日はもう寝るので、明日、もう一度試してみます。
515Name_Not_Found:2005/12/25(日) 00:24:49 ID:???
>>513バカ
516513:2005/12/25(日) 11:27:42 ID:zcOPKHI9
>>515
何で?
bottomとrightを使っているから?
517Name_Not_Found:2005/12/25(日) 14:16:32 ID:???
普通にこれでよくね? 確認してないが。

div {
width: 200px;
height: 50px;
text-align: right;
}

p {
margin-top: 50px;
}
518Name_Not_Found:2005/12/25(日) 14:17:49 ID:???
ああ、pのmarginは調整して。
50じゃはみ出てしまうわ。
519Name_Not_Found:2005/12/25(日) 14:46:01 ID:???
アドレス行のhttp://が長くなるとブロックからはみ出る問題
overflowで解決できると思ったがIEとMozillaでは仕様が違うようなので解決できませんでした。
みなさんはどうしてますか?
520Name_Not_Found:2005/12/25(日) 14:59:31 ID:???
>519
すいません、white-space: wrap;
で解決しました
521Name_Not_Found:2005/12/25(日) 14:59:35 ID:???
>>519
overflow
てか解決できなかったってどうなったのよ
522Name_Not_Found:2005/12/25(日) 15:00:11 ID:???
?(´д`)
523Name_Not_Found:2005/12/25(日) 15:19:39 ID:???
ここは土素人ばっかだな。
とくに517は酷いな・・・

答える資格もねー。
524Name_Not_Found:2005/12/25(日) 15:38:07 ID:???
と、回答もせずに>>523が囀っています。
525Name_Not_Found:2005/12/25(日) 17:22:07 ID:???
div {
width: 200px;
height: 50px;
text-align: right;
}

p {
margin-top: 50px;
}



ワロタw
526Name_Not_Found:2005/12/25(日) 18:07:08 ID:???
512じゃないけど、どうやればいいの?
527Name_Not_Found:2005/12/25(日) 23:43:25 ID:???
boxの高さが決まってるならline-hight(一行限定)
528Name_Not_Found:2005/12/25(日) 23:46:42 ID:VmsqkhFI
margin使うことがナンセンス
529Name_Not_Found:2005/12/26(月) 11:51:08 ID:???
PX使うことが邪道。
解像度が変われば・・・  ズレズレw
530Name_Not_Found:2005/12/26(月) 12:02:14 ID:???
ウソこけ
531Name_Not_Found:2005/12/26(月) 14:11:47 ID:???
ULとLIを外部cssで設定したら全然反映されないんだけどなんで?
532Name_Not_Found:2005/12/26(月) 14:18:25 ID:???
おまえの頭かブラウザが非対応だら。
533Name_Not_Found:2005/12/26(月) 15:11:27 ID:???
>>503
たてに並べるってこと?
じゃないよね?
534Name_Not_Found:2005/12/26(月) 16:52:06 ID:cLchEVpx
空セルの枠も表示させたいのですが
今までは半角スペースとか入れて無理やりだしてたのですが
CSSでよい方法はありませんでしょうか?

ちなみにブラウザはIEを用いるのでempty-cellsは使えませんでした。
535Name_Not_Found:2005/12/26(月) 17:07:19 ID:???
何のためのCSSだよw
536Name_Not_Found:2005/12/26(月) 19:40:23 ID:???
>>534
>ブラウザはIEを用いるので
おまえ、サイトは閲覧者が見るものだ。
おまえが使ってるブラウザで見られなくても、閲覧者の使ってるブラウザで見られればいい。
それはさておき何か色々と勘違いしてそうだが。
537Name_Not_Found:2005/12/26(月) 20:07:08 ID:???
>>534
empty-cellsの初期値はshow
538Name_Not_Found:2005/12/26(月) 20:54:43 ID:???
>>536
限られた人しか見ないからIEでいいんだよ。
お前の方が勘違いしてないか?
539536:2005/12/26(月) 21:09:17 ID:???
>>538
俺様にケンカうってんならはっきり言え。
540Name_Not_Found:2005/12/26(月) 21:29:46 ID:???
こうして冬厨の夜は更けていくのであった。
541Name_Not_Found:2005/12/26(月) 21:39:23 ID:???
>>538
おまえの勘違いの内容は>>537

>>539
で、おまえは誰だ。少なくとも俺じゃないんだが。
542Name_Not_Found:2005/12/26(月) 22:06:30 ID:???
>>541

オマエこそだれだ?あぁ?

ケンカ売ってんなら表にでろっ!
543Name_Not_Found:2005/12/26(月) 22:50:17 ID:Edakepgc
>>542
きんもーっ☆
544Name_Not_Found:2005/12/26(月) 23:04:55 ID:???
CSSって、px指定はまずいのか?
545Name_Not_Found:2005/12/26(月) 23:49:32 ID:???
メートル法で指定すべき
546Name_Not_Found:2005/12/26(月) 23:56:58 ID:???
>>544
通はフィートで指定する。
547Name_Not_Found:2005/12/27(火) 02:19:37 ID:???
俺は色白の子を指名する
548Name_Not_Found:2005/12/27(火) 06:09:46 ID:???
display:inline;とfloat:left;の使い分けはどのようにすればいいですか?
549Name_Not_Found:2005/12/27(火) 06:39:41 ID:???
>>548
質問は具体的に書け。
550Name_Not_Found:2005/12/27(火) 07:05:03 ID:???
画面外に飛ばしたいときは、普通にインチで指定してますが何か。
551534:2005/12/27(火) 10:45:41 ID:z007gPkU
えー、色々とすみません。
>>535
複数のページスタイルを統一するためのものだと思っているのですが間違っていますでしょうか?

で、閲覧は限られた人であり外部にだすようなものではないのでIEということです。

>>544
サイズ指定だと複数の表のサイズも同じになってしまうのでなるべくは使いたくないなーと思うのですが・・。
まぁ、その上で各ソースに明示的に書いたらいけますがそれだと意味ないですよね??

用は空セルの枠は表示させますよーってスタイルのみスタイルとして定義したいのです。
勘違いしてたらすみません、いろいろご教授お願いします。


552548:2005/12/27(火) 10:51:54 ID:???
>>549
なんでそんなにエラそーなの?

きらい。
553Name_Not_Found:2005/12/27(火) 11:03:58 ID:MgjEPkFu
>>552
きんもーっ☆
554Name_Not_Found:2005/12/27(火) 12:43:43 ID:???
>>548
floatはバグ関係で使いづらい。
それだけ。










きんもーっ☆
555Name_Not_Found:2005/12/27(火) 13:09:54 ID:???
始めまして。
HXTMLでページを現在制作しており、現在のようなCSSですと
IEではきちんと表示されるのですがNetscape 7.1では
レイアウトが崩れてしまいます。
Netscapeにも対応させるにはどのようにすれば宜しいかお教え頂けますでしょうか。
参考にメインコンテンツ部分のCSSの一部を記載します。

div#left_top {
width:160px;
height:500px;
background-repeat : no-repeat;
background-image: url(../common/meinleft.jpg);
float:left;
}

div#right_top {
margin: 0px;
padding: 0px;
background-color: #FFFFFF;
width:420px;
float:left;
}

また、Netscape 7.1ではpadding,marginで-要素は対応されないのでしょうか?
margin-top : -50px;
等です。
556Name_Not_Found:2005/12/27(火) 13:23:24 ID:???
>HXTMLでページを現在制作しており、現在のようなCSSですと
?
557555:2005/12/27(火) 13:51:21 ID:???
>HXTMLでページを現在制作しており、
ここは気にしないで下さい。
CSSファイルを適応させるページをXHTMLで作っているという事です。
558Name_Not_Found:2005/12/27(火) 15:09:02 ID:???
適用させるHTMLソース無しに、CSSだけ出されてわかるか。>>555
どうせfloatのclear忘れとかでしょ。FAQみてないのかな。
559Name_Not_Found:2005/12/27(火) 15:14:36 ID:???
560555:2005/12/27(火) 16:48:35 ID:???
>>558
>>559
ありがとう御座います。
clear : left;
が必要だったのですね。
無事Netscapeでもレイアウト崩れず表示できました。
561Name_Not_Found:2005/12/27(火) 17:01:01 ID:???
やっぱFAQも見ないで質問してたのか。
562Name_Not_Found:2005/12/27(火) 17:50:17 ID:???
>>561
なんでそんなにエラそーなの?

きらい。
563Name_Not_Found:2005/12/27(火) 18:30:30 ID:???
>>562
どう考えても>>561は正論です。
ありがとうございました。
564Name_Not_Found:2005/12/27(火) 19:41:10 ID:???
>>551
つーかだからIEでもデフォルトが空セルは表示する設定なんだよ。
どうやって書けば空セル表示なしにできるんだ。
565Name_Not_Found:2005/12/27(火) 19:59:14 ID:???
「子要素にaaaを持つbbb要素」だけにスタイルを適用したい場合はどう指定すればいいのでしょうか?
566Name_Not_Found:2005/12/27(火) 20:08:33 ID:???
「親の中でこういう条件の子」に対する指定はあるが、
「子がこういう条件の親」という指定はCSS3でも出てなかったような。
567565:2005/12/27(火) 20:19:53 ID:???
>>566
そうなんですか・・・
解説サイト(たぶんcss2)を見て回っても見つからなかったんですが
そもそも存在しないんですね

たとえば「<a><img /></a>」みたいに
img要素を持つa要素にだけ特定のスタイルを指定した言って思うときが
頻繁にあるのですが
そういうものにだけclassを振るのは大変なので
ある特定の要素を包括する要素にスタイルを指定するセレクタか何かがあったらなと思ったのですが
というかあってもよさそうなのですが
568Name_Not_Found:2005/12/27(火) 20:22:31 ID:???
大体<a><img /></a>なんてのはリストで並んでたりするから、
そういう不便は感じたことないなぁ。
というかIEがあるから、そんな素敵なマッチングは簡単なのでも使えナッシング・・・
569565:2005/12/27(火) 20:27:24 ID:???
あーたしかにそういうimg要素を含むa要素などは
たいていその親要素に共通点があったりしますね
工夫してみます
どうもありがとうございます
570Name_Not_Found:2005/12/27(火) 22:40:44 ID:???
〜の親である x 要素っていう指定は XSL ではできるが、まぁスレ違いか。
571Name_Not_Found:2005/12/27(火) 22:59:04 ID:???
ここはCSSのスレだからね
572Name_Not_Found:2005/12/28(水) 21:43:31 ID:id41/09a
アサヒビールのサイト
http://www.asahibeer.co.jp/ですけどここのニュースリリースのところのような
感じでタブメニューをやるにはどうやったらいいでしょうか?
(タブをクリックしてもURLが変わらないようなCSS)
ソースを見てもいまいちわからなかったんで、どこかにわかりやすく説明してる
サイトがあったら教えてもらえませんか?
573Name_Not_Found:2005/12/28(水) 21:54:02 ID:???
>>572
イベントハンドらを使ってz-indexの値を変更しているんだ。
574Name_Not_Found:2005/12/28(水) 21:54:47 ID:???
>>572
すいません。
解説しているサイトをお探しなのですね。
それはわからないです。ごめんなさい。
575Name_Not_Found:2005/12/28(水) 22:06:50 ID:???
>>572
JavaScriptスレのほうでヨロシク
576Name_Not_Found:2005/12/28(水) 22:30:33 ID:???
そういえば、スゲー文法無視してHTML , CSSだけでやったのがあったような。
577Name_Not_Found:2005/12/28(水) 22:35:41 ID:???
>>576
へえ、そっちはちょっと興味がある。
もし見付けられたら教えてくんろ。
578Name_Not_Found:2005/12/28(水) 23:01:06 ID:???
>>577
display:aとしてaをdiv見たいな使い方をする(aの中にコンテンツを仕込む)。
イベントハンドラはa:hoverで代用。
579Name_Not_Found:2005/12/28(水) 23:09:07 ID:???
ちょい待ち、本当に:hoverか?
動作的に:visitedではないのか?
580Name_Not_Found:2005/12/28(水) 23:10:19 ID:???
display:a???
581Name_Not_Found:2005/12/28(水) 23:59:21 ID:???
>>578
onmouseoverの代わりにa:hoverを使うんだね.
display:aというのは謎だから,contentで試してみたらできたので晒し.
Sleipnir2&Geckoで確認.IEではどうやれば….

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<title>TEST</title>
<style type="text/css">
a:visited:before { content: attr(title); background-color:#ffaaaa; }
a:hover:after { content: attr(href); background-color:#aaaaff; }
</style>
</head>
<body>
<ul>
<li><a href="http://www.yahoo.co.jp/" title="やふー">△</a></li>
<li><a href="http://www.google.co.jp/" title="ぐぐる">■</a></li>
<li><a href="http://www.w3c.org/" title="W3C">▽</a></li>
</ul>
</body>
</html>
582Name_Not_Found:2005/12/29(木) 01:05:13 ID:P1OZc3j1
CSSで色々指定するのに、<div>タグをいっぱい使いまくって指定するというのは
あまり良くないでしょうか?

それと、CSSって意味とかあまり考えずに見栄えだけを考えて使ってもいいんでしょうか?
583Name_Not_Found:2005/12/29(木) 01:17:50 ID:???
>>582
>CSSで色々指定するのに、<div>タグをいっぱい使いまくって指定するというのは

別にいいと思うよ。


>CSSって意味とかあまり考えずに見栄えだけを考えて使ってもいいんでしょうか?

それがCSSです、意味はXHTMLの方できちんとしてればいいよー。
584Name_Not_Found:2005/12/29(木) 01:18:52 ID:???
>582
divのほかにも文脈に合ったタグが使われていれば問題無いなないでしょうか。
divも普通、<div id="title">とか、div自体にもIDやCLASSで意味付けを行うのが普通です。

CSSのプロパティの意味まで考えてたら、ほとんど何もデザインできなくなるので
かたくなる必要はないです。気にしていたらレイアウトにfloatを使っている人は
全部アウトになっちゃいますから。
585Name_Not_Found:2005/12/29(木) 01:20:59 ID:???
>>584
floatの意味理解してねーww
586Name_Not_Found:2005/12/29(木) 01:22:09 ID:???
なんで
587Name_Not_Found:2005/12/29(木) 01:24:17 ID:???
>>582
意味のあるdivなら、使うべき。
ただ意味のない空タグが俗手浸かるくらいだったらテーブルレイアウトでも同じ、
つまりCSSレイアウトの意味がなくなってしまう。
CSSのほうは、見栄えの分離のために生み出されたものだから、意味は考えなくても良いが
意味が分かってないと仕様を理解するのが難しいかも。
588582:2005/12/29(木) 01:33:40 ID:???
皆様どうもありがとうございました!
589Name_Not_Found:2005/12/29(木) 02:16:53 ID:???
自分のサイトなんだから好きなように作れよ
他人にそのdivは意味がないとか言われてやめるくらいなら最初から作るな
590Name_Not_Found:2005/12/29(木) 02:47:46 ID:???
素直にテボーレイアウテゥー
591Name_Not_Found:2005/12/29(木) 02:48:05 ID:???
>>589
趣味の個人サイトとは限らない
592Name_Not_Found:2005/12/29(木) 09:16:57 ID:???
>>584
id属性もclass属性も、divに意味を与えない。
作者であるあなたにとっては何かの目印になるかもしれないが、divに意味は無い。
593Name_Not_Found:2005/12/29(木) 09:35:46 ID:???
594Name_Not_Found:2005/12/29(木) 09:38:30 ID:???
>>592
http://www.w3.org/TR/html401/struct/global.html#h-7.5.4
>DIV要素とSPAN要素は、id属性及び class属性と併用することで、
>文書に構造を付加するための一般機構を提供する。
とのことだから、構造がそこに生じるということは、意味を付与することが可能だということだ。
595Name_Not_Found:2005/12/29(木) 14:56:16 ID:???
おまえら margin とか padding とかの長さの単位は何にしてる?
596Name_Not_Found:2005/12/29(木) 15:08:51 ID:???
>>595

メートル。
597Name_Not_Found:2005/12/29(木) 15:15:31 ID:???
>>595
null
598Name_Not_Found:2005/12/29(木) 15:26:55 ID:???
>>595

ガロン。
599Name_Not_Found:2005/12/29(木) 15:27:32 ID:???
>>595
マジレスするとpt。
蛇足するとfont-sizeとかなら%。
600Name_Not_Found:2005/12/29(木) 15:31:19 ID:???
>>595
マヂレスすると null。
601Name_Not_Found:2005/12/29(木) 15:32:53 ID:???
.black-text { font-size:10pt; font-family:Gothic; font-style:normal; color: black; }
.red-text { font-size:10pt; font-family:Gothic; font-style:normal; color: red; }
.green-text { font-size:10pt; font-family:Gothic; font-style:normal; color: green; }
.blue-text { font-size:10pt; font-family:Gothic; font-style:normal; color: blue; }

このように似たようなクラスをいくつも定義したい場合に、大元となるクラスを作ってそれを継承した派生クラスを定義するようなことはできませんか?
602Name_Not_Found:2005/12/29(木) 15:55:10 ID:???
たしかnullって0だよな。
0には単位つけなくてもよいしな。
603Name_Not_Found:2005/12/29(木) 16:41:35 ID:cva4622A
>>601
新たな質問はあげような。
で回答だが、そんなの複数クラスで上書きすればいいでしょ。
604Name_Not_Found:2005/12/29(木) 16:52:48 ID:???
>>603
自分のIPが表示されたが何か?
605604:2005/12/29(木) 16:53:24 ID:???
スマン誤爆
606Name_Not_Found:2005/12/29(木) 16:57:28 ID:eh7uIIat
text-indent: -9999pxでテキストのリンク吹っ飛ばして画像のリンク
に置き換えるのは検索エンジンスパムなんでしょうか?
たいていのサイトが使っているCSSの手法だと思うんですが。
607Name_Not_Found:2005/12/29(木) 17:14:18 ID:???
>たいていのサイトが使っている
んなこたぁない。偏ったサイトばかり見てるんだなあ。
608Name_Not_Found:2005/12/29(木) 17:27:06 ID:???
>>606
糞w3c信者はその使い方は用法が違う!とか目くじら立てて批判するけど、
よく見かけるし、よく使うね。
609Name_Not_Found:2005/12/29(木) 17:32:36 ID:???
俺だったらspanで括って display: none;
610609:2005/12/29(木) 17:33:20 ID:???
ああ、でもどっかの音声ブラウザは display: none; を
読み上げないやつあったか。
そうなると…
611606:2005/12/29(木) 17:42:49 ID:eh7uIIat
http://www.hyperposition.com/se3blog/searchengine/20050828084130.html
ここでは隠しテキスト(CSSによるもの)は問題ないとかかれているようです。
やはり見栄えを追求するとどうしても<h1>などは見栄えが悪いので画像で置き換えたくなります。
612Name_Not_Found:2005/12/29(木) 17:56:23 ID:???
隠しテキストの程度によるんでないの?
-9999pxだと、画像非表示の時まずくない?
613Name_Not_Found:2005/12/29(木) 17:57:09 ID:???
>>611
は? <h1><img alt="タイトル"></h1>でいいぢゃん。CSSの出番無し。
614Name_Not_Found:2005/12/29(木) 18:08:59 ID:???
alt属性がいいかもね。
画像非表示にしてると CSS で文字が消えちゃうので見えなくなってしまう。
まぁ画像切ってる人はCSSも切ってると思うけど。
615Name_Not_Found:2005/12/29(木) 18:20:37 ID:???
冬厨が来ると話題がループするなぁ・・・
616Name_Not_Found:2005/12/29(木) 18:24:53 ID:???
>>614  私は普段、画像オフだがCSSは有効だよ。だってIEだもん。
617Name_Not_Found:2005/12/29(木) 18:45:44 ID:???
618Name_Not_Found:2005/12/29(木) 18:51:55 ID:???
>>617 そこ、IEで閲覧できない。アクセシビリティーに配慮が無いな。
619Name_Not_Found:2005/12/29(木) 19:07:59 ID:???
>>610
w3cとは仲良しなんだけど
音声ブラウザってのに出会ったことがない
俺の人生の中で唯一の処女だ(;´Д`)ハァハァ

>>614
altだけのヤツ多いけど
titleもセットにしてくれょ
と、、、もじらクンが昨日つぶやいてた
620Name_Not_Found:2005/12/29(木) 19:15:58 ID:???
も〜じらクン さよな〜ら さよ〜〜なら も〜じらクン
621Name_Not_Found:2005/12/29(木) 20:17:29 ID:???
CSSを勉強したいんですが、おすすめの本を教えてください
622Name_Not_Found:2005/12/29(木) 20:19:24 ID:???
net上にたくさんあるが、本のほうがいいのかい?
623Name_Not_Found:2005/12/29(木) 20:29:44 ID:???
>>622
ゆっくり読めるので、本の方が。
624Name_Not_Found:2005/12/29(木) 20:38:27 ID:???
>>623
易しいから、仕様を読め。
http://www.w3.org/TR/css21/
625Name_Not_Found:2005/12/29(木) 21:13:24 ID:???
626Name_Not_Found:2005/12/29(木) 21:27:09 ID:???
CSS2.1とCSS2は違うだろ
627Name_Not_Found:2005/12/29(木) 21:32:14 ID:???
>>624,626
WDなんて読んでも仕方ないだろ
628Name_Not_Found:2005/12/29(木) 21:33:54 ID:???
WDはWesternDigitalの略称です
629Name_Not_Found:2005/12/29(木) 23:05:26 ID:???
>>625. >>627
ヤレヤレ、まだこんな無知がいたのか。
http://www.w3.org/Style/CSS/#p10
630Name_Not_Found:2005/12/29(木) 23:36:56 ID:???
>>627
CSS2.0を部分的にでも実装してる現役の有名ブラウザはIEだけだろ。
まあ、どう見ても仕様に忠実じゃないが。

今時のブラウザは全部2.1を仕様にして実装されているし、
W3C本体がCSS2.0を仕様と見なさなくなって2年弱が経過した。
現在の仕様は、1.0, 2.1, 3.0 であり、勧告に達しているのは 1.0 だけだ。
要するに、2.0?はあ?いつの話してんだ?っつうことですよ。
つうかねえ、HTMLとCSSは簡単だからか、これらを扱うスレには
知識も関心も無い門外漢が気軽にしゃしゃり出てきて困る。
631Name_Not_Found:2005/12/29(木) 23:38:32 ID:???
スレじゃない。板。
ばかおおい
632Name_Not_Found:2005/12/30(金) 00:12:50 ID:???
WinXP+Opera8.5です。

<html>
<head>
<style type="text/css" media="all">
@import "css/common.css";
@import "css/home.css";
</style>
</head>
<body>
<div id="sitelogo">
<h1>○○○○</h1>
</div>
</body>

<<common.css>>
* {
margin: 0; padding: 0; border: 0;
}
div {
display: block;
}

<<home.css>>
#sitelogo {
float: left;width: 780px;height: 250px;
background: url(../img/site_logo.gif) top left no-repeat;
}
#sitelogo h1 {
text-indent: -9999px;
}
633632:2005/12/30(金) 00:15:25 ID:???
#sitelogoの内容を、common.cssに書いていたときはちゃんと
画像が表示されていたのですが、home.cssに移動したところ、
画像が表示されません。(IE、ネスケ、Firefoxでは大丈夫でした)
なぜなのでしょうか?
634632:2005/12/30(金) 00:17:58 ID:???
(今日はもう寝ます)
635Name_Not_Found:2005/12/30(金) 00:25:28 ID:???
>>632
なんで<style>@import</style>とかやってんの。

<link rel="stylesheet" type="text/css" href="common.css"
hreflang="ja" charset="Shift_jis" media="print, screen, projection">
<link rel="stylesheet" type="text/css" href="home.css"
hreflang="ja" charset="Shift_jis" media="print, screen, projection">
で、いいぢゃん。
636Name_Not_Found:2005/12/30(金) 00:34:35 ID:???
637Name_Not_Found:2005/12/30(金) 03:13:46 ID:???
-9999pxでリンクボタンつくってしまうと
クリックした時に表示される点線がうにょ〜んと左に伸びるな。
さぁどうするfirefoxユーザー。
638Name_Not_Found:2005/12/30(金) 03:15:39 ID:???
いや、べつにどうも……
639Name_Not_Found:2005/12/30(金) 06:09:23 ID:???
>>637
つ【onfocus="this.blur()"】
初めからやり方わかりませーんって素直に質問しとけよ。
640Name_Not_Found:2005/12/30(金) 08:42:20 ID:???
top:0;
left:75%;
641Name_Not_Found:2005/12/30(金) 08:46:35 ID:???
http://hxxk.jp/template/mt_3_2_strict/
ここは、float使わずに、どうやって2カラムにしてるの?
642634:2005/12/30(金) 09:03:15 ID:???
>635
参考にしたサイト(Fujitsu他)でインポートしていたからです。
<link></link>にしてcssファイルを読み込んでみましたが、状
況は変わりません。

#sitelogoの部分は、ページごとに画像を変えたいと思ってい
るので、commoc.cssとは切り離したいのですが。。。

よろしくお願いします。
643Name_Not_Found:2005/12/30(金) 09:23:29 ID:???
>>642
たぶんタイプミス
commoc.cssでピンと来た!!!!11
644Name_Not_Found:2005/12/30(金) 09:23:31 ID:???
<div id="top">
<div id="main">
<div id="menu">
にする場合、
div#main {width:70%;float:left;}
div#menu {width: 20%;}
か、
div#main {width:70%;float:left;}
div#menu {width: 20%;float:right;}
のどちらにしたほうがいいでしょうか?

645Name_Not_Found:2005/12/30(金) 09:27:28 ID:???
>>644
オナヌーは左手でしたほうが気持ちいいお。
646Name_Not_Found:2005/12/30(金) 09:27:55 ID:???
>>641
右側のメニュー部分が
position: absolute;
top: 0;
left: 75%;
となっているがや.
647Name_Not_Found:2005/12/30(金) 09:28:06 ID:???
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
の、
div.contents { float: left; width: 30%; margin-top: 0;}
div.honbun { margin-left: 31%; } /*↑の横幅が30%ゆえに */
のdiv.honbunがwidth:70%とか65%ではないのでしょうか?
648Name_Not_Found:2005/12/30(金) 09:28:18 ID:???
>>646
thx!
649Name_Not_Found:2005/12/30(金) 09:28:50 ID:???
>>645
float:rightは要らないってことですね。thx!
650Name_Not_Found:2005/12/30(金) 09:30:46 ID:???
float:left;width:30%で左メニュー。
width:70%;で右の本文だと思うんですけど、
なぜ、そうでなくて、margin-left:31%なんでしょうか?
651642:2005/12/30(金) 09:31:50 ID:???
>642
ではタイプミスしましたが、検証しているhtmlファイルでは
間違えていないことを、今、再度確認しました。
652Name_Not_Found:2005/12/30(金) 09:48:35 ID:???
floatを使うとその親要素が縦に潰れてしまうんですがそれを回避するにはどうすればいいんですか?
clearはfloatをつけている親要素の弟要素に指定しても親要素そのものに指定しても
親要素が潰れてしまいます
653Name_Not_Found:2005/12/30(金) 10:00:22 ID:???
質問はあげて。ソースを出して。
654Name_Not_Found:2005/12/30(金) 10:03:03 ID:???
>>647 君はfloatを理解してないので、FAQとそのリンク先をよく読みなさい。
http://web2ch.s31.xrea.com/?CSSFAQ#content_1_3
655Name_Not_Found:2005/12/30(金) 10:11:36 ID:+i2W1lS7
>>654
thx! 見ました。でも、なぜ、

http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
の、
div.contents { float: left; width: 30%; margin-top: 0;}
div.honbun { margin-left: 31%; } /*↑の横幅が30%ゆえに */
のdiv.honbunがwidth:70%とか65%ではないのでしょうか?

の疑問は解決しませんでした。

float:left;width:30%で左メニュー。
width:70%;で右の本文だと思うんですけど、
なぜ、そうでなくて、margin-left:31%なんでしょうか?
656Name_Not_Found:2005/12/30(金) 10:17:36 ID:???
>>652
FAQ嫁
657Name_Not_Found:2005/12/30(金) 10:22:27 ID:???
contentで生成される内容物の色を指定するにはどうすればいいのでしょうか
contentを指定した要素にもともとかかれている文字の色は変えないで
658Name_Not_Found:2005/12/30(金) 10:31:58 ID:???
>>655
どこを見てるんだ? 目が節穴ですか。次の通り書かれたのが見えませんか?

またfloat:left;で回り込むのはテキスト(imgを含む)だけです。ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:(浮動要素のwidth);”なりを指定する必要があります。WinIEの間違った実装で誤解が多いので注意。

http://cssbug.at.infoseek.co.jp/detail/winie/b054.html(フロートに後続する要素のボックス幅がフロートに合わせて短縮される(IE6):CSSバグリスト)
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。

http://www.mozilla.gr.jp/standards/webtips0021.html(heightプロパティの注意点〜内容がfloat要素の場合)
659Name_Not_Found:2005/12/30(金) 11:18:43 ID:???
>>658

なんでそんなにエラそうなん?
660Name_Not_Found:2005/12/30(金) 11:54:10 ID:???
だって回答者だもん。
661Name_Not_Found:2005/12/30(金) 11:57:36 ID:???
回答者は間違ったときに下の沼の落下するような席で答えさせれば回答の質が上がるだろう
662Name_Not_Found:2005/12/30(金) 12:01:50 ID:???
>>639
javascriptつかってなかった場合はどうする
663Name_Not_Found:2005/12/30(金) 12:08:48 ID:???
>>637=662
そもそもそんなこと気にするのがバカ
664Name_Not_Found:2005/12/30(金) 12:10:29 ID:???
>>662
そんなやついるのw
665Name_Not_Found:2005/12/30(金) 12:14:21 ID:???
>>664
いやそれはいるだろ。
だけどフォーカスが伸びるくらいのことが何だっつの。
666Name_Not_Found:2005/12/30(金) 12:21:38 ID:???
>>662
。。。。がんばれ

>>665
-9999使ってるサイト見ててどうかと思ったんだが
667Name_Not_Found:2005/12/30(金) 12:22:56 ID:???
うふぉレス番号間違えた
がんばれってのはjavascriptをオフにしてる人がいないと思っている>>664
勉強してね
668Name_Not_Found:2005/12/30(金) 12:23:36 ID:???
>>662
outline:none;
IEは対応してないんだっけ?でも関係ないよなww
669Name_Not_Found:2005/12/30(金) 12:26:34 ID:???
>>668
outlineがまったく見えないのも問題かと
670Name_Not_Found:2005/12/30(金) 12:33:16 ID:???
>>669
問題だと思うが、637のように気にする人種にとってはそれが解決法なんだろう。
「気にするな」と言いたいが。
671Name_Not_Found:2005/12/30(金) 14:02:02 ID:???
アクセスログを見るかぎりjavascriptオフってるのはアクセス全体の1.1%くらいいるが、cssオフはこれ以下だろうな。
672Name_Not_Found:2005/12/30(金) 14:08:58 ID:???
>>649 否! 君もFAQ(>>658引用済み)をよく読みなさい。
673Name_Not_Found:2005/12/30(金) 14:23:17 ID:???
float関係の質問多いな。
674Name_Not_Found:2005/12/30(金) 18:33:12 ID:???
回答者がエライ

ちょwwwwwwwwwwwwwwwww
氏ねよ

ゴミサイトばっか作ってる糞プログラマー風の馬鹿のくせに

笑ってやったぞ
氏ねよ ヒキヲタ 糞プログラマー崩れがヽ(`Д´)ノ
675Name_Not_Found:2005/12/30(金) 18:37:39 ID:???
狂っているのか?
676651:2005/12/30(金) 19:04:44 ID:???
>632-633
なのですが、わかる方いらっしゃいませんでしょうか
※@importではなく、<link>でスタイルシートを呼んでも
 現状変わらず
※呼びだすスタイルシート名の間違いでもないです
677Name_Not_Found:2005/12/30(金) 19:39:03 ID:???
俺のWinXP+Opera8.5環境では、表示できるよ。
678671:2005/12/30(金) 19:49:19 ID:???
>677
そうなんですか! レスおよび検証ありがとうございました。

だとすると、ますますわからなくなってきました。
common.cssに書けば画像は表示されるので、Operaで画像が
表示できないわけではないし、home.cssに書いた、他のidやclass
指定は正常に表示されているのです。。。
(Operaはインストールして設定はいじっていません)
(OSの再起動は何回かしています)
679Name_Not_Found:2005/12/30(金) 20:24:14 ID:???
どうでもいいけど、divにdisplay:block; とか、無意味なことやってんな。>>632
680Name_Not_Found:2005/12/30(金) 20:53:17 ID:???
>>679
commonの意味わかるか?
681Name_Not_Found:2005/12/30(金) 20:59:01 ID:???
commonにどんな意味があっても、無意味に変りないけどな。
どうせやるなら
H1,H2,H3,H4,H5,H6,P,UL,OL,DIR,MENU,DIV,DT,DD,ADDRESS,BLOCKQUOTE,PRE {display:block;}
位はしろ。デフォルト・スタイルシートの真似。
682Name_Not_Found:2005/12/30(金) 21:03:37 ID:???
>>632は、そもそもtext-indent: -9999px;が無意味。
<h1><img src="./img/site_logo.gif" alt="題名"></h1>で済むはず。
683Name_Not_Found:2005/12/30(金) 21:08:55 ID:???
意味を考えてから無意味かどうか判断しな
684Name_Not_Found:2005/12/30(金) 21:10:00 ID:???
>>682
img使いたくないからtext-indentやってんだろ
無意味じゃない
685Name_Not_Found:2005/12/30(金) 21:10:05 ID:???
Webサイト制作初心者用質問スレ Part 150 でも同じ事でもめとるな。
686Name_Not_Found:2005/12/30(金) 21:12:56 ID:???
んなことやったところで中身がクソじゃ誰も見ないんだけどな。

 目先のことに惑わされんなよ・・・
687678:2005/12/30(金) 21:18:53 ID:???
>681
ここに書いたのはサンプル文なので、div以外の指定は
省きました。

>682
は、>684さんのいうとおりです。

cssで画像を指定すれば、htmlの方は違うページになっ
てもタグをそのまま使えるかなと思ったので。
688Name_Not_Found:2005/12/30(金) 21:46:30 ID:???
ならせめて、position:relative;とかmarginとかにしておけ。>>687
689Name_Not_Found:2005/12/30(金) 21:55:49 ID:???
>>687 サンプル文でもdiv {display:block;}は無用ですから。残念。
690Name_Not_Found:2005/12/31(土) 04:18:10 ID:???


冬休みだと楽しいですね。
691Name_Not_Found:2005/12/31(土) 10:15:05 ID:???
>>690

Web板に毎日のように立つ単発質問スレを何とかしてくれ。

692Name_Not_Found:2005/12/31(土) 10:31:07 ID:???
おらにはどーにもできねえだよ。
693Name_Not_Found:2005/12/31(土) 10:45:52 ID:???
>>657をお願いします
694Name_Not_Found:2005/12/31(土) 11:05:45 ID:???
無理ですから。残念。>>657
695Name_Not_Found:2005/12/31(土) 11:17:00 ID:???
>>693
普通にやればできるだろ?
696Name_Not_Found:2005/12/31(土) 11:20:21 ID:???
普通にやればできるよね
習慣だよね
697Name_Not_Found:2005/12/31(土) 11:27:06 ID:???
<h1>hoge</h1>

h1 {color:blue;}
h1:after {content:"mage";color:red;}

hogeは青、mageは赤になるっしょ。
こーゆーことじゃなくて?
698Name_Not_Found:2005/12/31(土) 11:33:11 ID:???
>>697
普通にできました。ありがとうございます
699Name_Not_Found:2005/12/31(土) 12:33:08 ID:???
>>681
HTML相手に余計なことしてんじゃねえよ、と。
自分より弱い優先順位のCSS (例えば、UAのデフォルトCSS) を詳しく把握して、
必要な所だけを最小の詳細度で上書きする形にするのが理想だろう。
700Name_Not_Found:2005/12/31(土) 12:38:46 ID:???
701Name_Not_Found:2005/12/31(土) 12:40:35 ID:???
>>700
その前の流れ読んでるか?
702Name_Not_Found:2005/12/31(土) 12:46:08 ID:???
ああ、あと、outline: none; みたいなのは、実装依存だから、正しいやり方ではないよ、一応。
見れば判ると思うが、決して outline の位置じゃないから、あの点線は。
そして、outline の位置にあったとしても、それが CSSでどうこう出来るかどうかは別の話。
つまり、どうあがいても実装依存だから。
703Name_Not_Found:2005/12/31(土) 12:57:24 ID:???
横にびょ〜ん自体が実装に依存した話だったのに何を言ってるんだか
704Name_Not_Found:2005/12/31(土) 19:14:05 ID:???
>>699
未知のUAに対応したいときはどうするの?
705Name_Not_Found:2006/01/01(日) 14:09:37 ID:si69Y7GO
明けましておめでとうございます。新年早々長文の質問ですみません。
HTML4.01 Strictで、

<body>
<div id="MAIN">
<div id="MENU">
<ul><li><a href="aaa/">aaa</a></li>
<li><a href="bbb/">bbb</a></li>
<li><a href="ccc/">ccc</a></li>
</ul>
</div>
</div>
</body>

#MAIN {
overflow: auto; height: 300px; width: 500px;
margin: -150px 0px 0px -250px;
position: absolute; top: 50%; left: 50%; }

として画面の真ん中に疑似フレームを配置して、

#MENU {
height: 300px; width: 500px;
position: fixed; top: 0px; left: 0px; }

このように、疑似フレームの外にdivを表示させたいのですが、
表示できたのはwinFF1.5のみで、fixedに対応していないIE6は無論、
NN7もOpera8も表示されません。
z-indexも指定してみたのですが、結果は変わらぬまま。
親要素の外に子要素を表示することは出来ないのでしょうか?
ご教示願います…
706Name_Not_Found:2006/01/01(日) 14:20:40 ID:???
多分IEだったらfixedじゃなくてabsolueにすればOK。
Operaはやばかった希ガス。
N7はFxと同じでよかったはずだが・・・
707Name_Not_Found:2006/01/01(日) 15:29:17 ID:???
>706
ありがとうございます。

しかしabsoluteだと、div#MAINの"中"に表示されてしまい、
試しにマイナス値を指定してみると、画面上から消えてしまいます。
どうやら親要素からはみ出ると、消えてしまうようです。
かといってdiv#MAINにoverflow: visible;を指定すると、
疑似フレームそのものが解除されてしまいます。
708Name_Not_Found:2006/01/01(日) 19:23:35 ID:???
リストなどを横並びにさせるには
float:left;などで流し込むか
position:absolute;で絶対指定か
display:inline;を使うか
どれが一番スマートでおしゃれでかっこいいですか?
709Name_Not_Found:2006/01/01(日) 19:48:46 ID:???
display: inline;
710Name_Not_Found:2006/01/01(日) 19:52:50 ID:???
display:inline
711708:2006/01/01(日) 19:58:14 ID:???
>>709-710
お正月にレスどうもありがとうございます
それを踏まえて

<dl>
<dt>a-1</dt><dd>a-2</dd>
<dt>b-1</dt><dd>b-2</dd>
<dt>c-1</dt><dd>c-2</dd>
</dl>

これを

a-1 a-2
b-1 b-2
c-1 c-2

と表示させるにはどうすればいいですか?
すべてのdt、ddにdisplay:inline;を適用させると

a-1 a-2 b-1 b-2 c-1 c-2

と表示されてしまいます
検索すると
dd:after {content:"\A";}
で要素の後に改行が入るらしいのですが
firefox1.5ではうまく反映されませんでした
IEはcontentプロパティには対応していないそうなのでそもそも効果がありません
712Name_Not_Found:2006/01/01(日) 19:58:15 ID:???
playboy: you;
713708:2006/01/01(日) 20:02:21 ID:???
>>711に追記です
compact="compact"と同じような効果を得たいのですが
上記の方法は使いたくありません
714Name_Not_Found:2006/01/01(日) 20:09:53 ID:???
715Name_Not_Found:2006/01/01(日) 20:13:38 ID:???
>>714
絶対指定はスマートでおしゃれでかっこいいとは思えないんですが
もっともスマートでおしゃれでかっこいいと教えていただいた
display:inline;を使って実現したいのですが無理ですか?
716Name_Not_Found:2006/01/01(日) 20:27:17 ID:???
>>715
スマートでおしゃれでかっこいい方法を探る前に、仕様を理解しろ、な?
717Name_Not_Found:2006/01/01(日) 20:27:58 ID:???
>>714のリンク先間違えてない?
718Name_Not_Found:2006/01/01(日) 20:28:32 ID:???
>もっともスマートでおしゃれでかっこいい

  鏡見ようぜ
719Name_Not_Found:2006/01/01(日) 20:44:00 ID:???
>>718
漏れ自身の外見はスマートでおしゃれでかっこよくはありません
すでに何度も鏡を見て悟りました
そして今求めているのはスマートでおしゃれでかっこいい漏れではありません


>>716
仕様書にはなんて書いてあるんでしょうか?
リストなどにはdisplay:inline;を使ってはいけないんでしょうか?
ということは>>709-710は漏れにうそを教えたと言うことですか?
720Name_Not_Found:2006/01/01(日) 20:48:48 ID:???
>>719
>すべてのdt、ddにdisplay:inline;を適用させると
>a-1 a-2 b-1 b-2 c-1 c-2
>と表示されてしまいます
少なくともdisplay:inlineの仕様を理解している人間は、
そのような表示されて「あたりまえ」と思う。
>リストなどを横並びにさせるには
ちゃんと横並びになっているだろう?
>a-1 a-2
>b-1 b-2
>c-1 c-2
改行させたいなどとおまえは一言も言わなかった。
もう一度聞き直す前に調べ直せ。
721Name_Not_Found:2006/01/01(日) 20:54:07 ID:???
新しい質問でっス!!
漏れは>>708ではありませんヌ!
横並びにさせるのにもっともスマートでおしゃれでかっこいいらしいdisplay:inline;を使って
<dl>
<dt>a-1</dt><dd>a-2</dd>
<dt>b-1</dt><dd>b-2</dd>
<dt>c-1</dt><dd>c-2</dd>
</dl>

a-1 a-2
b-1 b-2
c-1 c-2
と表示させるにはどうすればいいですかア?
722Name_Not_Found:2006/01/01(日) 20:56:45 ID:???
うへあ
723Name_Not_Found:2006/01/01(日) 21:06:56 ID:???
>>720
ああその個所ですか。それでは>>711を書き直しますね


>>709-710
お正月にレスどうもありがとうございます
それを踏まえて

<dl>
<dt>a-1</dt><dd>a-2</dd>
<dt>b-1</dt><dd>b-2</dd>
<dt>c-1</dt><dd>c-2</dd>
</dl>

これを

a-1 a-2
b-1 b-2
c-1 c-2

と表示させるにはどうすればいいですか?
すべてのdt、ddにdisplay:inline;を適用させると

a-1 a-2 b-1 b-2 c-1 c-2

と表示されてしまいます
当然これは仕様書どおりなので仕方がないのですがこれをなんとかdisplay:inline;を使って
a-1 a-2
b-1 b-2
c-1 c-2
と表示させるにはどうすればいいですか?
724 【大吉】 【770円】 :2006/01/01(日) 21:32:11 ID:???
>>723

dt{
float:left;
clear: both;
width: 100px;}
dd{
margin-left: 2em;}
725GiantLeaves ◆pdLdLKQz86 :2006/01/01(日) 21:38:06 ID:???
質問者もアレだけど回答者もバカだな.
有無をも言わせないほどの確実な回答をすればアレな質問者はすぐにいなくなるのに.
そういう俺は質問者兼回答者.アレな上にバカ.
726一ヵ月 【1442円】 生活:2006/01/01(日) 23:36:05 ID:???
>>725
nullのコピペ乙
727Name_Not_Found:2006/01/02(月) 00:25:45 ID:???
>>723
フロート使わないやり方もあるけど、
あとは、自分で調べてみ。
結構簡単。
728Name_Not_Found:2006/01/02(月) 10:36:40 ID:???
こいつはフロート使わないやり方だけじゃなく、
絶対配置やマージンに負の数値を使うやり方もスマートじゃないと言うだろう。
729Name_Not_Found:2006/01/02(月) 11:24:19 ID:???
つ 鏡
730Name_Not_Found:2006/01/02(月) 14:40:17 ID:???
<select name="select">
 <optgroup label="Internet Explorer">
  <option value="ie4">Internet Explorer 4</option>
  <option value="ie5">Internet Explorer 5</option>
  <option value="ie5_5">Internet Explorer 5.5</option>
  <option value="ie6">Internet Explorer 6</option>
 </optgroup>
 <optgroup label="Netscape">
  <option value="n_scape4">Netscape Navigator 4</option>
  <option value="n_scape6">Netscape 6</option>
 </optgroup>
</select>

optgroupのlabelによって表示されるテキストを
装飾するにはどうすれば良いのでしょうか?
ご教示ください。
731Name_Not_Found:2006/01/02(月) 16:13:19 ID:???
>>730 新規質問はあげてくれ。
select要素ではz-indexやborderなどのプロパティを無視する(5.x/6.0)
http://cssbug.at.infoseek.co.jp/detail/winie/b112.html
732Name_Not_Found:2006/01/02(月) 20:04:03 ID:???
バグの問題だったのか?
733Name_Not_Found:2006/01/03(火) 05:31:14 ID:???
バグってより非対応でしょ。まあ確かに斜体になるのは止してほしいが。
734Name_Not_Found:2006/01/03(火) 12:08:17 ID:???
いやだって色とかはつくじゃん。
非対応なのは一部なのに、730の質問はそういう質問か?
735Name_Not_Found:2006/01/03(火) 12:38:55 ID:7RzGrNRa
「optgroupのlabelによって表示されるテキスト」だけに適用させるセレクタは
設定できないでしょ。その意味で非対応なんだよ。
736Name_Not_Found:2006/01/03(火) 12:56:56 ID:???
>>735
先生!それと>>731の関係を教えてください!
737Name_Not_Found:2006/01/03(火) 17:48:01 ID:EFkndTgS
<ul>
<li>Yahoo</li>
<li>Google</li>
</ul>

とすると

* Yahoo
* Google

というように左と中がだいぶ空いてしまいます(特にFireFox)。

これを

*Yahoo
*Google

とコンパクトに表示する方法はありますでしょうか?

738Name_Not_Found:2006/01/03(火) 17:58:47 ID:???
>>737
inset
739Name_Not_Found:2006/01/03(火) 18:11:20 ID:???
>>731は参考情報。実際、select関係で装飾できないとか言ってるのは大抵それ。
740Name_Not_Found:2006/01/03(火) 18:16:21 ID:???
>>738
insetってborder-style:inset;ってこと?
ボーダがないと動かなくない?
741Name_Not_Found:2006/01/03(火) 18:52:35 ID:???
>>739
それじゃなくて、単に「それのみのセレクタに設定できない」ってほうだろ。

>>740
ttp://hp.vector.co.jp/authors/VA022006/css/lists.html#list-style-position
742741:2006/01/03(火) 18:53:39 ID:???
あ、たぶんinsetは誤記だろうと思ったんだが、738の意図は違うかも。
743Name_Not_Found:2006/01/03(火) 18:55:58 ID:???
>>740
おまいはレスしなくていいから
744Name_Not_Found:2006/01/03(火) 19:28:19 ID:???
>>743はinsetとinsideを勘違いしてる悪寒
745737:2006/01/03(火) 19:35:08 ID:EFkndTgS
list-style-position:outsideで左がつめて表示されるようになりました!
マーカーと文字の間をつめる方法はありますでしょうか?


746Name_Not_Found:2006/01/03(火) 19:36:08 ID:???
>>745
marginとpadding(ブラウザによって違う)
747Name_Not_Found:2006/01/03(火) 19:37:00 ID:???
>>745
つーか・・・outside?
748Name_Not_Found:2006/01/03(火) 23:18:47 ID:???
>>737
リストスタイルをなしにして
*って自分で入れる
749Name_Not_Found:2006/01/05(木) 11:15:03 ID:Ub+J0YSN
特にmediaオプション等指定していないのですが
印刷(プレビュー含)時にスタイルシートが適応されません。
なにかしないといけないのでしょうか?
それともおかしいのでしょうか?
ブラウザはIE6使っています、宜しくお願いします。
750Name_Not_Found:2006/01/05(木) 11:21:21 ID:???
>>749
これのことか?それとも単におまえが誤字してるだけか?
ttp://www.lucky-bag.com/archives/2005/12/print-background-image.html
751749:2006/01/05(木) 11:46:06 ID:Ub+J0YSN
>>750
ありがとうございます。
しかしちょっとこれとは違うみたいです。
背景画像ではなくてスタイルシートの定義内容全部というか
例えばテーブルの色ですとかそういうのが印刷時に無効になってしまうのです。

普通は何もしなくても適応されるものなんでしょうか??
752Name_Not_Found:2006/01/05(木) 11:52:50 ID:nMYGXIah
ttp://www7.big.or.jp/~mb2/bbs/
フレーム左側の文字に四角い白色の背景がついてるけど
どうやればいいのですか?
753Name_Not_Found:2006/01/05(木) 12:19:17 ID:???
>>752
CSSじゃないからスレ違い
754Name_Not_Found:2006/01/05(木) 12:21:49 ID:nMYGXIah
>>753
ではなんなのですか?
755Name_Not_Found:2006/01/05(木) 12:24:47 ID:???
>>751
それは例えば背景色が全部黒で白字なんてページを考えてみ。
印刷やってらんねーよとプリンタが文句言いそうな量になるだろ。
背景色はcssじゃなくても普通のプリンタだと付かないよ。
756Name_Not_Found:2006/01/05(木) 12:25:50 ID:???
>>754
スレ違いだとわかったんならここで聞かないでください。
757Name_Not_Found:2006/01/05(木) 12:30:24 ID:nMYGXIah
>>756
じゃあどこで聞けばよいのですか?
758Name_Not_Found:2006/01/05(木) 12:35:40 ID:???
759Name_Not_Found:2006/01/05(木) 12:39:38 ID:nMYGXIah
>>758
どう聞けばいいのですか?
760Name_Not_Found:2006/01/05(木) 12:46:54 ID:???
あなたの知りたいことをテキストボックスに入力。
761749:2006/01/05(木) 12:57:10 ID:Ub+J0YSN
>>755
そうでしたか。
あほな質問どうもすみませんでした。
762Name_Not_Found:2006/01/05(木) 12:58:23 ID:???
>>759
そんなことよりまず初めにソース見ろよ
763Name_Not_Found:2006/01/05(木) 12:58:31 ID:???
>>749
「ツール」メニュー→インターネットオプション→詳細設定
→1番下の、背景の色とイメージを印刷する、にチェック
764Name_Not_Found:2006/01/05(木) 13:34:39 ID:???
>>763
や、それプリンタによるダロ
765763:2006/01/05(木) 13:49:05 ID:???
>>764
そうは思ったけど、IEで背景が印刷されないとなると、これが真っ先に思いついたもので。
案外知らない人多いし。
プリンタ依存で背景が飛ぶなら、1度PDF化してから印刷すると良いと思われ。
フリーのPDFツールもあることだし。
766Name_Not_Found:2006/01/05(木) 14:11:37 ID:???
そもそも自分トコで印刷したいという質問だったのか?
閲覧者全員に、という質問ではないのか?
767749:2006/01/05(木) 14:22:07 ID:Ub+J0YSN
>>765
どうも有難う御座いました。IEの設定でOKでした。
まさにやりたいことがこれだったので勉強になりました。

>>766
一応今回は自分とこでできればOKです。
ちなみ閲覧者がするとなれば各PCで同じ設定しなければいけないということですね。
ご迷惑おかけしました。
768Name_Not_Found:2006/01/05(木) 14:24:48 ID:???
>>766
>>749は、IE6を使っている、と言っているので、自分トコでと推測。
本人に出てきてもらうのが手っ取り早いけど、もう見てないのかなぁ。
769Name_Not_Found:2006/01/05(木) 14:26:15 ID:???
ぉ、かぶった。解決できたようでよござんした。
770Name_Not_Found:2006/01/05(木) 14:52:26 ID:???
color: #fff; を指定してる場合アウト !?
771Name_Not_Found:2006/01/05(木) 15:19:32 ID:???
白いインクで印刷できるプリンタって一般にあるだろうか
772Name_Not_Found:2006/01/05(木) 16:05:12 ID:???
>>770
「ツール」メニュー→インターネットオプション→詳細設定
→1番下の、背景の色とイメージを印刷する、にチェック
773Name_Not_Found:2006/01/05(木) 16:15:09 ID:???
774Name_Not_Found:2006/01/05(木) 16:17:37 ID:???
>>771
そういう意味ではなくて、背景色を印刷しないで
白い文字を印刷すると読めないよね?

>白いインクで印刷できるプリンタって一般にあるだろうか
試しに白い文字に背景(黒)色を付けて印刷してごらん。



>>772
('・c_・` )イミネ
775Name_Not_Found:2006/01/05(木) 16:19:29 ID:???
あ、そうか。
印刷用のCSS作って背景色は白、文字色を黒にすれば…


解決じゃん。
776Name_Not_Found:2006/01/05(木) 16:22:35 ID:???
モニターでも、白ヌキ文字なんか読みにくいから、やめておけ。
777Name_Not_Found:2006/01/05(木) 16:31:34 ID:???
>>776
見出しとかで、背景画像が黒っぽくて
文字を白くてしる。\何か?
778Name_Not_Found:2006/01/05(木) 16:37:29 ID:???
見出しは別だな。
でも本文で白文字は困る、特にCRTディスプレイだと。Ctrl+Aってか?
779Name_Not_Found:2006/01/05(木) 16:49:04 ID:???
プログラマにゃ黒地に白字が多いし、長時間見てる分には
白地に黒字よりも優しいと思われ。
780Name_Not_Found:2006/01/05(木) 16:56:57 ID:???
可読性が低くなる閲覧環境が多いのを承知でどうしても黒地に白にしたいなら、
せめてfont-sizeは大きめに、そしてfont-weightも太目に設定すべし。
781Name_Not_Found:2006/01/05(木) 17:01:47 ID:???
眼の錯覚で有名な格子。ハーマン・グリッド現象ってものよ。
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
チカチカするでしょ? 白十字の真ん中に黒い霞が掛かって見えるっしょ。
これが黒地に白文字状態なんですよ。日本語は四角い漢字が多いから猶更。
782Name_Not_Found:2006/01/05(木) 17:04:01 ID:???
2ちゃんねるの配色が最強。
783Name_Not_Found:2006/01/05(木) 17:26:45 ID:???
>>780
大きめにっつーかどう足掻いたって文字サイズ指定は可読性が悪くなる罠
784Name_Not_Found:2006/01/05(木) 17:35:23 ID:???
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
・・・・いやこれもチカチカするって。色というか図形の問題のような。
785Name_Not_Found:2006/01/05(木) 17:38:56 ID:???
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
786Name_Not_Found:2006/01/05(木) 18:09:06 ID:???
╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋
╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋
╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋
╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋
╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋
787Name_Not_Found:2006/01/05(木) 18:42:07 ID:???
どれもこれも目がちらちら
788Name_Not_Found:2006/01/05(木) 19:29:01 ID:???
真っ白に真っ黒というのはコントラストがきつ過ぎる

白地に黒字、黒地に白字はどっちも白がまぶしいので
灰色寄りの色を使うなどしてマイルドにして欲しいところ
789Name_Not_Found:2006/01/05(木) 20:10:59 ID:???
個人的には灰色地に黒字が一番いい。
次は黒地に白字かな。
PGはやっぱそういう香具師が多い。
790Name_Not_Found:2006/01/05(木) 20:14:52 ID:???
2ちゃんねるの配色が最強
791Name_Not_Found:2006/01/05(木) 20:30:27 ID:5j1cIM8d
li{
height: 50px;
list-style: none;
}

liの中の文字を縦中央に配置したいんですが、どうすればいいですか。
vertical-alignを指定したのですが駄目でした。
792Name_Not_Found:2006/01/05(木) 20:35:25 ID:???
>>791
FAQ嫁・・・と思ったが、このスレなんか切れてんな。以下コピペ。

Q6:画面中央に配置するにはどうすれば?
A6:左右(水平方向)のセンタリングはA2に既出。垂直には色々な方法があります。
 「スタイルシート 縦中央(垂直中央)」参照のこと。
 http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm
vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。
793Name_Not_Found:2006/01/05(木) 21:13:43 ID:???
>>791
ぱでんぐ
794791:2006/01/06(金) 08:29:49 ID:???
ありがとうございます。
無事解決致しました。
ありがとうございました。
795Name_Not_Found:2006/01/06(金) 19:31:31 ID:???
とあるサイトのソースを見てみたら下記の様に3つの書き方で
記述されていました。 これはどういうことなのでしょうか?

div#localNavMenu ul li a:hover{
background:url(../img/common/submenu_arrow_on.gif) no-repeat 8px 8px;
background-color:#eeeeff;
width:188px;
}

* html div#localNavMenu ul li a:hover{
width:163px;
}

html[xmlns] div#localNavMenu ul li a:hover{
width:163px;
}
796Name_Not_Found:2006/01/06(金) 20:08:21 ID:???
>>795
CSSハック
でググってごらん。
797Name_Not_Found:2006/01/06(金) 23:11:29 ID:CsPgVrgw
CSSを使ってデザインする現在のスタイルでは
1pixelサイズの透明GIFを使ってデザインを調整するやり方は
もしかして邪道で排除すべきテクニックなんでしょうか?
798Name_Not_Found:2006/01/06(金) 23:18:04 ID:???
>>797
当然です。
つ paddingプロパティ
799795:2006/01/06(金) 23:23:42 ID:???
>>796 ボックスの解釈バグ回避なんですね。
width:188px がIE5*で
width:163px はその他、正しく理解するブラウザってことでいいのでしょうか?
800Name_Not_Found:2006/01/06(金) 23:43:48 ID:CsPgVrgw
>>798
昨日納品したホムペにも使いまくってた・・・orz
801Name_Not_Found:2006/01/06(金) 23:53:06 ID:???
「ホムペ」と言ってる時点で
802Name_Not_Found:2006/01/06(金) 23:54:08 ID:???
ホムーペジ
803Name_Not_Found:2006/01/06(金) 23:57:47 ID:???
ほーむぺーじ
804Name_Not_Found:2006/01/06(金) 23:59:28 ID:???
たうんぺーじ?
805795:2006/01/07(土) 04:21:00 ID:???
誰かレス下さい。。。
806Name_Not_Found:2006/01/07(土) 04:38:49 ID:???
807Name_Not_Found:2006/01/07(土) 09:12:49 ID:???
ぺーいち兄さん?
808381:2006/01/07(土) 10:26:04 ID:???
tableでcaptionに下線をつけて上に表示した時
table本体との間を空けたいのですがIEでは空きません。
marginで指定しても無理だしpaddingだと下線までの距離が開くだけです。
どうしたらよいでしょうか?

要はこのバグなんですけど
http://cssbug.at.infoseek.co.jp/detail/winie/b155.html

これでcaptionに下線がある状態です
809Name_Not_Found:2006/01/07(土) 11:58:11 ID:???
>>808 新規の質問はあげて。
caption {padding-bottom:0.5em;}
caption strong {border-bottom:1px solid #000;}/* text-decoration:underline; でも可。*/
<caption><strong>キャプション</strong></caption>
810Name_Not_Found:2006/01/07(土) 15:56:55 ID:???
>>808
俺も同じ事で悩んでたんだが、IEだと対象のテーブルが
border-collapse:separate;
でないと、ボーダーがテーブルと重なってしまうので見えないね。

画像で無理やり下線ひいて、パディングで調整したりしたよ。
811810:2006/01/07(土) 16:25:09 ID:???
連投すまん。

ちなみにその背景画像は、
caption {
background:url('画像') repeat-x bottom;
padding-bottom:5px; /*表本体との間隔*/
}
画像は下部に表本体との間隔をいれた透過GIFです。
HTML書き直したくない時などいいかなと。

でも809のやり方も結構いいね。俺もそうしようかな。
812Name_Not_Found:2006/01/07(土) 19:38:00 ID:XIApPvfm
質問です、一応最初だけageさせていただきます。
クラス属性の値を複数記述する用法があるかと思うのですが、例えば以下のように、

div.sample1 { color: #f00; }
div.sample2 { font-weight: bold; }
<div class="class1">この中は赤色になる。</div>
<div class="class2">この中は太字になる。</div>
<div class="class1 class2">この中は赤色かつ太字になる。</div>

で、さらに、class1とclass2が両方指定されている場合のみ追加でスタイルを指定したい場合、

div.sample1.sample2 { border: 1px solid #f00; }

と書けば、<div class="class1 class2">〜</div>のみ、ボーダーが表示されるはずですよね。
というか、私はそう把握しているのですが、まず、この認識で間違いはないでしょうか?

実際にいくつかのブラウザで確認してみたところ、WinのIE5.0、5.5、6.0では、
<div class="class1 class2">〜</div>だけでなく、<div class="class2">〜</div>にも、
ボーダーが表示されてしまいました。

これは、私の認識が何かおかしいのか、それとも、IEが、

div.sample1.sample2 { border: 1px solid #f00; }

を、div.sample2とも解釈して勝手にそちらにも適用させてしまっているのか、
そこがちょっと解らずに悩んでいます。
どなたかご回答いただけますと助かります、恐縮ですが宜しくお願いします。
813812:2006/01/07(土) 19:41:36 ID:???
すみません、>>812の書き込みですが、微妙に記述がぐちゃぐちゃでした。

クラス名が、sample1だったりclass1だったり混ざっていますが、
ただの記述ミスですので、どちらかに脳内統一してご覧になってください。
申し訳ないです。。。
814Name_Not_Found:2006/01/07(土) 19:49:45 ID:???
>>812
最初だけでなく質問者は騙り帽子のため常にID表示でヨロ。
そしてその認識は間違い。
ttp://hp.vector.co.jp/authors/VA022006/css/selector.html
815Name_Not_Found:2006/01/07(土) 20:01:13 ID:???
>>814
>>812です。認識の方が間違いとのこと、お恥ずかしい。
URLどうもありがとうございます。
そちらのページで勉強しなおしてきます。
816812:2006/01/07(土) 20:49:44 ID:XIApPvfm
>>814さん
WinIE6以下がcss2の「E.class1.class2」の用法に未対応のUAであるということまでは確認できました。
用法も、提示いただいたページのクラスセレクタの項目については目を通しました。

で、ちょっと確認なのですが、>>812の前半「まず、この認識で間違いはないでしょうか?」までの範囲で、
>>813に書いたとおりクラス名の記述がぐちゃぐちゃで恐縮なのですが)
まだ私の理解不足というか認識不足な点というのがあったりするのでしょうか?

変な質問になってしまって申し訳ないのですが、ご指摘を齟齬無く理解できているかどうかが不安で。
817Name_Not_Found:2006/01/07(土) 21:10:48 ID:???
>>816
あ、ごめん、「まず、この認識で間違いはないでしょうか?」までは合ってる。
IEの認識の話で。
818812:2006/01/07(土) 21:18:59 ID:XIApPvfm
>>817
>>812です。了解しました。
もう少しきちんと勉強してみます、ありがとうございました。
819Name_Not_Found:2006/01/08(日) 00:09:58 ID:1sXWUlbq
サイズが決まっているボックスの中に文章を書いて、その左下隅にぴったりとフッタを配置したいのですが、下のようにやっても文章のすぐ下に配置されてしまいます。positionをabsoluteにしたりいろいろ試しましたがわかりませんでした。
初歩的な質問かもしれませんが、解決策をよろしくお願いします。

<div style="width:200px;height:100px;border:1px solid green;">文章<div style="position:relative;bottom:0px;right:0px;">フッタ</div></div>
820Name_Not_Found:2006/01/08(日) 00:16:21 ID:???
>>819
「ドキュメントの量によって縦幅は決定されるべき」ということを理解した上で
div厨になる覚悟でないとできないが。
ttp://www.stylish-style.com/csstec/ultimate/fix-foot.html
821Name_Not_Found:2006/01/08(日) 04:35:51 ID:???
>>809
ありがとうございます。その方法でやってみます。

>>810
そういうやりかたもありますね。参考になりました。ありがとうございます。
822Name_Not_Found:2006/01/08(日) 10:44:17 ID:1sXWUlbq
>>820
ありがとうございました。
決して簡単なことではないのですね。
823Name_Not_Found:2006/01/08(日) 14:05:02 ID:???
テーブル不使用CSSのみで、画像ファイルを使った枠を、ほとんどのブラウザで破綻することなく表示させることは
現在可能なのでしょうか?
824Name_Not_Found:2006/01/08(日) 14:31:20 ID:???
僕のIEは画像は非表示にしてます。
825Name_Not_Found:2006/01/08(日) 14:47:38 ID:fpPT0mbY
文字サイズの指定にpxを使ってました。
そこでemか%にしようと思うんですが、
emの「文字の高さ」っていうのはどのサイズの文字が基準になってるんですか?
同様に%はどの大きさの文字に対する比率なんですか?
826Name_Not_Found:2006/01/08(日) 14:49:39 ID:???
emはmだしexはx。仕様書読みなさい。>>2にあるでしょ。
827Name_Not_Found:2006/01/08(日) 14:54:02 ID:???
828Name_Not_Found:2006/01/08(日) 15:05:44 ID:fpPT0mbY
>>826
>>827
ありがとうございます。
それで親要素のフォントサイズに相対するっていうのはわかったんですが、
親要素でフォントサイズを指定していなかった場合はどうなるのでしょうか。
829Name_Not_Found:2006/01/08(日) 15:24:48 ID:???
自分で調べる気は無いのかね?ヘルペス君
830Name_Not_Found:2006/01/08(日) 15:25:43 ID:???
>>828
ブラウザの初期設定
831Name_Not_Found:2006/01/08(日) 15:44:34 ID:???
>>829
すみませんです。

>>830
なるほど。参考になりました、ありがとうございます。
832Name_Not_Found:2006/01/08(日) 15:49:21 ID:???
body {font-size:100%;} でよし。
833Name_Not_Found:2006/01/08(日) 15:53:40 ID:???
> 100%
同様に%はどの大きさの文字に対する比率なんですか?
834Name_Not_Found:2006/01/08(日) 15:59:09 ID:???
835Name_Not_Found:2006/01/08(日) 18:04:10 ID:???
>>833
ブラウザの初期設定
836Name_Not_Found:2006/01/08(日) 18:22:33 ID:???
>>835
なるほど。参考になりました、ありがとうございます。
837Name_Not_Found:2006/01/08(日) 18:48:58 ID:???
>>834
読めないのはお前だろ。まあ、font-sizeの%に大きな相違は無いが。
http://www.w3.org/TR/CSS21/
838Name_Not_Found:2006/01/09(月) 00:24:22 ID:PDdZh3cD
質問です。
環境 
OS WindowsXP SP2
ブラウザ IE6  
OSの画面のデザインの設定 WindowsXPStyle
で、例えば、
<html>
<head>
<style>
.aaa{
background-color : red;
}
</style>
</head>
<body>
<input type="checkbox" value="checkbox1"/>
<input type="checkbox" class="aaa" value="checkbox1"/>
</body>
</html>
のように、チェックボックスの背景色を指定すると、
背景色を指定した側のチェックボックスのデザインが
WindowsXPStyleでなくなってしまいます。
回避方法はないのでしょうか。
839Name_Not_Found:2006/01/09(月) 00:25:43 ID:???
>>838
ありません
840838:2006/01/09(月) 00:58:30 ID:PDdZh3cD
>>839
ありがとうございます。
あきらめました。
841Name_Not_Found:2006/01/09(月) 01:14:03 ID:UGUvcZil
質問です。  
OS WindowsME
ブラウザ IE6

http://tff.blog43.fc2.com/?style3=1316&index
↑のテンプレートの横カレンダー部分だけを設置したいと思い
htmlとcssをコピーしたんですが

http://tff.blog43.fc2.com/
↑のように縦で変な表示になってしまっています。
842Name_Not_Found:2006/01/09(月) 01:31:56 ID:???
>>841
コピーできていない
843Name_Not_Found:2006/01/09(月) 01:36:05 ID:???
>>841はマルチ。
844Name_Not_Found:2006/01/09(月) 05:18:53 ID:opXhZcyg
cite:before {
content: "引用元:"
}

の、
content: "引用元:"
の最後には、「;」が要りますか?
jigsaw.w3.org/
でチェックしてもエラーにならないんですけど、どうなんでしょうか?
845Name_Not_Found:2006/01/09(月) 05:50:04 ID:opXhZcyg
「」はCSSで実現したほうがいいでしょうか?
846Name_Not_Found:2006/01/09(月) 06:56:57 ID:???
aaa {
bbb: ccc;
ddd: eee;
fff: ggg /*←最後のやつは「;」がなくてもいい*/
}
847Name_Not_Found:2006/01/09(月) 07:13:32 ID:opXhZcyg
>>846
thx!!!!!
本当にありがとうございます!
ずっと疑問だったんです!
thx!
848Name_Not_Found:2006/01/09(月) 07:17:40 ID:EAHLoxU4
あるブロック要素に高さをpxで指定して
さらにその中の文字をその要素内の最下部に配置したいんですが
どうすればいいんでしょうか?

html部分はたとえばこんな感じです
<hn>文字列</hn>

vertical-alignはインライン要素とテーブルセル要素にしか使えない(効かない)みたいで
またpaddingを指定してtopに大きな値bottomに小さい値をとると当然のことながら
その要素の高さがheightで指定した値ではなくなってしまいます

よろしくお願いします
849Name_Not_Found:2006/01/09(月) 08:34:51 ID:???
>>845
「」に意味がある小説の会話文なんかは書いたほうがいい。
「」が強調するための引用文の全部だったらCSSで実現したほうがいい。
↑と言いつつここらへんは人によって感覚が違うので適宜ヨロ。
というかStrictスレのほうがお似合い。

>>848
簡単なのはline-heightでの調節。
もっとも正確にやりたいんだったら>>820のようなdiv入れ子。
850Name_Not_Found:2006/01/09(月) 11:27:01 ID:+IgFL2hz
あsdfghjkぁ;あ
851Name_Not_Found:2006/01/09(月) 13:54:25 ID:???
>>849
line-heightは文字の上下が同じ広さになるんじゃない?
852Name_Not_Found:2006/01/09(月) 14:02:16 ID:???
>>851
その上の幅がボックスの幅になれば下に置かれることになる。
853Name_Not_Found:2006/01/10(火) 13:09:40 ID:GCV8rmWr
すみません。
CSSの印刷まわりの部分を勉強したいのですが
わかりやすいサイト等どこかありませんでしょうか?
854Name_Not_Found:2006/01/10(火) 13:46:02 ID:???
855Name_Not_Found:2006/01/10(火) 13:51:34 ID:???
<link rel="alternate" media="print" title="PDF" href="〜.pdf" />
で印刷用代替のPDFを提供するといいよ
などとCSSスレで言ってみる
856Name_Not_Found:2006/01/10(火) 14:14:39 ID:gTIvlsCK
<input name="imageField" type="image" src="" class="submit">とかのボタンをカーソルが乗っかった時に1pxずらしたいのですが、WindowsIEでこれを実現する方法はありますか?
JavaScriptではなく、CSSで実現させたいです。

.submit:hover{
position:relative;
top:1px;
left:1px;
}

これで、Firefox/Safariは動きます。
857Name_Not_Found:2006/01/10(火) 14:37:35 ID:???
激しく迷惑なボタンだな・・・
858853:2006/01/10(火) 17:08:24 ID:GCV8rmWr
>>854-855 
ありがとうございました。
859Name_Not_Found:2006/01/11(水) 14:37:59 ID:OpSDq/4C
floatを使ってbox1の右にbox2を配置し、
box1のwidthの値に150pxを指定した時…

box2のwidthをウィンドウサイズ-150px(box1の値)とする…

なんて事、できるのでしょうか?

最小ウィンドウサイズに640*480を想定していて、
box1=150px box2=75%
としているのですが、フレームの様に値*みたいにできないものかと…。
860Name_Not_Found:2006/01/11(水) 14:40:02 ID:???
>>859
JSでウィンドウサイズを取得してCSS出力。
DHTMLの分野になるな。
861Name_Not_Found:2006/01/11(水) 14:41:16 ID:???
まあそれ以前に、右のボックスにwidthを指定しなければいいだけの話という気がしないでもない。
862Name_Not_Found:2006/01/11(水) 14:45:48 ID:???
>>859に便乗ですけど
widthなどの数値を
100%-200px
とか
10em+100px
って指定したいときが多々あるんですけどやっぱり無理なんでしょうか
863Name_Not_Found:2006/01/11(水) 14:51:45 ID:???
>>862
前者は>>860
後者はフォントサイズ固定なら自分で計算して出るという程度。
864Name_Not_Found:2006/01/11(水) 14:53:34 ID:???
つーかそういう指定を多々やりたいって時点で何かCSSデザインの根本を間違えてる気が・・・。
素直にテーブルレイアウトかフレームでいいじゃん。
できないことをムリにやろうとする必要はない。できるものでできることをするべき。
865Name_Not_Found:2006/01/11(水) 14:59:55 ID:???
テーブルレイアウトかフレームかじゃなくて
すべてpx指定の非リキッドデザインにするしかないな
866Name_Not_Found:2006/01/11(水) 15:05:59 ID:???
非リキッドは質問者の希望じゃないだろ。
それで代用できると考えを変えるんならそれでもいいがね。
867初心者です:2006/01/11(水) 15:32:00 ID:r8g4C+T8
htmlでhpを作っていて tableタグを使っているのですが 
<td> </td>の 入力のフォントのサイズを <tr> </tr>の中
で一括でサイズ変更したいのですが 何か方法ありますか?
868Name_Not_Found:2006/01/11(水) 15:42:01 ID:???
tr {
font-family : "Times New Roman";
font-style : italic;
font-weight : bold;
font-size : x-small;
color : #c9bac9;
}

こんな感じ 詳しくは勉強してね。
869Name_Not_Found:2006/01/11(水) 15:45:54 ID:???
むこうで礼も言わなかった「初心者」と名乗る香具師を相手にする>>868に萌え。
870Name_Not_Found:2006/01/11(水) 15:52:05 ID:???
>>867
こんなふうに書くんだよん
属性値は自分の好みに変えて・・・
ブラウザで見れば表示されるよ

<head>
*
*
*
*
<style type="text/css">
<!--
tr {
font-family : "Times New Roman";
font-style : italic;
font-weight : bold;
font-size : x-small;
color : #c9bac9;
}
-->
</style>
</head>

<body>
871Name_Not_Found:2006/01/11(水) 15:56:41 ID:???
むしろ萎え。
クレクレ厨増やしてどーすんだよ・・・
872Name_Not_Found:2006/01/11(水) 16:03:25 ID:???
冬厨早期撲滅対策
873Name_Not_Found:2006/01/11(水) 16:37:59 ID:???
aaa.cssから@importでbbb.cssを呼び出した場合で
もし同じ要素に同じプロパティを指定していてその値が異なっていた場合
どちらが優先されるのでしょうか?

検索したら
> インポートされたスタイルシートは
> 他のすべての規則より先行する位置に書かれているものとして扱う。
とあったのですがこれは優先度が高いという意味でしょうか?
つまりaaa.cssで指定したものよりもbbb.cssで指定したものが反映されるってことでしょうか?
874Name_Not_Found:2006/01/11(水) 16:48:21 ID:???
>>873に追記ですが
aaa.cssからbbb.cssとccc.cssを
@import url(bbb.css);
@import url(ccc.css);
という順番で呼び出した場合で
bbb.cssとccc.cssに同じ要素の同じプロパティに違う値を指定していた場合は
どちらが優先されるのでしょうか?
875Name_Not_Found:2006/01/11(水) 17:02:20 ID:???
・・・・試してから聞いてるんだよな?もちろん。
876Name_Not_Found:2006/01/11(水) 17:26:50 ID:???
>>875
あ、すみません、>>873のパターンでは
IEでもfirefoxでもaaa.cssのほうが優先されていました。
だから検索して出てきたものに書かれてる意味はどういう意味なのかなーっと
877Name_Not_Found:2006/01/11(水) 17:30:59 ID:???
>>875
>先行する位置に書かれているものとして扱う
これは優先する、という意味ではない。
同ファイル内でも先行のプロパティ値を後続のプロパティが書き換えたら、
あとで指定したほうに置き換えられる。
だから>>874のパタンでもccc.cssのほうで書き換えられる。
878Name_Not_Found:2006/01/11(水) 17:35:20 ID:???
>>877
@importの部分にその指定したcssが代入されると考えれば委員ですね
やっと理解できました
ありがとうございます
879Name_Not_Found:2006/01/11(水) 20:31:31 ID:???
p要素などをうまい具合に中央に表示したいのですが、なかなかうまくいきません
これはmarginで指定するのでしょうか?
880Name_Not_Found:2006/01/11(水) 20:32:29 ID:???
5.ブロックレベル要素をセンタリングする方法
 http://www.mozilla.gr.jp/standards/webtips0004.html

解決しそうです
881Name_Not_Found:2006/01/11(水) 20:45:33 ID:???
マッチポンプ?
882Name_Not_Found:2006/01/12(木) 05:36:56 ID:???
言葉が乱れている。

>>874
> 同じ要素
同じセレクタ

>>877
> 書き換え
この種の話題では、書き換えという言葉と上書きという言葉を適切に使い分けなければならない。
body { margin: 0; }
body { margin: 1%; }
後の規則がスクリプトで削除された場合、先の規則が適用される(適用可能ならば)。
こういうのは、書き換えとは言わない。
優先されなかった規則も残っている。
上書きと言うのが最も相応しい。
仕様にも、rewrite とは書かれていない。override と書かれている。
883Name_Not_Found:2006/01/12(木) 12:13:32 ID:???
はいはいわろすわろす
884Name_Not_Found:2006/01/12(木) 17:03:32 ID:???
cssで以下のような表示をしたいのですがどうすればよいのでしょうか?
<TABLE border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<TR><TD height="50" bgcolor="black"></TD></TR>
<TR><TD height="100%"></TD></TR>
<TR><TD height="20" bgcolor="black"></TD></TR>
</TABLE>
試しに、
<DIV style="height:50px;background-color:black;"></DIV>
<DIV style="height:100%;"></DIV>
<DIV style="height:20px;background-color:black;"></DIV>
としたところ、100%が画面のサイズとなってしまってできませんでした。
50と20は固定幅にしたいので%に変更する以外で出来るのであれば方法を教えてください
885Name_Not_Found:2006/01/12(木) 17:12:00 ID:???
>>884
???
テーブルもdivもIE/Firefox共に同じに表示されるんだけど。
100%が画面のサイズにならないって状況がわからん。
886884:2006/01/12(木) 17:40:28 ID:???
>>885
自分が使っているIE6SP2/Firefoxでは
TABLEだと画面をはみ出さずに、上部と下部に背景が黒い部分が出来ます。
DIVだと上部の背景黒は見えますが、下部の背景黒はスクロールしなければいけません。

TABLEの100%は画面の高さ。
TDの100%は固定されていない余白(TABLEの100%から上部と下部を除いた)高さ。
↑これをCSSでやりたいのですが・・・。
887Name_Not_Found:2006/01/12(木) 17:54:48 ID:???
ああゴメン、Strictでやってたからテーブルのほうもheight効いてなかっただけだ。
>>819-820
888884:2006/01/12(木) 20:01:37 ID:???
>>887
ありがとうございます。
参考にしてやってみたところ上と下は固定されたのですが、
overflow:auto;をつける場所が全体だけになってしまいましたorz
先ほどのやつで真ん中の100%だけをscrollさせるにはどうすればいいのでしょうか?

フレームは使いたくないのでわかる方教えてください。
889Name_Not_Found:2006/01/12(木) 20:47:07 ID:???
・・・翻訳キボンヌ
890Name_Not_Found:2006/01/12(木) 20:59:56 ID:???
>>888
> overflow:auto;をつける場所が全体だけになってしまいましたorz
この部分の意味が分からないけど、真ん中が
<div style="height:100%; overflow:auto;"></div>
ではダメってことかな?
高さが大きすぎると文書全体にスクロールが必要になる可能性もあるけど。
891884:2006/01/12(木) 21:45:41 ID:???
最初の書き方が悪かったですねorz
仕切りなおさせてください・・・。

<frameset rows="50, 1*, 20" cols="1*">
<frame name="banner" scrolling="no">
<frame name="header" scrolling="auto"> ←ここだけスクロール表示(CSSで2分割中)
<frame name="detail" scrolling="no">
</frameset>
を1つのページでやりたいのでCSSでやるにはどうすればいいのでしょうか?
50pxと20pxの部分は1行の文字(タイトルと権利系のメニュー及び著作権表示)です。
892884:2006/01/12(木) 21:49:04 ID:???
追記。
1行の文字はcssにするために、画像に変更しました。
もし、文字のままでいけるならありがたいかもです。

さっき、TABLEで例を出したのはTABLEデザインをしようとしていたからです・・・。
893Name_Not_Found:2006/01/12(木) 21:55:22 ID:???
日本の著作権は自動発生だから付けるのやめたら。
フレームよりウザイぞそれ。
894884:2006/01/12(木) 22:18:59 ID:???
>>893
Copyright (ry. 使用条件 個人情報について
横にリンクもついてます。(MSのサイト風)
895Name_Not_Found:2006/01/12(木) 22:47:20 ID:???
オリンピック公式サイト
http://en.beijing2008.com/

つw3c[このHTMLは -187点です]
896890:2006/01/12(木) 23:09:26 ID:???
>>891
overflowを使う時は、高さを固定しないとダメっぽいね。
JavaScriptを使えば、ウィンドウサイズにきっちり合わせられるかもしれないけど。

<div style="height:50px;">HEADER</div>
<div style="overflow:auto; height:40em;">
<p>C</p><p>O</p><p>N</p><p>T</p><p>E</p><p>N</p><p>T</p>
<p>C</p><p>O</p><p>N</p><p>T</p><p>E</p><p>N</p><p>T</p>
<p>C</p><p>O</p><p>N</p><p>T</p><p>E</p><p>N</p><p>T</p>
</div>
<div style="height:20px;">FOOTER</div>
897884:2006/01/12(木) 23:47:33 ID:???
>>896
そのページはJavaScriptも使っているので一時的にそっちも試してみたいと思います。
JavaScriptに対応していないブラウザは暫くは放置かな・・・。
898Name_Not_Found:2006/01/12(木) 23:51:58 ID:???
できる腕がないんだったら素直にフレーム使っとけや・・・
899Name_Not_Found:2006/01/13(金) 00:47:27 ID:???
【これさえ読めば僕が例え幼稚園児だったとしても理解できそうな気がするんです!!】
・ごく簡単なHTMLの説明
 http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
 http://www.zspc.com/stylesheets/
・ZSPC - CSS2対応状況ガイド
 http://www.zspc.com/documents/css2/
・CSS1テストスイート
 http://www.doraneko.org/css1test/
・ばけらの CSS リファレンス
 http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・K@tsukun's PAGE! > CSS Reference
 http://hp.vector.co.jp/authors/VA022006/css/index.html
・K@tsukun's PAGE! > 付録:CSS対応状況表
 http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS Laboratory対応表・一覧
 http://is.vis.ne.jp/charts/index.xhtml
・ブラウザのHTML4/CSS対応度テスト
 http://homepage1.nifty.com/emk/moz/browsertest.html
・CSSバグリスト@CSSバグ辞典スレッド
 http://cssbug.at.infoseek.co.jp/index.html
900Name_Not_Found:2006/01/13(金) 01:27:36 ID:???
ナニコレ?

CSS(スタイルー大柴シート)質問スレ51日目
http://pc8.2ch.net/test/read.cgi/hp/1137080639/l50
901Name_Not_Found:2006/01/13(金) 01:36:00 ID:???
無視汁。
まあ再利用してもいいけどまだ早過ぎ。
902Name_Not_Found:2006/01/13(金) 01:45:01 ID:???

まあ次スレッド立てるときは、FAQの尻切れトンボは止してくれよな。
http://makimo.to/2ch/pc8_hp/1126/1126795599.html の1-14を写せ。
903Name_Not_Found:2006/01/13(金) 04:28:25 ID:OqRJzN5I
質問させて下さい。

CSS(外部呼び出し)で行間を230%で指定し、文章にルビをふると
ルビをふった行とその上の行の行間が開いてしまいます。
IE5?W98での確認ですが、一度他の質問板にて
ruby{margin-right: 1px;}
rt{vertical-align: bottom;}
と入れる事で行間が一部広くなるという問題は解決致しました。
が、これを記述すると今度はルビ文字が(右に1ptのスペースがあるせいだと
思うのですが)ずれてしまいます。
解決法はありますでしょうか?
宜しくお願い致します。
904Name_Not_Found:2006/01/13(金) 10:08:04 ID:???
>>903
http://www.shoshinsha.com/cgi-bin/bbs_new/c-board.cgi?cmd=ntr;tree=5404;id=situmon
これだな。
で、おまいさんが書いたソースは?
905Name_Not_Found:2006/01/13(金) 10:22:56 ID:???
>行間を230%で指定し
行間、広すぎ。でも、それだけ行間があれば、ルビも含められるのでは?
元の質問では「行間を110%と「%」で設定し」とあるが。
906Name_Not_Found:2006/01/13(金) 15:13:00 ID:jTRqsxUc
質問です。

<body>
<h1>このページのタイトル「ほげー」</h1>
<p>ほげほげほげほげほげほげ。ほげほげほげほげほげほげ。</p>
<p>ほげーほげーほげーほげーほげーほげー。</p>
        (以下、<p>がずっと続く)
</body>

上記のように、文章量が多くて印刷すると数ページにまたがるというボリュームのページで、
印刷時にh1の部分がどの用紙の頭に必ず入るというようなことはCSSでできるのでしょうか。

よろしくお願いします。
907Name_Not_Found:2006/01/13(金) 15:31:41 ID:???
>>906
ほげほげってふざけてるの?
908Name_Not_Found:2006/01/13(金) 15:38:11 ID:???
909Name_Not_Found:2006/01/13(金) 15:48:40 ID:???
(´;ω;`)ふざけてないです
910Name_Not_Found:2006/01/13(金) 15:51:57 ID:???
なるほど替え玉って意味ね。
ではとりあえずhogeときますね。
911906:2006/01/13(金) 15:55:09 ID:???
すみません、例として「ほげ」を使用しました。
申し訳ありません。あと、909は私ではありません。
912Name_Not_Found:2006/01/13(金) 16:06:59 ID:???
>>906
プリントメディアのCSSでh1をposition:fixed。
913906:2006/01/13(金) 19:07:52 ID:???
>>912
お答えありがとうございます。
早速試してみたところ、IE以外(NN7.1、Opera8、Firefox1)では狙い通りになりました。
Winでしか確認してないんですけど…。
position:fixedというのは、IEは対応してないんですね。ビックリしました。

IEを切り捨てるわけにもいかないので、「長いページ」という構成そのものを考え直すか
h1を各ページに印刷するのを諦めるか、しないといけないみたいですね…orz

お答えいただいて本当にありがとうございました。
914Name_Not_Found:2006/01/13(金) 19:17:01 ID:???
h1を画像化し、それを背景画像にすれば? background-attachment:fixed;で。
915Name_Not_Found:2006/01/13(金) 19:36:16 ID:???
>>913
印刷のほうが大事なんだったら、
HTMLじゃなくてPDFでやるのが一番現実的。
916Name_Not_Found:2006/01/13(金) 19:52:50 ID:jcxTxPP3
position:fixedをoverflowによる疑似フレームで再現しても、
印刷時にはうまくゆかないんだっけ?
917Name_Not_Found:2006/01/13(金) 21:04:00 ID:???
プリンタの設定によると思うけど
普通<title>属性が書類のheaderかfooterに付かない?
<title>きっちりしておけば良くない?
プリント書類にヘッダフッタ入れるのも、通し番号入れるのも
ユーザーに任せて欲しい。
918Name_Not_Found:2006/01/13(金) 23:17:04 ID:bKuKrTUt
インラインでホバーならアンダーラインしたい。
<a href="" style=text-decoration:none;a:hover:text-decoration:underline>xx</a>
教えて。えらい人。
919Name_Not_Found:2006/01/14(土) 04:14:11 ID:???
>>918
> インラインで
HTMLのstyle属性の値として記述、という意味でのインラインだろうが、実装されていない。
http://www.w3.org/TR/css-style-attr
920Name_Not_Found:2006/01/14(土) 08:06:37 ID:???
>>918
htmlに直接記述する場合はjavascriptを使うしかないんじゃない?
onmouseoverとか。
921Name_Not_Found:2006/01/14(土) 13:10:43 ID:???
<br>
<br>
ってやっちゃだめなんですか?
922Name_Not_Found:2006/01/14(土) 13:44:58 ID:???
>>921
スレ違い。
923Name_Not_Found:2006/01/14(土) 14:01:52 ID:???
>>921
スレ違い。
924Name_Not_Found:2006/01/14(土) 14:29:13 ID:???
>>921
タグとしてはかまわないけどw3cでは減点されるよ
925Name_Not_Found:2006/01/14(土) 14:31:13 ID:???
ただ見栄えを良くするための改行ならCSSでやるべき。
926Name_Not_Found:2006/01/14(土) 15:47:39 ID:???
>>921 .2step-css のヤツだな
927Name_Not_Found:2006/01/14(土) 17:51:22 ID:???
スレ違いとわかっていながらレスするおまえら萌え
928Name_Not_Found:2006/01/14(土) 18:52:26 ID:???
次スレマダー?
929Name_Not_Found:2006/01/15(日) 00:00:59 ID:???
>>922
おまいは margin を取りたいだけなんじゃないかと小一時間。
930Name_Not_Found:2006/01/15(日) 00:49:34 ID:???
>>929
誰も突っ込んでくれなかったから自分で突っ込んだのか?
931Name_Not_Found:2006/01/15(日) 03:29:48 ID:ZOXlSxHT
すみません。
CSSレイアウトで上部マージン0に設定しても
firefoxだと数ピクセル分の空きができてしまうのですが、
キッチリ上に詰める方法をご存知でしたら教えてください。
よろしくお願いいたしますm(_ _)m
932学生:2006/01/15(日) 05:45:09 ID:/4Ng90Sy
すいません。質問させてください。
http://www.citinet.jp/
↑このサイトのヘッダーにあるプルダウンメニューを
ボクもこんな感じのものが作ってみたいと思い、ソースを見てローカルで
イジってたんですが、(もちろんUPはしてません。)
動作しません。
DWしてきた状態のままですと、一番右の「会社案内」が
onmouseの状態で下に5個副メニューが出た状態になります。

正常に動作させるにはどうすれば良いでしょうか?
皆様お忙しいと思いますがご回答よろしくお願いします。
933Name_Not_Found:2006/01/15(日) 06:49:04 ID:???
とりあえず、CSSとJavaScriptの違いを勉強してくること
それとIEでしか表示できないソースは真似しないほうがいいと思うよ
934Name_Not_Found:2006/01/15(日) 06:50:36 ID:???
>>932
ソースをまじまじ見たわけじゃないけどjavascriptの領域じゃないかといってみる。
そっちの質問スレで訊くのがいいと思う。

firefoxではうごかなかったのでどんなメニューなのかもわからんかった。
935学生:2006/01/15(日) 07:09:52 ID:Njuz7XM2
ご回答ありがとうございました。
いろいろ検討してみます。
936Name_Not_Found:2006/01/15(日) 07:50:31 ID:???
>>931
普通は空かない。何か書き方間違えてると思われ。
937Name_Not_Found:2006/01/15(日) 10:41:11 ID:???
質問はソース出して具体的に。>>931
938Name_Not_Found:2006/01/15(日) 14:35:37 ID:6Br7vQKM
.main{
font-size: 12px;
}
.box3{
background-color: #77ff77;
width: 40%;
height: 150px;
border: 1px solid #dddddd;
float: left;
}

.box4{
background-color: #ffaaaa;
width: 60%;
height: 150px;
border: 1px solid #dddddd;
float: left;
}

<div class="main">
<div class="box3"></div>
<div class="box4"></div>
</div>

40%と60%の割合でbox3とbox4を横に並べたいのですが、
上の書き方ではなぜかbox4が下段に落ちてしまいます。
60%を59%に変更すればちゃんと並んでくれるのですが、
微妙な間が開いてしまうので出来れば100%で使いたいのですが…

これは何が原因なのでしょうか?どなたかご教授お願いします。
939Name_Not_Found:2006/01/15(日) 14:53:16 ID:???
>>938
borderの幅は、widthに含まれないので、938のCSSだと
 40% +1px +1px +60% +1px +1px >100%
と計算され、100%を超える。なのでbox4が下に落ちる。

回避したければ、
1.borderを指定しない
2.widthの合計を95%などと小さめに見積もる
3.以下参照
 <div style="width:40%;">
   <div style="border:1px solid #dddddd;"></div>
 </div>
 <div style="width:60%;">
   <div style="border:1px solid #dddddd;"></div>
 </div>
 みたいに入れ子にする。div厨っぽいが。

940Name_Not_Found:2006/01/15(日) 15:01:58 ID:6Br7vQKM
>>939
ありがとうございます。
borderのサイズ分が100%を超えていたのが原因なのですね。
とても参考になりました。
941Name_Not_Found:2006/01/15(日) 15:16:01 ID:???
次スレのスレタイは今までのやつに戻すよ?
/* CSS・スタイルシート質問スレッド【51th】 */
942Name_Not_Found:2006/01/15(日) 15:49:54 ID:ZOXlSxHT
>936-937
ソースは下記の通りです。

#container {
width:750px;
margin-right: auto;
margin-left: auto;
position: relative;
margin-top: 0px;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #000000;
border-left-color: #000000;
height: 1000px;
background-color: #FFFFFF;
}
* {
margin: 0px;
padding: 0px;
}
h1,h2,h3,h4,h5,h6,p,address{
font-size:100%;
font-weight:normal;
font-style:normal;
}

firefoxだと
#containerの上部に数ピクセルの余白ができてしまうのですが、
ここをきっちり詰める方法がどうしてもわかりません><
ブラウザのバグなんでしょうか?
943941:2006/01/15(日) 16:04:32 ID:???
立ててみるよ。
944Name_Not_Found:2006/01/15(日) 16:09:34 ID:???
>>942
おまいなぁ・・・    もういいや
945606:2006/01/15(日) 16:38:03 ID:fqn64Xfs
http://nyaromenyarome.hp.infoseek.co.jp/index.html
モジラだとバグります。text-indentがなぜか適応されてないみたい。
教えてエロイ人。
946941:2006/01/15(日) 16:41:43 ID:???
次スレ:

/* CSS・スタイルシート質問スレッド【51th】 */
http://pc8.2ch.net/test/read.cgi/hp/1137310503/l50
947Name_Not_Found:2006/01/15(日) 17:26:27 ID:???
51stじゃないのか?
948Name_Not_Found:2006/01/15(日) 17:43:27 ID:???
CSS(スタイルー大柴シート)質問スレ51日目
http://pc8.2ch.net/test/read.cgi/hp/1137080639/l50

これは?
949941:2006/01/15(日) 19:13:59 ID:???
>>948
スレタイが駄目なんじゃない?
(スタイルー大柴シート)
950Name_Not_Found:2006/01/15(日) 19:17:38 ID:???
>>945
と、とりあえずHTMLが悲惨なので、HTML-lintで確認して、直してごらん。
それでも変だったらまたおいで。
951931:2006/01/15(日) 19:52:35 ID:ZOXlSxHT
情報が不足していたようなので補足します。

#container {
width:750px;
margin-right: auto;
margin-left: auto;
position: relative;
margin-top: 0px;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #000000;
border-left-color: #000000;
height: 1000px;
background-color: #FFFFFF;
}
* {
margin: 0px;
padding: 0px;
}
h1,h2,h3,h4,h5,h6,p,address{
font-size:100%;
font-weight:normal;
font-style:normal;
}

IE6では意図した通りに表示されるのですが、
firefox1.5だと#containerの上部に数ピクセルの余白ができてしまいます。
余白を空けない方法をご存知の方いらっしゃいましたら教えてください。
よろしくお願いいたします。
952606:2006/01/15(日) 19:52:57 ID:???
>>950
色々いじくってたら直りました。ありがとうございます。おそらくもう大丈夫だと。
953Name_Not_Found:2006/01/15(日) 21:13:31 ID:???
>>951
line-height
954Name_Not_Found:2006/01/15(日) 21:14:50 ID:???
>>952 
無駄に長いスタイル指定に萎え。もっと簡略化できるぞ。
position: relative; はなんのため?
スタイルを適用させるHTMLソース例も出しなさい。長くせず、キモの部分だけな。
955Name_Not_Found:2006/01/16(月) 18:49:53 ID:???
今さらなんだが、
>>637ってoverflow:hidden;で指定幅のみ選択になるよな。
でもここらへん、確かMacIEで表示できない細かい条件があったような気がするんだけど、
MacIE環境持ってる人、知らない?hiddenじゃやっぱり危険?
956Name_Not_Found:2006/01/17(火) 05:24:29 ID:???
MacIE は overflow:auto; すると display:none; みたいになってしまうからいやん
957Name_Not_Found:2006/01/17(火) 12:11:11 ID:???
すみません。質問します。
CSSでデザインされたとてもカッコいいサイトを見つけました。
参考にさせてもらおうと思い、CSSの中身を除いた※1のですが、

@import url("base2.css");

/*\*//*/
@import "ie5mac.css";
/**/
このような記述が出てきてCSSが見れませんでした。
どうすればいいでしょうか。
サイトを晒したいけど、許可をとっている訳ではないので止めておきます。
よろしくお願いします。m(_ _)m

※1 http://ホームページ名//css/base2_im.css ←を入力

958Name_Not_Found:2006/01/17(火) 12:33:29 ID:???
959Name_Not_Found:2006/01/17(火) 12:39:25 ID:???
>>957
ちなみにそれバグの多いMacIE用ハックだから、
一般用CSSはそれじゃないと思われ。その部分はただの回避策じゃないかな。
960Name_Not_Found:2006/01/17(火) 13:05:03 ID:???
>>958 >>959
レスありがとうございます。中身を見ることができましたm(_ _)m
961Name_Not_Found:2006/01/18(水) 09:19:00 ID:???
全体を包むcontainerがあり、上からheader
sidebar(左フロート)main(右フロート)ときて
下にfooterがあるレイアウトで、全部のコンテンツより縦の大きい解像度で見ると
footerの下には何も出ません。
これをcontainerの幅でその下にも背景を出したい場合どうすればよいでしょうか?

説明がわかりづらいくてすみません
例としては
http://www.cyberagent.co.jp/company/
http://www.nttdocomo.co.jp/utility/privacy/
とかです。
962Name_Not_Found:2006/01/18(水) 11:52:34 ID:???
963Name_Not_Found:2006/01/18(水) 11:57:07 ID:???
>>962
ありがとうございました
964Name_Not_Found:2006/01/18(水) 14:35:51 ID:???
#navi a:link, a:active, a:visited {
〜略〜
}

#navi a:hover {
〜略〜
}

 上記のようにスタイルシートを記述しているのですが、なぜか <div id="navi"></div> で
囲っていない部分にも a:link, active, visited が影響されてしまいます。(hovor は適用されてません)
 原因はなんでしょうか? W3C や HTML-Lint でチェックはしたのですが…
965Name_Not_Found:2006/01/18(水) 14:47:16 ID:???
http://pc8.2ch.net/test/read.cgi/hp/1137080639/29
からきました

<dt>DT1</dt>
<dd>DD1</dd>
<dd>DD2</dd>
<dt>DT2</dt>
<dd>DD3</dd>
<dd>DD4</dd>
<dd>DD5</dd>

というのを
DT1 DD1 DD2
DT2 DD3 DD4 DD5
と並べて表示したいのですが
dt
float: left
clear: both
dd
float: left
だとWinIEで
DT1 DD1 DD2 DD3 DD4 DD5
DT2
となってしまいます。
どうやったら解決できますか
966Name_Not_Found:2006/01/18(水) 14:47:21 ID:???
#navi a:link, #navi a:active, #navi a:visited
に修正。
967Name_Not_Found:2006/01/18(水) 14:49:12 ID:???
>>966
感謝!
968Name_Not_Found:2006/01/18(水) 14:51:18 ID:???
969Name_Not_Found:2006/01/18(水) 15:08:39 ID:???
>>968
ありがとうございます。

もう一つ質問なんですが
ul {
background-color: #FFFFFF;
}
とやるとIEだと背景色が適用されますがFirefox1.5だと適用されません。
どっちが正しい挙動なのでしょうか
970Name_Not_Found:2006/01/18(水) 15:15:36 ID:???
FireFox1.5で
> <q cite="引用元">引用文</q>

> 「引用文」(引用元)
と表示してさらに"(引用元)"の部分のフォントや色を"「引用文」"とは別のものを適用したいのですが
> q { quotes: "「" "」"; }
> q:after { content: "(" attr(cite) ")"; } /*←fontとかcolorとか指定する予定*/
とすると
> 「引用文(引用元)
のように表示されます(閉じるかぎかっこがない)
> q:before { content: "「"; }
> q:after { content: "」" "(" attr(cite) ")"; }
とすると一応
> 「引用文」(引用元)
と表示されるのですがそれだと当然ながら
"(引用元)"の部分だけに"「引用文」"とは別のスタイルを適用することができません
("」(引用元)"の部分にスタイルが適用される)
どうすれば思い通りにできるでしょうか
971969:2006/01/18(水) 15:28:35 ID:???
>>969
そんなことなかったです
リスト要素がulの外に配置されてるような状況になってたようです。
これはこれでバグだとおもいますが
972Name_Not_Found:2006/01/18(水) 15:28:41 ID:???
>>969
Win2000Firefox1.5で変わることを確認。
スペルミスを確認汁。
973Name_Not_Found:2006/01/18(水) 15:29:14 ID:???
リロードしたんだが…orz
974Name_Not_Found:2006/01/18(水) 15:29:47 ID:???
>>971
小分けですまん、それもそんなことはないから、おまいの書き方確認。
975Name_Not_Found:2006/01/18(水) 15:32:32 ID:???
>>970
citeまで装飾(CSS)として付けるのは法律的にちょっと難という意見があるので
cite属性を用いるがよかろ。
976Name_Not_Found:2006/01/18(水) 15:33:37 ID:???
cite属性じゃねえ、cite要素だ。
977969:2006/01/18(水) 15:37:00 ID:???
>>974
li要素をfloatしてた所為でした。

IEだとfloatされたli要素もulの中のように振る舞いますが
FFだとulの外に浮いてる形になるみたいです。
後続する要素とのマージンなどからもこんどこそ合ってると思います
978970:2006/01/18(水) 15:38:03 ID:???
>>975-976
レスどうもありがとうございます。
そもそもhtml部分を
> <q cite="引用元">引用文</q><cite>引用元</cite>
として
q要素のcite属性部分をcssで装飾するのではなくcite要素を追加し装飾すれば委員ですね。
それでもやっぱりq要素のcite属性は書いたほうがいいのでしょうか?
って、これはcssの質問ではないのでスレ違いですね。
どうもありがとうございました。
979Name_Not_Found:2006/01/18(水) 15:59:18 ID:???
>>977
それ、フロートのFAQですから。
http://web2ch.s31.xrea.com/?CSSFAQ のQ4のリンク先に書いてありますから。
980Name_Not_Found:2006/01/18(水) 16:02:04 ID:???
>>977
http://cssbug.at.infoseek.co.jp/detail/winie/b053.html
>本来、ボックスサイズを算出する際にはフロート化された子孫要素は除外される
981Name_Not_Found:2006/01/18(水) 16:33:07 ID:???
>>978
q要素とcite要素が完全に対応する確証がない(現在の仕様ではそれを明文化する規定がない)から
HTMLとしては、たとえcite要素はなくともcite属性は書くべき。
むしろHTML的にはcite要素は法律的なおまけと考えておいたほうがいい。
またcite属性にはURI(URLやISBN)しか書けないが、
cite要素のほうはq要素のtitle属性と同じような出版物名とか著者名とか書けるんで便利。
982Name_Not_Found:2006/01/18(水) 17:00:18 ID:???
>>979>>980
素朴な疑問。
その仕様通りだと、ブロック要素であるhrはフロートされちゃマズイと思うんだけど、
hrがきっちりフロートの下に潜り込んでるのは知ってる限りOperaだけで、
IEはおろかFirefoxでもMozillaでもフロート幅によって縮められちゃってテキスト扱いになってる感じなんだが、
これってバグ?
983Name_Not_Found:2006/01/18(水) 17:12:55 ID:???
984Name_Not_Found:2006/01/18(水) 17:28:55 ID:???
>>983
いや、標準モードでそれだった気がするんだが・・・
もういっぺん試してみる。
985Name_Not_Found:2006/01/18(水) 17:37:30 ID:???
986Name_Not_Found:2006/01/18(水) 17:58:59 ID:???
987Name_Not_Found:2006/01/19(木) 03:09:07 ID:???
ちょっと該当見付からなかったんですけど、
legend要素に:first-letter擬似要素が働かないのは仕様ですか?
988Name_Not_Found:2006/01/19(木) 13:22:04 ID:???
●OSやブラウザの種類とヴァージョンについては必ず明記してください
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/selector.html#pseudo-elements
989Name_Not_Found:2006/01/19(木) 15:48:31 ID:???
>>988
Windows2000SP4Firefox1.5です。
990Name_Not_Found:2006/01/19(木) 16:12:12 ID:???
>Netscape 6〜7.0
>:first-letter疑似要素には,ボーダー関連のプロパティは適用されない。
とあるな。 >>988

ソース出して、下記に報告しなさい。
 CSS/DHTMLバグ辞典スレッド 第4版
 http://pc8.2ch.net/test/read.cgi/hp/1078463560/l50
991 ◆edjPGuXZ1U :2006/01/20(金) 10:26:38 ID:???
992Name_Not_Found:2006/01/20(金) 12:53:35 ID:???
>>990
わかりました、あとでソースを簡略化してやってみます。
993Name_Not_Found:2006/01/21(土) 09:46:15 ID:???
おはよう埋め
994Name_Not_Found:2006/01/21(土) 10:03:39 ID:???
雪だ
995Name_Not_Found:2006/01/21(土) 14:23:21 ID:???
梅干しすっぺー
996Name_Not_Found:2006/01/21(土) 14:26:22 ID:???
カリカリ埋め
997Name_Not_Found:2006/01/21(土) 14:30:43 ID:???
すっぱいまんくいてー
998Name_Not_Found:2006/01/21(土) 14:31:50 ID:???
うめうめ
999Name_Not_Found:2006/01/21(土) 14:32:32 ID:???
すっぱいまんこいてー
1000Name_Not_Found:2006/01/21(土) 14:33:07 ID:???
次スレ:

/* CSS・スタイルシート質問スレッド【51th】 */
http://pc8.2ch.net/test/read.cgi/hp/1137310503/
10011001
このスレッドは1000を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。