/* CSS・スタイルシート質問スレッド【44th】 */

1 ：Name_Not_Found：2005/06/25(土) 15:52:08 ID:EEs1iXir

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

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

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

関聯リンクは>>2-10
【関連スレ】【仕様書】【CSS検証】>>2
【解説など】>>3-4
【FAQ】>>5-9

【まとめサイト】　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/1116580729/

2 ：Name_Not_Found：2005/06/25(土) 15:52:50 ID:???

【関聯スレッド】
CSS/DHTMLバグ辞典スレッド第４版
　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でイケてるデザインサイト 25
　http://pc8.2ch.net/test/read.cgi/hp/1119122494/

【仕様書】
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/

3 ：Name_Not_Found：2005/06/25(土) 15:53: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

4 ：Name_Not_Found：2005/06/25(土) 15:54:00 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

5 ：Name_Not_Found：2005/06/25(土) 15:54:22 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

6 ：Name_Not_Found：2005/06/25(土) 15:55:26 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

Q4: なんかフロートの表示が崩れるみたいなんですけど？
A4: まずclear忘れがないかをを確認してください。
floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
　http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
またfloat:left;で回り込むのはテキスト（imgを含む）だけです。ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:（浮動要素のwidth）;”なりを指定する必要があります。WinIEの間違った実装で誤解が多いので注意。
　http://cssbug.at.infoseek.co.jp/detail/winie/b054.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
　http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
　http://cssbug.at.infoseek.co.jp/detail/winie/b079.html
　http://cssbug.at.infoseek.co.jp/detail/winie/b053.html

7 ：Name_Not_Found：2005/06/25(土) 15:56:18 ID:???

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

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

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

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

Q9.リンクした画像の線が消えません。
A9.img要素ではなくa要素をセレクタにしてborder指定してませんか？　
a:link img, a:visited img, a:hover img {border:none;}
NN4は http://cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。
text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。
cf. http://cssbug.at.infoseek.co.jp/detail/winie/b040.html

8 ：Name_Not_Found：2005/06/25(土) 15:56:45 ID:???

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

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

Q12. height:100%;としても高さが100%になりません。
A12. heightを%単位で指定するためには親要素の高さを明示的に指定する必要があります。下記サイトを参照のこと。
「height: n%;の正しい仕様」
　http://www.mozilla.gr.jp/standards/webtips/webtips0032.html

9 ：Name_Not_Found：2005/06/25(土) 15:57:10 ID:???

【参考】
　IEの position:absolute; のバグを利用した擬似フレーム

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

＊IEの position:absolute; のバグを利用した擬似フレーム

１．標準モードにする
２．body {height:100%; overflow:auto;}
３．fixしたいブロックを position: absolute; で指定

以下に示すようなハックを用いることにより、全ブラウザへの対応も可。

/* 全ブラウザに適用 */
#menu {position:fixed; display:block; top:100px; left:10px; width:130px; height:200px;}

/* IE6 のみ読み込む */
* html #menu {position:absolute; display:block; top:100px; left:10px; width:130px; height:200px;}

《実現例》
CSS frame emulation
http://www.stunicholls.myby.co.uk/menu/background2.html

10 ：Name_Not_Found：2005/06/25(土) 16:10:17 ID:???

http://web2ch.s31.xrea.com/?CSSTemplate
新テンプレートの>>6は「http多すぎです」で拒否されるので
Internet Archive入りの奴は ttp にしました。

11 ：Name_Not_Found：2005/06/25(土) 16:59:36 ID:???

>>4
>・IE で min-width を指定する方
>　http://www.lucky-bag.com/archives/2005/05/ie_minwidth.html

WinIE向け対策なら、それよりUnderscore Hackの方が普通でないかい？
　識別子の先頭にある「_」を無視する(5.x/6.0)
　http://cssbug.at.infoseek.co.jp/detail/winie/b157.html

12 ：Name_Not_Found：2005/06/25(土) 17:10:35 ID:TjJI53nm

前スレッド981へ。
><div class="left">■色々</div><div class="right">◆色々</div><div class="clear"></div>
空divは無意味だから止せ。
あと、無意味なoverflow:auto; も削って。

13 ：Name_Not_Found：2005/06/25(土) 17:14:24 ID:???

前スレッド981へ。
.left{
width:450px;
height:100px;
text-align:justify;
clear:left;
float: left;
}
.right{
width:150px;
height:100;
text-align:justify;
float: left;
}
<div class="left">■色々</div><div class="right">◆色々</div>
<div class="left">■色々</div><div class="right">◆色々</div>
で、いいだろ。
または
.right{
width:150px;
height:100;
text-align:justify;
margin-left:450px;/* .leftの横幅 */
}
にするか。

14 ：Name_Not_Found：2005/06/25(土) 17:16:11 ID:???

height:100; → height:100px; だったな。ごめん。

15 ：Name_Not_Found：2005/06/25(土) 17:40:46 ID:???

16 ：Name_Not_Found：2005/06/25(土) 17:42:28 ID:???

>>11
Underscore Hackでどうやってmin-widthを実現させるの？

17 ：Name_Not_Found：2005/06/25(土) 17:42:31 ID:???

Movable Typeってナニ？　何をやりたいの？　他者に通じる言葉で質問してね。

18 ：Name_Not_Found：2005/06/25(土) 17:46:18 ID:???

>>16
だってあれぁ、Star html Selector Bug を使ってるだろ？
http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html
それと同様で、IE向け指定には識別子先頭にアンダースコアをつければいい。

19 ：Name_Not_Found：2005/06/25(土) 17:57:15 ID:???

>>16
つまり>>9の例なんかも、アンダースコア・ハックなら一セレクタにまとめられる。

#menu {
position:fixed; display:block; top:100px; left:10px; width:130px; height:200px;
_position:absolute;/* IEのみ適用される */
}

20 ：Name_Not_Found：2005/06/25(土) 18:03:45 ID:???

http://wellstyled.com/css-underscore-hack.html
CSSの識別名にアンダースコアを使う
http://hail2u.net/blog/webdesign/use_underscore_in_css_identifier.html

"通"御用達、CSSハック
http://www6.plala.or.jp/go_west/nextcss/tip/tech/css_hack.htm
CSSハック
http://www.naturalfactory.net/blog/archives/2005/06/css.html

>余談ですが、なぜかアンスコハックはWinIEだけが読むとか思われがちなのですが、
>実はというかMacIE4.5もMacIE5.0も読みます。
>なので /*\*/ _property:value; /**/ などとする必要があります。

21 ：Name_Not_Found：2005/06/25(土) 18:03:48 ID:???

★必ず質問テンプレを使い、全ての項目を書いてください。(省略厳禁)★
　　　　　　　　　　　　　　　　　 ~~~~~~~~~~~　　　　　　　　　　　 ~~~~~~~~~~
・括弧( )内の説明をよく読み、省略せずに書いてください。
※情報は小出しにせず、書ける限りの情報をまとめた上で質問してください。

▼───質問テンプレ────────────────────▼
【>>1を読んだか？】（>>1のリンク先に解答がある場合は答えません）
【OSとブラウザ、バージョンは？】（標準か互換かも詳細に）
【質問】（最低限のソースは必須）
▲──────────────────────省略厳禁───▲

22 ：Name_Not_Found：2005/06/25(土) 18:06:59 ID:???

……ってことで、ソース出してくれや。でないと回答しようにもできん。　>>15

23 ：Name_Not_Found：2005/06/25(土) 18:12:02 ID:???

>>15
俺の独断と偏見で推測して答えてやる。

・バナー部分でタイトルを背景画像に設定し、バナーをtext-align:rightにして
検索フォームを置く。
・ボディ部分が固定幅なら、タイトルでも検索フォームでもどっちでもいいから
位置をposition:absoluteで絶対指定する。
・バナー部分にtableかdivをさらに追加して、左右の領域を分けちまう。

さあ、好きなのを選べ。

24 ：Name_Not_Found：2005/06/25(土) 18:35:17 ID:???

>>18
>>19
>>20
サンクス

25 ：Name_Not_Found：2005/06/25(土) 19:00:42 ID:???

>>22-23　　ソースです、全部書くと多すぎるので、サイトを晒しておきます、
まだ何にもなくてｺﾞﾒﾝﾅｻｲ　http://hensyubu.sakura.ne.jp/

<div id="container">
<div id="banner">
<h1><a href="topページのurl" accesskey="1">題名</a></h1>
<h2></h2>
</div>
#container {
line-height: 140%;
margin-right: auto;
margin-left: auto;
text-align: left;
padding: 0px;
width: 700px;
background-color: #FFFFFF;
border: 1px solid #FFFFFF;
}
#banner {
font-family: Verdana, Arial, sans-serif;
color: #FFFFFF;
background-color: #999999;
text-align: left;
padding: 15px;
border-bottom: 1px solid #FFFFFF;
height: 39px;
}

26 ：Name_Not_Found：2005/06/25(土) 19:01:44 ID:???

a#banner-img {
display: none;
}
#banner a {
color: #FFFFFF;
text-decoration: none;
}
#banner h1 {
font-size: xx-large;
}
.link-note {
font-family: Verdana, Arial, sans-serif;
font-size: x-small;
line-height: 150%;
text-align: left;
padding: 2px;
margin-bottom: 15px;
}

27 ：Name_Not_Found：2005/06/25(土) 19:02:26 ID:???

検索のところを書くの忘れてました

<div class="link-note">
<form method="get" action="<$MTCGIPath$><$MTSearchScript$>">
<input type="hidden" name="IncludeBlogs" value="<$MTBlogID$>" />
<label for="search" accesskey="4">サイト内の検索</label><br />
<input id="search" name="search" size="20" /><br />
<input type="submit" value="検索" />
</form>
</div>

28 ：23：2005/06/25(土) 20:43:33 ID:???

>>25
俺の推測通りだったな。

<div id="banner"></div>の右側にフォーム入れたいんだよな？
<h1></h1>のタイトル部分を背景画像にするのが手っ取り早いが、
嫌なら<form></form>の部分をbannerにぶち込んで相対位置指定、
つまりposition:relativeで適度に調整したらどうだろう。

29 ：Name_Not_Found：2005/06/25(土) 21:40:39 ID:???

>>28
ご指摘ありがとうございます
出来ました。

本当にありがとうございます｡･ﾟ･(ﾉД`)･ﾟ･｡

30 ：Name_Not_Found：2005/06/25(土) 22:47:15 ID:???

プロパティ　コロン　値　セミコロン
プロパティ　コロン　値　セミコロン

31 ：Name_Not_Found：2005/06/26(日) 00:36:57 ID:???

質問お願いします。
高さが50pxの画像の背景にbackground-colorを指定したいと思います。

CSS .back { background-color: #000000; }

<div class="back">画像</div>

Mac Firefox 1.0.4で確認したところ、
画像の下に少しpadding-bottomの様な隙間が空きます。(5pxくらい)
paddingを0pxに指定しても、やはり隙間が空いてしまいます。
max-height: 50px;を書き足すと隙間が空かないのですが、
max-heightはIEに対応してないと本に書いてありました。

どうすればいいでしょうか。お願い致します。

32 ：Name_Not_Found：2005/06/26(日) 00:45:03 ID:???

>>前スレ925
これでできるかわからんが、
bodyの背景に透明な画像をfixedで置いてみれ
予想があたればうまくいく

>>31
ヒント: vertical-align: bottom;

33 ：Name_Not_Found：2005/06/26(日) 00:48:29 ID:???

>>31
これも散々、既出だなあ。ＦＡＱにするか？
http://www.mozilla.gr.jp/standards/webtips0018.html#c1_1

34 ：Name_Not_Found：2005/06/26(日) 02:52:28 ID:???

画像の周りに余白を作り
それを線で囲もうと思い

div img {
border: 1px solid #000000;
margin-bottom: 2px;
padding: 5px;
}

と記述したのですが、IE6で確認したところ
padding: 5px
が反映されず、画像に直で線が表示されてしまいました。
Operaやfirefoxだと意図したとおりに表示されました。
IEでもpaddingが反映されるようにするには
どうしたら良いでしょうか？教えて下さいませ。

35 ：Name_Not_Found：2005/06/26(日) 02:56:01 ID:???

5pxの余白付きの画像にする

36 ：Name_Not_Found：2005/06/26(日) 03:20:15 ID:???

互換モード

37 ：前スレ981：2005/06/26(日) 03:27:38 ID:???

あれからなかなか解決できずに（firefoxだとニ段組にならない）あれこれ弄っていたんですが
結局css解説サイトの例文をコピペして置き換えたところ、ちゃんと表示されました。
疲れきっていたのでちゃんと覚えていませんが、コピペしたものと981に書いたものの違いは
borderが設定されていたくらいだったと思います。
レス下さった方、ありがとうございました。

38 ：Name_Not_Found：2005/06/26(日) 03:34:30 ID:???

>>34　なぜバグ辞典を見ない？
img要素にパディングが効かない(IE5)
http://cssbug.at.infoseek.co.jp/detail/winie/b013.html

39 ：Name_Not_Found：2005/06/26(日) 05:26:55 ID:qGu+Cax2

div.text{
width:600px;
}
とcssファイルにかいておいて、
<div class="text">横の長さが600pxを越える文字列</div>
とすると600pxのところで改行されずにそのまま横に伸びていってしまうんだけど
改行するにはどうすれば良いのでしょうか？

40 ：39：2005/06/26(日) 05:29:52 ID:???

連投すみません。
全角文字だとちゃんと改行されました。
しかし半角文字だとやはり改行されません。

41 ：Name_Not_Found：2005/06/26(日) 07:34:40 ID:???

>>39
英数字を連続して書くとひとつの単語として扱われるから改行しない。
これは仕様です。
これも既出なんだがなぁ。

42 ：Name_Not_Found：2005/06/26(日) 08:32:27 ID:???

>>39
>>41
ちなみに
word-break:break-all;
を指定やれば単語途中でも改行される。
IEくらいしか対応してないけどさ。

43 ：Name_Not_Found：2005/06/26(日) 08:53:42 ID:???

>IEくらいしか対応してない

もの凄いイヤミだな

44 ：Name_Not_Found：2005/06/26(日) 10:11:40 ID:???

>>1
遅まきながら乙。
最近ループが多いな。

45 ：Name_Not_Found：2005/06/26(日) 10:43:09 ID:???

そら問題が無限に発生するはずもなく

46 ：Name_Not_Found：2005/06/26(日) 12:35:18 ID:???

>38
のimgにpaddingが反映されないってバグなんだけど、
バグ辞典の説明の「IE6の互換モード」＝Standardモード、「標準モード」=Quirksモードって意味でしょ？
説明ズレてない？
モードの説明が逆だと思うんだけど。

47 ：Name_Not_Found：2005/06/26(日) 13:28:07 ID:???

>>46
>「IE6の互換モード」＝Standardモード、「標準モード」=Quirksモードって意味でしょ？
違う。
「IE6の互換モード」＝Quirks mode 、「標準モード」=Standard mode って意味

48 ：Name_Not_Found：2005/06/26(日) 13:43:49 ID:???

>>35
レスどうも。
>>38
読みましたorz ごめんなさい。
paddingが反映されなくても死ぬわけじゃないので
IEユーザーには申し訳ないですが
このままがんばることに致します。

49 ：Name_Not_Found：2005/06/26(日) 13:47:11 ID:???

画像にmarginつけたらどうなのさ。

50 ：Name_Not_Found：2005/06/26(日) 14:39:03 ID:???

>>48
>WinIE6.0標準モードではパディング指定が反映されます。
というのに気付いてないのか。

51 ：Name_Not_Found：2005/06/26(日) 15:02:00 ID:???

>47
レスｻﾝｸｽ

「WinIE6.0標準モードではパディング指定が反映されます。」とあるが、
「画像とボーダーの間に20pxのパディングを設定しています。」の上の例で、
paddingが反映されないよね。

このページってIE6を互換モードでレンダリングするようになっているの？

52 ：Name_Not_Found：2005/06/26(日) 15:10:09 ID:???

>>51　ソース開いて見ればわかることをナゼ訊く？

53 ：Name_Not_Found：2005/06/26(日) 15:17:30 ID:HQJCTHzc

>51
「HTML 4.01Transitional（URLなし）」ってことね。

ここ見て納得。ありが㌧
http://www.mars.dti.ne.jp/~fuming/advanced/dtd.htm

54 ：Name_Not_Found：2005/06/26(日) 22:48:35 ID:???

55 ：Name_Not_Found：2005/06/27(月) 02:31:16 ID:???

他のブラウザのように
IEでも画像を透過させて背景を透かして見せたいのですが
どういった方法がありますか。ご教授下さい

56 ：Name_Not_Found：2005/06/27(月) 02:39:55 ID:???

他のブラウザではどうやってるってのか？
ＣＳＳでやることではないはず。少なくとも現段階では。

57 ：Name_Not_Found：2005/06/27(月) 02:41:07 ID:???

半透明の画像をはっつけるというのは無しか？

58 ：55：2005/06/27(月) 02:54:04 ID:???

上手く伝わるか不安でしたが案の定失敗しました。
背景が透けて見えるようにpngやgifで
モジラ系のブラウザでは透けて見えるようにしたのですが
IEではそれができないですよね。
それをCSSでできるか質問したんです。

59 ：Name_Not_Found：2005/06/27(月) 03:02:25 ID:???

opacityが実装されるまで待て。さもなきゃ独自拡張のfilterか。>>58

60 ：55：2005/06/27(月) 03:13:58 ID:???

はい、一応gifで偽装して我慢します
ありがとうございました。

61 ：Name_Not_Found：2005/06/27(月) 07:53:13 ID:???

【>>1を読んだか？】読みましたがリンク先で回答が見つかりませんでした。
【OSとブラウザ、バージョンは？】OS:WindowsXP ブラウザ:メイン(IE6.0)，確認用(NS7.0，Ff1.0)
【質問】floatによる３カラム構成についての質問です。
理想は(1)のように３つのブロックを同じ高さにすることです。
現状では文章の長さによって、どうしても(2),(3)の様に下に隙間ができてしまいます。
この隙間を埋めて(1)の様にするにはどうしたら良いでしょうか？
(1) http://puka-world.com/ren/img-box/1119823795249.jpg
(2) http://puka-world.com/ren/img-box/1119823820361.jpg
(3) http://puka-world.com/ren/img-box/1119823848016.jpg

62 ：61：2005/06/27(月) 07:54:07 ID:???

■HTML(簡略)
<div id="top">
....ヘッダーの中身(略)....
</div>
<div id="menu1">
....MENU1の中身(略)....
</div>
<div id="menu2">
....MENU2の中身(略)....
</div>
<div id="main">
....本文(略)....
</div>
<div id="bottom">
....フッターの中身(略)....
</div>

63 ：61：2005/06/27(月) 07:54:30 ID:???

■CSS(簡略)
*{
-moz-box-sizing:border-box;
box-sizing:border-box;
}
body{
margin:0;
padding:0;
background-color:white;
}
#top {
margin:0;
}
#menu1{
margin:0;
width:200px;
float:left;
}
#menu2{
margin:0;
width:200px;
float:right;
}
#main{
margin:0 210px;
}
#bottom{
clear:both;
margin:0;
}

64 ：Name_Not_Found：2005/06/27(月) 08:21:40 ID:???

>>61
>>62
>>63

Stu's Site ~ Cascading Style Sheets ~ Layouts ~3 column
http://www.stunicholls.myby.co.uk/layouts/3cols.html

65 ：61：2005/06/27(月) 09:14:36 ID:???

divを増やさないと無理なんですかね？

66 ：Name_Not_Found：2005/06/27(月) 10:10:06 ID:???

>>64
それposition使ってるじゃん。
>>61はfloatでやりたいんでしょ。

67 ：Name_Not_Found：2005/06/27(月) 10:51:41 ID:???

>>65
背景画像を使うやり方もありますが、おそらくこれが一番divが少ないやり方だと思います。

>>66
よく見れば分かりますが、基本的にはfloatでやっています。
抱合ボックスの左右にボーダーを引いて、その中でfloatにより左と右に振っています。

floatとしたボックスにマイナスマージンを設定して、ボーダーの上に乗っけてます。
position: relative;はほんの少しのズレを調整するために使っています。

68 ：Name_Not_Found：2005/06/27(月) 10:58:06 ID:???

少し訂正。
抱合ボックス（container）の中にinnerボックスを設け、それにマイナスマージンを設定し、
抱合ボックスのボーダーの上までコンテンツ領域を増やしています。

69 ：Name_Not_Found：2005/06/27(月) 11:32:24 ID:???

包含ボックスと書きたい？

70 ：61：2005/06/27(月) 12:55:36 ID:???

>>62の構成では無理なのでしょうか？
divの二重抱えをしないと無理ですか？

71 ：Name_Not_Found：2005/06/27(月) 13:02:05 ID:???

>>61
縦のスペーサーGIFがガチ

72 ：1/1：2005/06/27(月) 14:23:03 ID:???

すいません質問させてください。

div.menu {
float : right;
width : 255px;
border : thin solid ;
margin-right : 50px;
font-size : 85%;
color : gray;
padding : 10px;
margin-bottom : 70px
}
div.menu2 {
float : left;
width : 250px;
font-size : 90%;
margin-left :45px;
border : none ;
line-height : 1.5em;
padding-left : 20px
}

73 ：1/2：2005/06/27(月) 14:23:31 ID:???

以上のCSSを２つのページに適用しています。AとBページとします。
しかし、Aのページはうまく段組みし固定するのですがBのページは
固定されず崩れてしまいます。他のCSSやタグ等の影響かと思い↑の
ソース及び関連HTMLのみでブラウズしてみましたが関係ありませんでした。

使用ブラウザ　(Aのページはすべて固定されてレイアウトはくずれません）
MAC IE,safari→Bページ崩れる
Win　 IE,NS,FF→Bページ崩れない

色々考え、ためしたのですが原因がわかりません。
何か解決策があれば教えて欲しいです。

74 ：72-73：2005/06/27(月) 14:30:19 ID:???

ブラウザのバージョンはすべて最新のものです。

75 ：Name_Not_Found：2005/06/27(月) 14:43:00 ID:???

うっかりミスだったらいいんだけど、そうじゃなかったら今後困ると思うので
一応、指摘しておきます。

1/1、1/2でなく、1/2、2/2と書くのが普通だと思います。

76 ：Name_Not_Found：2005/06/27(月) 14:46:19 ID:???

>>72-74
htmlを見なければ何とも言えないけど、
2ページ分だらだら貼られても何も言えないよ。

77 ：72-73：2005/06/27(月) 15:11:20 ID:???

すまん。解決した。

78 ：Name_Not_Found：2005/06/27(月) 16:03:26 ID:8pyqT7bp

６４さんのやりかた目から鱗！勉強になりました！

79 ：Name_Not_Found：2005/06/27(月) 18:17:34 ID:???

女性専用車両＝ブス隔離車両？？？

賛否両論ある「女性専用車両」ですが
その真の目的は「ブスを隔離」するためにあった？？？

http://2chart.fc2web.com/2chart/busukakuri.html

80 ：Name_Not_Found：2005/06/27(月) 20:40:46 ID:PQLMdvlg

MacIEで背景画像が表示されないんですけど…。

81 ：Name_Not_Found：2005/06/27(月) 20:47:16 ID:???

HTMLやCSSを書いてくださいと…>1には書いてないのか
でもできれば最初から書いてください

で ttp://members.at.infoseek.co.jp/cssbug/detail/macie/b047.html は？
同様に ttp://www.zspc.com/documents/css2/colorbg/bgimage.html
どちらも>3にあります

該当しないんだったら今度こそHTMLとCSSを「必要なところだけ」書いてください

82 ：Name_Not_Found：2005/06/27(月) 20:51:18 ID:???

>>1で、ソース出せと書いてるんだけどねえ。
回答者はテレパシストではないんだから情報出してくれなきゃわからんっての。

83 ：Name_Not_Found：2005/06/27(月) 21:04:26 ID:???

>>80
テレパシスト検定には落ちたがチャレンジ。

url('hoge/hage.png')
　　　　↓
url(hoge/hage.png) or url("hoge/hage.png")

はずしてたらｽﾏｿ。

84 ：MOHEI ◆GrsqjXpGxE ：2005/06/27(月) 21:06:56 ID:??? BE:44698324-#

>>80
ソース晒して。じゃないと回答のしようがない。w
問題ヶ所が分かんなけりゃ、全部をtxtファイルにしてうpロダにあげてみれば？

85 ：325：2005/06/27(月) 21:14:12 ID:???

ところでclassの数って上限あるんですか？

86 ：Name_Not_Found：2005/06/27(月) 21:17:44 ID:???

>>85
8ビットだから128個まで。

87 ：Name_Not_Found：2005/06/27(月) 21:37:37 ID:???

んなアホな

88 ：61：2005/06/27(月) 22:31:51 ID:???

どなたかお教えくださいませ。m(_ _)m
floatを使わずにpositionを使って同じような事ができるのでしたら
その方法でも構いませんので…

89 ：Name_Not_Found：2005/06/27(月) 23:11:34 ID:???

64のじゃだめなの？

90 ：61：2005/06/27(月) 23:22:32 ID:???

>>89
全体をdivで囲うみたいなdiv厨にはなりたくないのです。

91 ：Name_Not_Found：2005/06/27(月) 23:42:59 ID:???

>>90
自力でそういうことできない奴が、言う台詞じゃないよな笑
身の程知れよ。

92 ：Name_Not_Found：2005/06/27(月) 23:56:57 ID:???

NetscapeやFirefoxで、liタグを使ったとき文字が少し上にずれるのを直したいのですがいい方法はないでしょうか？

93 ：Name_Not_Found：2005/06/28(火) 00:00:37 ID:???

えっ、Geckoエンジンだとかえってずれない気がしたけど
俺の勘違いかな。
IEとOperaはずれる。

書いてて思ったけどこれはリストマークに画像を使った場合かも試練。

94 ：Name_Not_Found：2005/06/28(火) 00:32:42 ID:???

OS・ブラウザ毎のfont-size,letter-spacingの違いを統一するために
javascriptでブラウザ毎に振り分けて
cssで指定したいのですが、
残念ながら当方は、mac環境でwinがなく、確認出来まません。

なので、OS・ブラウザ毎のfont-size,letter-spacing等を
纏めているサイトはないでしょうか？

宜しくお願いします。

95 ：Name_Not_Found：2005/06/28(火) 02:38:27 ID:???

<a href="yahho.co.jp"><img src="ahya.jpg"></a>

↑このとき画像の周りに色つきボーダーが表示されるかと思いますが
この色と太さを変えるにはどうしたらいいでしょうか？

その際文字のリンク
<a href="yahho.co.jp">ゴルァ</a>
の色はデフォルトのまま、変更したくありません。

96 ：Name_Not_Found：2005/06/28(火) 02:54:57 ID:???

ヒント: FAQ9>>7

97 ：Name_Not_Found：2005/06/28(火) 04:19:05 ID:???

http://shauninman.com/plete/

このサイトの右側にある、
斜線に囲まれている画像の下の方の角は
どうやって丸めているのでしょうか？
2時間以上ソースとにらめっこしても分かりませんでした
なにとぞ、よろしくお願いします。

98 ：Name_Not_Found：2005/06/28(火) 04:36:52 ID:???

>>97
そこのCSSから抜粋
.of-mention-container dl {
margin: 0 0 11px 11px;
float: left;
}
.of-mention-container dl dt {
background-color: #FFF;
padding: 3px;
}
.of-mention-container dl.primary {
margin-bottom: 7px;
}
.of-mention-container dl.primary dd {
background: url(/assets/images/of-mention/bg-of-mention-bottom-primary.gif) left bottom no-repeat;
}
.of-mention-container dl dd {
background: url(/assets/images/of-mention/bg-of-mention-bottom.gif) left bottom no-repeat;
padding: 2px 6px 4px;
}

この辺じゃね（斜線画像に囲まれた部分がof-mention-containerクラス）

99 ：Name_Not_Found：2005/06/28(火) 05:54:20 ID:1CCr9lz0

Firefoxで、ブラウザのスクロールバーを動かすとページの一部に細い横線みたいなものが
沢山入ってしまうんですが、これはどんな原因が考えられるんでしょうか。
IEではこの症状は出ません。
ｸﾞｸﾞｯたところ背景画像と関連してこの症状が出るらしいのが一件だけみつかったのですが
今回背景画像は使用せずにスタイルシートで色を設定しています。

100 ：99：2005/06/28(火) 06:27:43 ID:???

すみません自己解決しました。
hタグの後に改行が入っていたのを取り外したら99の症状は出なくなりました。
失礼しました。

101 ：Name_Not_Found：2005/06/28(火) 14:11:55 ID:E9uLf35f

HTMLリントで

HTTPレスポンスヘッダに指定されている文字コードセットは `none` ですが、<META> に指定されているのは `Shift_JIS` です。

と出るんですが、これはどうすればいいんですか？

102 ：Name_Not_Found：2005/06/28(火) 14:18:58 ID:???

>>101
鯖の設定の問題

103 ：Name_Not_Found：2005/06/28(火) 14:28:35 ID:E9uLf35f

ああ、無料鯖なんで・・・あきらめたほうがいいですか？

104 ：Name_Not_Found：2005/06/28(火) 14:36:03 ID:??? BE:264600959-##

>>101
.htaccessが使えるなら簡単にいける。

105 ：Name_Not_Found：2005/06/28(火) 14:38:01 ID:???

>>101　ＣＳＳの質問ではない。却下。

106 ：Name_Not_Found：2005/06/28(火) 15:02:37 ID:E9uLf35f

CSSじゃないんですか！すいません。失礼しました。
.htaccessのこと調べてみます。

107 ：Name_Not_Found：2005/06/28(火) 15:14:51 ID:???

その前にＣＳＳとＨＴＭＬを理解しておけ。

108 ：Name_Not_Found：2005/06/28(火) 19:36:40 ID:NAdnCv7c

はじめまして。
以下のページにあるタブメニューを改造しようとしているのですが、
http://www.clagnut.com/sandbox/csstabs/?writingtext=csstabs#
Vision,Team,Cultureと書かれている列(濃い灰色)の右端がブラウザの
右端まで届きません。　必ず隙間が入ってしまいます。

自分が試したのは、bodyのmarginを0にしたり、paddingを0にしたり、
Vision,Team,Cultureを囲んでいるulのwidthに100%を入れてみたり
などです。が、全てダメでした・・・。

ご教授頂けないでしょうか？
よろしくお願い致します。

109 ：Name_Not_Found：2005/06/28(火) 20:44:48 ID:???

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

110 ：Name_Not_Found：2005/06/29(水) 00:43:10 ID:???

Googleのような検索サイト対策に、重要な文やパラグラフをなるべくページ先頭に
持ってくる、という対策があるけど現実問題ページのレイアウトを考えるとそうも
いかないことが多い。キーワードをふんだんに含む重要な段落がページの下の
ほうに来るなんてことはざらだろ。

だがそういう場合でもちゃんとGoogleとかにその段落を拾ってもらう方法って
スタイルシート使って出来ない？たとえば見かけはページの下の方にあるけど
ソースを見るとちゃんとページの最初の方に書かれているとか。

111 ：108：2005/06/29(水) 00:43:26 ID:OomMa97x

>>109

すみませんでした・・・。
確認に使用したブラウザはIE6.0です。
OSはWin2000です。

ul の中に ul がネストされているので、ネストされている方の ul を
画面両端いっぱいに表示させるのは不可能なのかな・・・。

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

112 ：Name_Not_Found：2005/06/29(水) 01:05:52 ID:???

>>110
出来る。

> Googleのような検索サイト対策に、重要な文やパラグラフをなるべくページ先頭に
> 持ってくる、という対策があるけど

ホントにそんな対策の効果があるのかどうかはさておき。
ナビゲーション部分とかは、そのドキュメントの本文ではないので、いつも後回しにしている。

113 ：Name_Not_Found：2005/06/29(水) 01:12:13 ID:???

＞スタイルシート使って出来ない？たとえば見かけはページの下の方にあるけど
＞ソースを見るとちゃんとページの最初の方に書かれているとか

これこそcssの出番ですよ。

114 ：Name_Not_Found：2005/06/29(水) 01:39:44 ID:???

出来るけど一部の文章をコピーしようとすると全て選択しちゃったり
すると思うよ

115 ：Name_Not_Found：2005/06/29(水) 02:22:18 ID:???

>>111
できる。
とりあえず左右のpaddingを全て0にしろ。
上段のタブが左側ぴったりにくっついていいのならそれでOKだ。

116 ：Name_Not_Found：2005/06/29(水) 07:39:09 ID:???

以下のような場合で div の background の指定を効かせるにはどうしたらいいですか？
後者の場合、li は2列や3列になる場合もあります。

div { position: relative; width: 10em; background: gray;}
span { position:absolute; top:0px; width: 2em;}
.left { left: 0px;}
.right { right: 0px;}
<div>
<span class="left">hoge</span>
<span class="right">hage</span>
</div>

div { margin: 5em; background: gray;}
li { float: left; border: 1px solid black;}
<div>
<ul>
<li>hoge</li>
<li>hage</li>
</ul>
</div>

117 ：Name_Not_Found：2005/06/29(水) 09:30:05 ID:???

>104
これ知らなかった。凄い便利だね。thk！
スレ違いｽﾏｿ

118 ：Name_Not_Found：2005/06/29(水) 12:05:27 ID:???

>>111
Opera（Ver.7.53）で見ると崩れているけどいいの？
後、IE（Ver.6）とFF（Ver.1.02）で微妙に表示結果が違うけど。
↓のように分けたら簡単そうだけど、これじゃ不満？

<ul id="globalnav">
<li><a href="#">Home</a></li>
<li><a href="#" class="here">About</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Proof</a></li>
<li><a href="#">Process</a></li>
<li><a href="#">Expertise</a></li>
<li><a href="#">Help</a></li>
</ul>
<ul id="submenu">
<li><a href="#">Vision</a></li>
<li><a href="#">Team</a></li>
<li><a href="#">Culture</a></li>
<li><a href="#">Careers</a></li>
<li><a href="#" class="here">History</a></li>
<li><a href="#">Sponsorship</a></li>
</ul>

119 ：110：2005/06/29(水) 13:01:48 ID:???

>>114
> 出来るけど一部の文章をコピーしようとすると全て選択しちゃったり
> すると思うよ

そうなのか(´・ω・`)ｼｮﾎﾞｰﾝ

120 ：Name_Not_Found：2005/06/29(水) 14:29:22 ID:tO+jx5wS

liアイテムに対してtext-indentが効かないのは一般的でしょか？
ブロックレベル要素に含まれる文章の1行目に対して...といった説明からは微妙なのですが、
Safari 1.3(MacOS X 10.3.9)では効くものの、IE5.2.7(MacOS X 10.3.9)では無視されます。
ulに対して指定しても、liに対して指定しても同じです。

121 ：Name_Not_Found：2005/06/29(水) 15:06:02 ID:???

微妙というより、liアイテムに対してtext-indentは必要ないのでは？

122 ：Name_Not_Found：2005/06/29(水) 15:16:36 ID:???

>>120
Mac晩だろうが何だろうが、IEの挙動を真に受けるこたぁない。

123 ：116：2005/06/29(水) 16:04:46 ID:???

リストのほう自己解決しました。
ttp://oshiete1.goo.ne.jp/kotaeru.php3?q=1458479

* html .??? {height: 1%;}
.A {display: block;}
上記の部分を

.A { display: block;}
* html .A { height: 1%; display: inline-table;}
このようにすることで、MacのSafariなんかで崩れていたのも直りました。

続けてpositionのほうもお願いします。

124 ：Name_Not_Found：2005/06/29(水) 16:09:07 ID:tO+jx5wS

>>121
list-style-position: inside にした状態で、
liの1行目だけ前に出したい（2行目以降を下げたい）んですよ。
padding-left: 1em;
text-indent: -1em;
list-style-positionをoutsideにしたのでは、マーカーってボックスの外になっちゃいますよね。

125 ：Name_Not_Found：2005/06/29(水) 17:46:35 ID:???

>>112
でも、ナビゲータを左に付けてたらそれが出来ない。
positionで右に持ってきたら、今後Googleがスパム行為だという可能性があるって記事を見た。

126 ：Name_Not_Found：2005/06/29(水) 18:00:52 ID:???

HTMLスレとCSSスレどちらが適当か迷いましたがこちらで質問させてください。
文章内に下記の様なフォームを作りたいので、検索フォームで一段落と考えて
このようにマークアップしました。
しかしこれをこのまま表示させるとフォームと説明文が横並びになり見づらいため
便宜的にフォーム窓、説明文、ボタンと三段に改行させたいのですが
<br>のような物理要素の利用は好ましくないとされています。
そこでこれをCSSで行う場合、ブロックレベル要素の<div>でそれぞれマークアップし
floatにて回り込ませるのが好ましいのでしょうか？
もしも見当違いであったり他にシンプルな方法があれば教えて頂きたいです。
よろしくお願いします。

<p><form method="get" action="～">
○○カテゴリ□□アーカイブ内検索フォーム
<input type="text" name="search" seze="30"/>
<input type="submit" value="検索"/>
</form></p>

127 ：Name_Not_Found：2005/06/29(水) 18:37:53 ID:???

>>126
<p><form なんじゃこら

　　よ～～～く読んでくれ。
http://www.ne.jp/asahi/minazuki/bakera/html/reference/block#p

128 ：Name_Not_Found：2005/06/29(水) 18:54:13 ID:???

テーブルデザインに疲れたからCSSに移行しようと思ったけどムズイな。
元となるhtmlタグ、よく知らんからうまく作れん。
みんなH1とかULとかDTとか活用してるね。

129 ：Name_Not_Found：2005/06/29(水) 18:55:20 ID:???

>>127
ああ忘れていました
<form method="get" action="～">
<p>
○○カテゴリ□□アーカイブ内検索フォーム
<input type="text" name="search" seze="30"/>
<input type="submit" value="検索"/>
</p>
</form>

それとよくよく考えたら↓でいいのではと思って来ましたがどうでしょうか？
どうもＣＳＳの質問から離れてしまってすみません。
<form method="get" action="～">
<p>○○カテゴリ□□アーカイブ内検索フォーム</p>
<p><input type="text" name="search" seze="30"/></p>
<p><input type="submit" value="検索"/></p>
</form>

130 ：Name_Not_Found：2005/06/29(水) 19:04:19 ID:???

もっかい良くさー・・・　　いいや！

131 ：Name_Not_Found：2005/06/29(水) 19:24:35 ID:???

>>129
input要素や文字データはインライン要素だから（幅が許す限り）横に並びますね。
一つずつ改行させるには、それらをブロックレベル要素として扱えるようにする必要があります。
方法としてはブロックレベル要素で囲む（もしくはセパレートする）か、
displayプロパティでブロックレベル要素に変換するかです。
pは前者の一つですね。divで囲んでも同じです。どちらがいいかは個人の流儀でしょうかねえ。
受付フォームなんかだとそれぞれの項目見出しがつくのでtableに入れちゃいますけどね。

132 ：Name_Not_Found：2005/06/29(水) 20:30:48 ID:???

>129
個人的には >129の上の書き方で
・<p> を <fieldset> に
・○○フォームを <legend> に
・<input> に対して display: block;
・<fieldset> や <legend> の css も適当に

133 ：Name_Not_Found：2005/06/29(水) 20:33:05 ID:???

続けてごめん

「改行させたい」という要求については >132 の display: block;
だけが重要（これは >131さんも提案されているとおり）
残りは単に好みの話
form周りのHTMLについて調べてみるといいかも

134 ：Name_Not_Found：2005/06/29(水) 20:43:37 ID:5ULXua1G

Xhtmlの作成を行っているのですが、質問があります。

XML宣言を行うと、IE6が互換モードで動作しますが、これを回避するため、
XML宣言を省略するために、エンコードをUTF-8で行いました。

UFT-8でエンコードをしたことによって生じる問題はありますでしょうか？
（Windows環境のIE6、NN7、Mozila、FF1で文字化け・レイアウト崩れは発生しません。）

ご教授お願い致します。

135 ：129：2005/06/29(水) 20:51:07 ID:???

<fieldset>は知りませんでした。
<filedset>がフォームのコントロールをグループ化し
<legend>がそのグループに表題をつけるってことですね。
それなら適切なマークアップができCSSで改行もできます、質問してよかったです。
formまわりはあまり弄ったことがないので勉強しなおしてみます。
殆どスレ違いの内容にお付き合いして頂いてみなさん有り難うございました。

136 ：Name_Not_Found：2005/06/29(水) 20:59:28 ID:???

>134

問題とは違うかもしれないが
・UTF-8は日本語を3バイト使って表現するのでファイルサイズが大きくなる
（googleさんに「utf-8 3バイト」でいろいろと）
・携帯電話などではUTF-8は表示できない（可能性が高い）

137 ：Name_Not_Found：2005/06/29(水) 21:01:15 ID:???

また続けてごめん
＃書き込みボタン押す前に見直せよ

要するに cssスレッドで扱うような内容について
問題となるようなことはないはず

138 ：112：2005/06/29(水) 21:16:26 ID:???

>>125
まじで！？
<div id="honbun">本文</div>
<div>ナビゲーション</div>
で、

div#honbun { float: right; }
てしたら、スパムなの？
うそーん。

139 ：Name_Not_Found：2005/06/29(水) 21:44:22 ID:???

>>138
日本ではSEOスパムに過剰反応しすぎなんだよ。
たとえば<h1></h1>をいじったら即SEOスパムだ、みたいな空気も一部ではあるし。
もちろん本文と区別がつかないようないじり方は問題だと思うけど、
欧米じゃごく当たり前にそういった細工がなされているよ。
だから、気にするな。

140 ：Name_Not_Found：2005/06/29(水) 21:47:04 ID:???

>>135
余談だけど、秀和システムの「詳解 HTML&XHTML&CSS辞典改訂版」がおすすめかなぁ。
若干ミスが残ってるけど、何冊か見比べてこれ買ってリファレンスに使ってます。

141 ：Name_Not_Found：2005/06/29(水) 23:48:48 ID:???

3カラットは単純に出来ないね。
DIV幾つか重ねることになるけど、それでもtableよりマシかな。
divも結構重いんだよな。

142 ：Name_Not_Found：2005/06/29(水) 23:57:12 ID:???

テーブルデザインのためにdivでやるってのも本末転倒なんだよな。
3段組とかはテーブルで基礎だけ作っちゃうか。
でもテーブルは表であってデザインじゃないしなー、うーん。

143 ：Name_Not_Found：2005/06/30(木) 00:09:12 ID:???

>141-142
同じく悩む。

↓も基本はtableレイアウト。CSSだしxhtmlなんだよね。

ttp://www.nomura.co.jp/
ttp://asahi-net.jp/

野村の方はIBMのaDesignerで高評価だし。
tableレイアウトでも良いのかもと・・・

144 ：Name_Not_Found：2005/06/30(木) 00:26:00 ID:???

みんな悩んでおおきくなったんだ。

145 ：Name_Not_Found：2005/06/30(木) 00:27:35 ID:???

やっぱりそれが一番楽なんだよね。
基本テーブルでCSSカスタマイズ。
だけどデザイン変えるときは辛い。

色々試行錯誤してくる…。

146 ：Name_Not_Found：2005/06/30(木) 01:37:07 ID:LrLIueBd

初めまして、以下のCSSで質問があります。
#waku{
width:700px;
}
#hidari{
width:200px;
float:left;
}
#migi{
width:500px;
float:right;
}

<div id="waku">
<div id="hidari">
・・・
</div>
<div id="migi">
・・・
</div>
</div>
ユーザーがブラウザの幅を小さくするとmigiのdivがhidariのdivの下に
回り込んでしまいます。
これの回避方法はありますでしょうか？
当方が望む結果としましては、ブラウザの下に左右スクロールが表示され
るのを望んでいます。

147 ：146：2005/06/30(木) 01:47:56 ID:LrLIueBd

すみません、当方の環境は、
ブラウザがIE6で、OSがWin2000です。

148 ：Name_Not_Found：2005/06/30(木) 05:32:46 ID:???

>>146
後続要素に、floatではなく
“margin-left:（浮動要素のwidth）;”を指定する方法。→>>6

149 ：Name_Not_Found：2005/06/30(木) 05:35:06 ID:???

カスイケスレ見てると、テーブルがどうのこうのなんて些細なこと話してる香具師いないけどな。

150 ：Name_Not_Found：2005/06/30(木) 08:03:04 ID:GgNXN2WF

ＩＥでobject要素のborder消したいのですが　無理なんでしょうか？
火狐では消えたんですが........
因みに現在CSSは

object {border-width: 0px;}
object {border-width: 0px;}

で、HTMLは

<object type="text/html" data="./xxx.cgi" height="650" width="100%">
<p>HTML ファイルが表示されない場合は<a href="./xxx.cgi">直接参照</a>してください。</p>
</object>

となっています。
無理ですかね...............

151 ：150：2005/06/30(木) 08:07:02 ID:GgNXN2WF

object {border-style: none;}
も記述してあります。

152 ：Name_Not_Found：2005/06/30(木) 09:49:14 ID:???

ＩＥでselect要素に背景色スタイル適用できないのと一緒。無理。

153 ：Name_Not_Found：2005/06/30(木) 11:00:26 ID:ZiftxPpt

IEってどのバージョンも、tableにborder--spacingが効かないですよね？
デフォルトで 2px になってるかと思います（全バージョンで確認したわけではないです）。
これをコントロールするにはHTMLで border="0" などとするのが一般的なのでしょうか？
これはXHTMLでも非推奨要素にはなっていないので、ありなのかなとは思いますが。

154 ：Name_Not_Found：2005/06/30(木) 11:05:18 ID:???

あれ？俺のは標準で0になってるけど。
CSSで0に設定してあるからなのかも。

155 ：Name_Not_Found：2005/06/30(木) 11:19:36 ID:ZiftxPpt

あぁ、デフォルトで 2px という確認をしたのはとりあえずMac版IE5.2.7です。
（IEがすべてborder-spacingが×なのは資料で確認）
border-collapseの方はWin版IE5-6は○のようですが、Mac版はこれも×です。
tableのborder-topとborder-left、th,tdのborder-rightとborder-bottomで枠線をつける際、
ここのところの挙動が影響してくるんですよね。

156 ：Name_Not_Found：2005/06/30(木) 11:45:44 ID:???

だからどうした？

157 ：Name_Not_Found：2005/06/30(木) 14:57:16 ID:jH+scXXd

body{color:#000;}と、html{color:#000;}って何か違いがあるのでしょうか？

158 ：Name_Not_Found：2005/06/30(木) 15:42:11 ID:???

>>153-155
正しい実装をしていないUAにも対応させたいときこそ、
transitionalの出番ではないか。
それにstrictでやるなら、UAのことなんか気にする必要はありません。

159 ：Name_Not_Found：2005/06/30(木) 21:32:22 ID:???

>>157　うん、あるよ。
cf. http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic4

160 ：Name_Not_Found：2005/06/30(木) 22:14:08 ID:0OBdKVRH

CSSレイアウトのページを携帯にスタイルを読み込ませないようにしようと、調べていて下記の様な記述を見つけけました。

多分、下記の記述はNN4xや携帯に該当スタイルを読ませないためだと思うのですが、推測ですので違ってたら突っ込んで下さい。

<style type="text/css">@import url(style.css);</style>

こちらはMAC IE用だとおもうのですが、@importの前の　/*\*//*/　と最後の　/**/　はどういった意味なのでしょうか？

<style type="text/css">/*\*//*/@import "msiemac.css";/**/</style>

161 ：昔の人：2005/06/30(木) 22:35:49 ID:???

>>160　
もう>>20に既出してゐます。
　http://cssbug.at.infoseek.co.jp/detail/macie/b009.html
携帶に対しては @media handheld で振り分けするのが正統的なやり方でせう。
　http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/media.html#media-types

162 ：Name_Not_Found：2005/06/30(木) 22:44:58 ID:???

>>160

1. N4 は @import 未対応なので、@import から読み込んだ CSS は
N4 にはなかったことになる。携帯は知らん。

2. CSS のコメントは「/*」で始まり、「*/」で終わる

正しく解釈すると次の様になる

/*（ここからコメント開始）
\
（ここまでコメント）*/
/*（ここからコメント開始）
/@import "hoge.css";/*
（ここまでコメント）*/

MacIE は、コメント中のバックスラッシュ付記号をエスケープするので、

/*（ここからコメント開始）
\*//
（ここまでコメント）*/
@import "hoge.css";
/*（ここからコメント開始）
（ここまでコメント）*/

の様に解釈する。よって、MacIE のみが hoge.css を読み込む。

>>161
利用しているのは同じバグだけど、結果は逆になる。

163 ：Name_Not_Found：2005/06/30(木) 22:48:50 ID:TdgeXLui

すいません。cssじゃないんですが、ちょっと教えてください。

<TD>
...
<IMG src="x.gif"/></TD>

こんなHTMLがあって、この最後の</td>を改行するだけで
IMGで指定した画像と隙間が出来てしまうようになるんですが、
これは既知のバグだと思うので、どこかにこれについての記述がある所の
ポインタを教えてくれないでしょうか？
それともこれはまた別の問題なのでしょうか？

164 ：Name_Not_Found：2005/06/30(木) 22:54:21 ID:???

ＣＳＳでないのに、なぜここで訊くのか。

165 ：Name_Not_Found：2005/06/30(木) 22:58:44 ID:???

>>164
すんません。どこに質問するのが妥当でしょうか？

166 ：Name_Not_Found：2005/06/30(木) 22:59:59 ID:KmlWPYGH

ローカル・ルール読んでおけ、この初心者め。

167 ：Name_Not_Found：2005/06/30(木) 23:06:33 ID:???

>>158は、なんかトンチンカンなこと言ってないか。

168 ：Name_Not_Found：2005/06/30(木) 23:10:52 ID:???

ﾄﾝｶﾁﾄﾝｶﾁ

169 ：Name_Not_Found：2005/06/30(木) 23:11:38 ID:???

>>166
ローカル・ルール読んでおけ、この初心者め。

170 ：トンチンカン：2005/06/30(木) 23:19:48 ID:???

>>167
ごめんなさい。
ちゃんと読んでなかった…orz

171 ：Name_Not_Found：2005/06/30(木) 23:22:08 ID:???

>163
<p></p>で括っとけ。

172 ：　↑　：2005/06/30(木) 23:30:09 ID:???

これもトンチンカンじゃね？

173 ：Name_Not_Found：2005/06/30(木) 23:32:41 ID:???

>163
「改行空白」→google
ttp://www.google.com/search?num=100&hl=ja&inlang=ja&biw=776&q=%E6%94%B9%E8%A1%8C+%E7%A9%BA%E7%99%BD&btnG=Google+%E6%A4%9C%E7%B4%A2&lr=lang_ja
上から6番目
ttp://www.tg.rim.or.jp/~hexane/ach/stht/stht12.htm

次からは初心者スレッドあたりで聞いてください

174 ：Name_Not_Found：2005/06/30(木) 23:36:05 ID:???

>>172　sageもまともにできん奴は黙ってなさい。

175 ：　↑　：2005/06/30(木) 23:38:25 ID:???

さがってますが？

176 ：Name_Not_Found：2005/06/30(木) 23:41:53 ID:???

と言ってアゲてる全角間抜け。>>175

177 ：Name_Not_Found：2005/06/30(木) 23:48:00 ID:???

>>161
レスありがとうございます。ハック稀出でしたかすみません。

あとmedia typeは対応していない携帯も多いと聞いたので、
フジツウのサイトでjsと併用していてですが使用していたので
OKかと思って試してみましたところ、
win ie mozzila opera　Mac ie5 nn等でスタイルは読み込まれ、
自分の携帯ではスタイルは外されていたので、大丈夫かなと思ったのです。

>>162
くわしい解説ありがとうございます。
＞MacIE は、コメント中のバックスラッシュ付記号をエスケープ
知りませんでした。　一体なんの呪文かと悩んでいたのですが、そういう意味だったんですね。

携帯にPC用のスタイルを読み込ませたくない場合の記述は
<LINK rel="stylesheet" type="text/css" media="screen" href="foo.css">で

NN4と携帯にPC用のスタイルを読み込ませたくない場合の記述は
<style type="text/css">@import url("style.css") screen;</style>
になるということですね。

178 ：163：2005/06/30(木) 23:52:16 ID:???

>>173さん　ほか
関係ない質問でどうもすみませんでした。
おかげでやっと理解できました。

179 ：Name_Not_Found：2005/07/01(金) 00:49:50 ID:???

自己レスですが、

<style type="text/css">@import "aa.css" screen;</style>
だと、MAC NN7やWINのブラウザではスタイルを読み込むのですが、
Mac ieだと読み込みませんでした。

<style type="text/css">@import "aa.css" ;</style>
で、携帯は多分スタイル読み込まないだろうと希望的観測で逝くしかなさそうです。

それとも、その後に
<link rel="stylesheet" type="text/css" media="handheld" href="keitai.css">
にしたら、携帯にはkeitai.cssが優先されるなんて無いですよね。

一応上はヘッドに（@import だけど）記述だし
下はリンクだし…

と思ったところで気がつきました。

<style type="text/css">@import "aa.css" screen;</style>と
>>162さんが説明してくれた
<style type="text/css">/*\*//*/@import "msiemac.css";/**/</style>を
併用すれば、携帯とネスケ４にスタイルを読み込ませない事が出来るのですね。

今日はもう遅いので明日にでも試してみます。

180 ：Name_Not_Found：2005/07/01(金) 01:04:23 ID:???

>>179
>Mac ieだと読み込みませんでした。
既出です。
・ブラウザによる振り分け（JavaScriptを使用しない方法）
　http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua

>にしたら、携帯にはkeitai.cssが優先されるなんて無いですよね。
いいや。当然、上書きされますが。

181 ：Name_Not_Found：2005/07/01(金) 01:23:05 ID:???

>>180への直接のレスではないんだけど。

参照されているリソースの「除 NC4」に
>media属性にscreen以外の値を指定すれば読み飛ばされる。
とありますが、これは厳密には不正確で、
media="screen,screen"
でも N4 を避けられることが、1-2年前に判明しています。
テンプレで補足しといた方がよいかもしんない。

182 ：Name_Not_Found：2005/07/01(金) 01:40:13 ID:???

>>181　要するに、複数メディア指定にすると無視するってことか。

183 ：Name_Not_Found：2005/07/01(金) 01:55:38 ID:???

寝ようと思いつつ、思い立ったが吉日で、
試してみたら、「出来た」と報告に来たら、

稀出だったんですね。　無知で恥ずかしいです。
@importををネスケ４が対応しない。
外部ファイルの@importはMac ieも対応しない位しか知らずに

最近の携帯が中途半端にCSSをサポートするのにjsの対応は不明だしで、
携帯にCSSを読ませないにはどうしたらよいのだと焦ってました。

でも、今回は色々と勉強になりました。
ありがとうございました。

184 ：Name_Not_Found：2005/07/01(金) 02:15:14 ID:???

振り分けを使ってまでCSSに喰らいつく意図がわからん…

185 ：Name_Not_Found：2005/07/01(金) 03:14:03 ID:XtjrbMSQ

初めまして。

CSSを外部ファイルに分けているのですが、外部ファイルの最大ファイルサイズ
や、最大行数などはブラウザによって決まっているのでしょうか？
その外部ファイルに定義されているCSSが、途中から全く適用されなくなって
しまいます・・・。
ファイルサイズは約4KBバイトです。
200行くらい下からのCSSの定義が使用されません。(1行の文字数はだいたい20文字
あるかないかくらいです。)
当方の環境は、ブラウザがIE6, OSがWin2000です。

お願い致します。

186 ：185：2005/07/01(金) 03:41:10 ID:XtjrbMSQ

途中で切れているのではなく単に書き方がダメみたいです・・・。
しかし、正しい書き方が分かりません。

HTMLは、
<ul id="menu">
<li><a href="#" class="menu_1">Page1</a></li>
<li><a href="#" class="menu_2">Page2</a><ul class="menu_2"><li></li></ul></li>
<li><a href="#" class="menu_3">Page3</a></li>
<li><a href="#" class="menu_4">Page4</a></li>
<li><a href="#" class="menu_5">Page5</a></li>
<li><a href="#" class="menu_6">Page6</a></li>
<li><a href="#" class="menu_7">Page7</a></li>
</ul>
<div id="menuBar" class="menu_2"></div>

187 ：185：2005/07/01(金) 03:41:35 ID:XtjrbMSQ

以下、続きです。

CSSは、
#menu UL.menu_0 {
background:#f00;
}
#menuBar.menu_0 {
background:#f00;
}

#menu UL.menu_1 {
background:#eee;
}
#menuBar.menu_1 {
background:#eee;
}

#menu UL.menu_2 {
background:#aaa;
}
#menuBar.menu_2 {
background:#aaa;
}

CSSがこの順番だと、idが#menuBarのdivに背景色#aaaが適応されないのですが、
"#menu UL.menu_2" と "#menuBar.menu_2" の定義を一番上にもってくると
ちゃんとCSSが適応されます。　何がダメなのでしょうか？

宜しくお願い致します。

188 ：Name_Not_Found：2005/07/01(金) 07:35:52 ID:???

>>185
UL.menu_*のところ、ULじゃなくてliじゃね？

189 ：Name_Not_Found：2005/07/01(金) 07:55:56 ID:???

li a.menu_xx

190 ：188：2005/07/01(金) 08:01:43 ID:???

>>189
あ、確かにそうだな。
ちゃんとソース見ずにレスしちゃった（;´Д｀）
スマソ。

191 ：185：2005/07/01(金) 09:45:33 ID:XtjrbMSQ

>>188
ありがとうございました。
しかし、試してみましたが結果は全く同じでした・・・。

192 ：185：2005/07/01(金) 09:48:07 ID:XtjrbMSQ

FireFoxで見たら大丈夫でした・・・。
う、IE6のバグか！？
でも、どのバグなのか特定できないです・・・。

IE6のCSS実装のバグ・リストなどってありますでしょうか？

193 ：Name_Not_Found：2005/07/01(金) 10:36:08 ID:???

>>185
>>189見た？

194 ：Name_Not_Found：2005/07/01(金) 10:38:00 ID:???

>>186
何をやりたいのかはっきりしないんだけど、中身の無いの li と div は無視していいんだよね？
class がアンカーについているのは分かってる？

同じこと言うけど、とりあえず
#menu UL.menu_0
これは
#menu li a.menu_0
こうか
#menu UL .menu_0
こうでないと意味ないと思うよ。

195 ：Name_Not_Found：2005/07/01(金) 10:53:58 ID:???

初心者質問失礼します。
スタイルシートでレイアウトしたら好きな所に配置できて便利だったのですが、
ブラウザの大きさによって余白ができてしまいます。
表示面積の大きいブラウザでみると、左寄せのレイアウトになってしまうという具合です。
これをバランスを保ったまま中央に表示することはできるのでしょうか?

196 ：Name_Not_Found：2005/07/01(金) 10:58:29 ID:???

>>195
ヒント。

body {
text-align:center;
}

div {
margin:auto;
}

197 ：195：2005/07/01(金) 11:57:32 ID:???

なぜー！divが動かん・・・
<center>タグみたいのはないんですか･･･orzもうちょいヒントを･･･

198 ：Name_Not_Found：2005/07/01(金) 12:05:50 ID:???

>>195
ヒント。

http://infoyokohama.run.buttobi.net/のソース。

199 ：Name_Not_Found：2005/07/01(金) 12:26:16 ID:???

>>195-198　ＦＡＱ既出。>>5を見よ。

200 ：195：2005/07/01(金) 13:08:21 ID:???

もしかしてposition:absoluteで位置を指定したパーツは動かないとか?
どうしても動きません。
position:absoluteで指定したパーツの中央表示のやり方を教えてください･･･

201 ：Name_Not_Found：2005/07/01(金) 13:10:26 ID:???

>>200　「絶対」配置、の意味がわかってないのか。最初からソース出せ。

202 ：Name_Not_Found：2005/07/01(金) 13:15:39 ID:???

>>200
絶対と相対の意味を辞書で調べれ。
理解できれば、トンチンカンな質問したってわかるよ。

203 ：195：2005/07/01(金) 13:28:24 ID:???

辞書見たら分かりました。absoluteは絶対配置なんですね･･･
スタイルシートスタンダードデザインガイドって本だとabsolute使ってレイアウトする
方法が載ってるんですよ･･･
結局中央表示はテーブル使わないとダメなんですかね?

204 ：Name_Not_Found：2005/07/01(金) 13:41:40 ID:???

>>203　199が読めないのか。基礎からやり勉強しておけ。

205 ：Name_Not_Found：2005/07/01(金) 13:43:20 ID:???

position:relativeでいいじゃない。

206 ：Name_Not_Found：2005/07/01(金) 13:44:37 ID:???

>>203
お前さんの参考書なんか知ったことか。ソース出せって。でないと修正も指示できん。
それに>>5のリンク先は読んだのか？

207 ：195：2005/07/01(金) 14:23:49 ID:???

僕が言いたいのはヤフーのトップページのような
ああいうレイアウトをスタイルシートでできるのかな？
ということです。普通の中央表示ならいくらでも出来ます。
ああいうページはたいていテーブルでやってるのでそのつもりだったのですが
最近の本にはレイアウトなどはCSSで、と書いてあったから挑戦しました。
左寄せや中央表示のサイトはもう作ったので、ヤフーのトップのようなページが
作りたかったんです。

208 ：Name_Not_Found：2005/07/01(金) 14:31:17 ID:???

>>207
それなら質問の仕方が悪い。なぜ最初からそれと述べないか。猛省せよ。
どう挑戦してみたのかソース出さないなら、ここ↓でも行ってろ。
　TABLEデザインのサイトをCSSでどこまで再現できるか
　http://pc8.2ch.net/test/read.cgi/hp/1078642389/l50

209 ：195：2005/07/01(金) 14:44:44 ID:???

おぉ親切にありがとうございます。
ソースは･･･前に作ったサイトをとりあえずCSSにしただけで
へぼすぎて恥ずかしいです･･･消したり書いたり穴だらけだし･･･^^;
勉強してきます。

210 ：Name_Not_Found：2005/07/01(金) 15:17:12 ID:???

自分で調べもしないで質問に来る真似は二度とするなよ。

211 ：Name_Not_Found：2005/07/01(金) 15:56:38 ID:???

div { margin:0 auto; position:relative; }
これマジお勧め。DIV厨必須。

212 ：DIV厨：2005/07/01(金) 15:58:42 ID:???

>195
慣れれば簡単に出来る。
まずはDIVでやってみるといいよ。テーブルと使い勝手同じだから。
DIV囲いしてwidthとかmarginとかfloatするだけ。
さあ一緒にDIVに飛び込もう

213 ：ヒント：2005/07/01(金) 16:52:06 ID:???

body{
text-align: center;
}

こうすると、デザイン全てが中央揃えになるからめんどい。

だったら、

div#layout{
text-align: center;
}
がいいかも。。

214 ：Name_Not_Found：2005/07/01(金) 16:54:22 ID:???

テンプレも読まない香具師はお断り

215 ：Name_Not_Found：2005/07/01(金) 19:20:13 ID:???

.class1{hoge:piyo....}
をDOMで生成しようとしています。

色々調べてみると、予めスタイルシートを2つ用意して切り替えたり、
createStyleSheets('hoge.css')とcssファイルをしているものはたくさん見つかるのですが
スタイルシート自体をDOMで生成するサンプルが見当たりません。

スタイルを生成すれば後はaddRule/insertRuleで指定できるので
className='class1'のスタイルシートをDOMで作る方法を教えてください。
お願いします。

216 ：Name_Not_Found：2005/07/01(金) 19:28:28 ID:DunQY6AF

boxの中にある画像を
ボックスの幅にあわせて大きさが変わるようにすることって、できませんか？

217 ：ももんが：2005/07/01(金) 19:48:55 ID:???

>>216

#id{
background: url("./image.png") no-repeat center;
}

=======================とか…======================
<div class="******">
<p><img src="./photo.jpg" alt="写真" width="400" height="230" /></p>
</div>

で…

.******{
overflow: hidden;
width: 70%;
}

218 ：Name_Not_Found：2005/07/01(金) 19:58:06 ID:???

>215
スタイルシートを作るという意味がよく分からないけど
object.className = 'class1';
ということではなく？

>216
#box { width: 600px; border: solid 1px blue; text-align: center; }
#box img { width: 100%; }

<body>
<p id="box"><img src="path/to/image"></p>
</body>

219 ：Name_Not_Found：2005/07/01(金) 19:58:14 ID:???

>ももんが
日本語読めるのか？

220 ：ホームページ　プロダクション：2005/07/01(金) 20:41:00 ID:zks/yUF4

毎日がいそがしい。作り方が分からない。だけどホームページを作りたいというアナタ！当社が高品質でホームページをお作りいたします。
弊社は出来て間もないのではじめに5人という限定で無料ホームページをお作り致します。こちら→http://www16.plala.or.jp/mercigackt/

221 ：Name_Not_Found：2005/07/01(金) 20:49:12 ID:???

>>220
なんだかあなたのサイトにすごくショックを受けた

222 ：DIV厨：2005/07/01(金) 21:55:33 ID:???

自分では最強にかっこいいと思ってるんだろな。
もっとDIVを使うようになってからこい！素人め。

223 ：215：2005/07/01(金) 21:55:54 ID:???

object.className = 'class1';
は、必要なElementに埋めこんであります。
で
ただ今<style>の中身は空です。何も指定してません。
でここにDOMで動的に
.class1{hoge:piyo....}
相当のものを埋めこみたいわけです。

出来なければ、最初から.class1{hoge:piyo....} ダミーを入れますが
出来ればDOMをつかって指定したいです。

224 ：Name_Not_Found：2005/07/01(金) 22:55:30 ID:???

>>220
激しくﾜﾛﾀ

225 ：Name_Not_Found：2005/07/01(金) 23:00:05 ID:???

>>223
スタイルシートの指定そのものはDOMツリーにぶら下がるノードなのか？
ただのTextNodeじゃない？
obj = style要素
として、objのchildNodesを調べてみ。
あと、スレ違い気味。CSSそのものの話はここでいいけど、DOMいじりや
そのスクリプトはJavaScriptスレで。

226 ：195：2005/07/02(土) 01:24:45 ID:???

DIV厨さん！
divで囲ってfloatで左右に振り分けできました！もちろん中央表示!
まるでテーブルで作ったかのようにきれいに並びます!
divバンザイ！

227 ：Name_Not_Found：2005/07/02(土) 01:39:59 ID:???

また一人・・・

228 ：DIV厨：2005/07/02(土) 01:46:58 ID:???

よし！その調子だ！
3カラットや最低限の囲いはDIVで仕方ないけど、
なるべく他のブロックでテーブルは作るようにな。
Hx、LI、P辺りでもできたような気がしたぞ。

だがな、始めはそれでいい。もっとDIVに酔いしれろ。
それから>211も入れておくといいぞ。
IEとFxで描画の仕方が違うからな！

229 ：Name_Not_Found：2005/07/02(土) 01:55:37 ID:???

>DIV厨
3カラットってなに？

　宝石じゃあるまいし

230 ：Name_Not_Found：2005/07/02(土) 02:26:32 ID:???

カラム　おｒ　コラム

231 ：Name_Not_Found：2005/07/02(土) 07:37:27 ID:???

まあ最初はdivもいいだろうけど、ずっとそのままdiv路線突っ走らんようにな・・・。
table厨からdiv厨なんて本末転倒だ。

232 ：Name_Not_Found：2005/07/02(土) 11:34:11 ID:???

それには激しく同意だが、DIVの魔力から特に逃げる気もおきない俺がいる

233 ：DIV厨：2005/07/02(土) 15:16:01 ID:???

今じゃ色々やろうとするとDIVに頼らざる…いや止めておこう。
次のCSSとかその他に期待。

234 ：Name_Not_Found：2005/07/02(土) 16:15:13 ID:???

過去のブラウザが残っている限りdivは死なない
OS全てに10年程度のリミット付けて使えなくするくらいの強制さがないと

235 ：ももんが：2005/07/02(土) 16:30:30 ID:???

<div>は意味はないけれど、便利だよね。
でも構造的には意味が無いから、やっぱり見出しは<h1>～<h6>とか段落は<p>じゃないとね。

<div id="heading_level_1">モナーファンサイト</div>
<div class="p">段落ワハハ</div>

/* CSS */

div#heading_level_1{
font-size: 200%;
}

div#p{
font-size: 96%;
}

ぷっ

236 ：Name_Not_Found：2005/07/02(土) 17:15:48 ID:???

何年も前にdiv厨という言葉を聞いたが
結局なぜそんなに悪いか分かりません。
マジでなんでダメなの？
今更pに直して、P厨になるのもどうかと、

237 ：ももんが：2005/07/02(土) 17:29:41 ID:???

>236
えー、せっかく>>235で説明してあげたのに…
<div>ですると、CSS切ってるユーザにどのように表示されるか想像してごらんよ。

<h1>ももんがサイト</h1>
<p>俺はDIVERです。しかもW3C信者で、毎日近くの教会に逝きます。教会とは、W3Cが
行ってる自動HTMLチェッカです(ry </p>

<div id="h1">ももんがサイト</div>
<div id="p1">俺はDIVERです。しかもW3C信者で、毎日近くの教会に逝きます。教会とは、W3Cが
行ってる自動HTMLチェッカです(ry </div>

これじゃ、スタイルシート切った時にHTMLの意味無くなっちゃうよ。
これならテキストファイルを見てるのと同じ。

238 ：Name_Not_Found：2005/07/02(土) 17:57:22 ID:???

>>236ではないですが、質問。

>>237
じゃあ、tableレイアウトのかわりに
divレイアウトにするのは問題ないってことですよね？？
（ホントにdivの何が問題なのかわからんので教えてください）

239 ：ももんが：2005/07/02(土) 18:03:25 ID:???

<h1>ももんがサイト</h1>
<p>俺はDIVERです。しかもW3C信者で、毎日近くの教会に逝きます。教会とは、W3Cが
行ってる自動HTMLチェッカです(ry </p>

<div id="h1">ももんがサイト</div>
<div id="p1">俺はDIVERです。しかもW3C信者で、毎日近くの教会に逝きます。教会とは、W3Cが
行ってる自動HTMLチェッカです(ry </div>

------------------------------------
このソースを http://sussiweb.com/hp/tool/tag.htm の<body>区間に括って見て御覧。違いが分かると思うけど。

240 ：Name_Not_Found：2005/07/02(土) 18:15:29 ID:???

>>239
そんな使い方してるヤシいるの？
いるんだろうな・・・orz

例えば
<div>
<h1>ももんがサイト</h1>
<p>昨日狐に食われかけたので木の上から跳んで逃げますたが、
着陸したところにクマたんがいて食われますた(´･ω･`)/~~</p>
</div>

こんな感じはどうかと>>236たちは訊きたいんだと思う。

241 ：Name_Not_Found：2005/07/02(土) 18:15:46 ID:???

<div id="layout_h1"><h1>たいとる</h1></div>
<div id="layout_p1"><p>ないよう</p></div>
divレイアウトってこうだろ

242 ：Name_Not_Found：2005/07/02(土) 18:23:41 ID:???

body > div > imgっていう構造はまずいって本当ですか？

243 ：238：2005/07/02(土) 18:24:57 ID:???

>>240　それです！
この方法を使ってるのがdiv厨って言われるなら、私はどうしたら…orz

244 ：Name_Not_Found：2005/07/02(土) 18:26:42 ID:???

俺はなるべくdivの入れ子はさけて、
大まかなボックスだけdivで囲うスタイルデス。

245 ：Name_Not_Found：2005/07/02(土) 18:31:53 ID:???

おまいら、CSSの質問をどうぞですぅ。

246 ：Name_Not_Found：2005/07/02(土) 18:35:50 ID:Jbn/ORSz

ここのサイドバーの背景のスタイルシートの色ってなんだかわかりますか？
http://staff.1.dtiblog.com/?style=general_blog_01

247 ：ももんが：2005/07/02(土) 18:38:23 ID:???

>245
ｽﾏｿスレ違いです。
こっちにしようかな？http://pc8.2ch.net/test/read.cgi/hp/1119193120/l30

>>240
うじゃうじゃいます。

>>241
それもありえる。はっきし言って<h1>で括ってるのにもかかわらず
<div>で括っている。無駄ですよねー。

248 ：ももんが：2005/07/02(土) 18:44:47 ID:???

>>243
<div>はボックス(箱)だと思って下さい。その中にいろんな物入れるんだけど…

例えばこんなのがある。

ロゴ・タイトル #header
メニューバー・ナビゲーションバー #menu #navigation #navi
コンテンツボックス #content #contents
著作件表示等 #footer

俺はこれ以外で<div>は使わない。(むしろ#headerも使わん)
#contentsや #navigation は、ポジションを指定してる。

タイトルは<h1>だけど、、
h1{
color: #096;
font-size: 200%;
text-align: center;
}

です。。

249 ：238：2005/07/02(土) 18:52:13 ID:???

>>248
レスサンクスです。
そういうのはdiv厨って言わないんですね、ホッとしました。

>>247で貼ってくださったスレでこんなの見つけたんで、紹介しときますね
http://pc8.2ch.net/test/read.cgi/hp/1119193120/82
【(´-`).｡ｏＯ人はTABLEにもどってくるんだよ。】

82 ：MOHEI ◆GrsqjXpGxE ：2005/06/25(土) 08:30:23 ID:??? ?

最後に俺が、紹介するテーブルを一切使わず CSSだけでデザインされたサイトを晒します。
ソースを見るとビックリ!!すごくキレイですね。と言う訳でテーブルがありません...
ﾉｼ

ttp://www.opera.com/
ttp://www.utep.edu/asu/
ttp://www.sprintpcs.com/
ttp://www.csszengarden.com/index.php?cssfile=/046/046.css&page=15

>>245
これで退散します。スレ違いｽﾏｿでした

250 ：Name_Not_Found：2005/07/02(土) 19:51:41 ID:???

質問よろしくお願いします。

h1やh2のテキスト前にアイコンの様な画像を表示させたいと思います。

↓コレが画像
■欲しがりません勝つまでは

そしてテキストが1行で収まる場合と2行に渡る場合があるのですが、
各々画像の中心部へテキストが寄る様に表示されるには、どうしたら良いですか？

縦方向の位置なのでvertical-alignかなと思い調べたところ、
適用される要素がインライン要素やtd、thだったので迷ってしまいました。

251 ：250：2005/07/02(土) 19:52:50 ID:???

すいません↑の投稿、無駄なスペースが空いてしまいました。

252 ：Name_Not_Found：2005/07/02(土) 20:06:42 ID:???

>>250
「見出し」が何故そんなに長いんだ。

文書構成の鉄則。→見出しは簡潔

253 ：ももんが：2005/07/02(土) 20:17:03 ID:???

>>250
ヒント::::::

<h1 class="header">欲しがりません勝つまでは</h1>

スタイルシート::::::::

h1.header{
background: #fff url("images/h1.gif") center left no-repeat;
padding: 12px 0px 0px 25px;
margin: 10px;
color: #000;
font-size: 130%;
text-align: left;
}

padding と margin は画像の大きさに合わせて変更して下さい。
そうしないと、<h1>の文章と■の画像が重なって見えずらくなります。ﾉｼ

254 ：Name_Not_Found：2005/07/02(土) 22:42:25 ID:???

<div class="contentsarea">

<div class="maincontents">
<div id="pickupmenu_d">
<div class="lay2col">
<div class="col1">

<h2 class="bg010relative">
<span class="bg010inside">製品 & サービス</span>
<span class="link010"><a href="/services/">全製品・サービス一覧<img src="arrow-next-home.gif" width="14" height="11" alt="" style="border-style: none; margin-left: 3px;" /></a></span>
</h2>

<div class="innerblock">
<div class="lay2col">
<div class="col1">
<div class="innerblock">
<h3>個人のお客様</h3>
<ul>

jp.fujitsu.comのソースの一部ですが、これもdiv房ですか？
複数のブラウザでずれない用にするためには仕方ないと思うのですが…

255 ：Name_Not_Found：2005/07/02(土) 23:08:51 ID:???

転載すんなカス

256 ：Name_Not_Found：2005/07/02(土) 23:20:57 ID:??? BE:82321027-##

>>254
あるあるｗｗｗ

257 ：Name_Not_Found：2005/07/02(土) 23:28:05 ID:lpoGoyU9

■■■　お勧めレンタルサーバー　■■■

格安で落ちまくるサーバーはストレス満載！
サーバーダウンしない安定サーバーを探せ！

Ａ：超安定サーバー。お勧め!!　　
　http://www.webspeed.ne.jp/　　
　http://www.wadax.ne.jp/
　http://www.ktplan.ne.jp/
　http://domainya.net/
　http://per.cssv.jp/
　http://poke1.jp/

Ｂ：ある程度の障害は大目に。　
　http://www.binboserver.com/
　http://s55.net/
　http://www.j-navi.com/
　http://web.arena.ne.jp/suite2/
　http://www.sakura.ne.jp/
　http://cpi.ad.jp/

258 ：Name_Not_Found：2005/07/02(土) 23:52:26 ID:???

セルの背景(ひとつだけ)を設定する方法が分かりません。
.td {background-image:url(...img/back.gif)
じゃ出来ないのでしょうか？

259 ：Name_Not_Found：2005/07/02(土) 23:55:06 ID:???

>>258
td {
　　background-image:url(...img/fuck.gif)
}

260 ：Name_Not_Found：2005/07/02(土) 23:55:45 ID:???

即レスありがとうございます。
}入れ忘れてました

261 ：Name_Not_Found：2005/07/02(土) 23:57:23 ID:ghHbEw8A

<td>の中に画像を入れているのですが、画像の下に隠れるようにテキストをいれることはできますか？
画像がないときのために altの代わりにテキストを入れておきたいんですが…

262 ：Name_Not_Found：2005/07/02(土) 23:59:06 ID:???

>>261
http://adp.daa.jp/archives/000054.html

263 ：Name_Not_Found：2005/07/03(日) 00:03:51 ID:???

>>262
すばらしい！㌧

264 ：Name_Not_Found：2005/07/03(日) 00:12:18 ID:???

<p style="width: 100px; border: 1px solid black;">hoge</p>
これで線を含んだ100pxか、線を含んで102pxになるブラウザがあるからこそ

<div style="width: 100px;"><p style="border: 1px solid black;">hoge</p></div>
これくらいはする必要が出てくるわけで。

そのうち div 以外に width/height/border を指定するのは危険だと思えてくる。

265 ：Name_Not_Found：2005/07/03(日) 00:22:46 ID:???

頭、大丈夫か？

266 ：Name_Not_Found：2005/07/03(日) 00:24:07 ID:???

>>264
標準準拠モードにしちまえばいいだけの話じゃね。

267 ：Name_Not_Found：2005/07/03(日) 00:33:13 ID:???

そんなの知らん

268 ：Name_Not_Found：2005/07/03(日) 00:38:50 ID:???

>>267
ォィォィ・・・orz
一歩譲って標準準拠を知らないとしてだ。
divにwidthやborderを指定しても後方互換モードなら
paddingも一緒に指定しちまえば危険は一緒だろう。

269 ：Name_Not_Found：2005/07/03(日) 00:39:39 ID:???

>>262
IEはOKですが、NNはダメでした…　orz

270 ：Name_Not_Found：2005/07/03(日) 00:42:06 ID:???

>>269
NN4か？　もうそんな古いのは無視してもいいんじゃないかな、と思ったり。

271 ：Name_Not_Found：2005/07/03(日) 00:44:51 ID:???

>>270
NN7.1…

272 ：Name_Not_Found：2005/07/03(日) 00:57:13 ID:???

>>271
今NN7.1でさっきのサイトのを見てみたけど、特に異常ないなぁ。
書き方がおかしいのか？

他には、
margin-top（bottom）:-**px
でかぶせたらどうだろう？

273 ：Name_Not_Found：2005/07/03(日) 01:02:49 ID:???

>>272
しょせんbackgroundなので、画像の上に文字が表示されてしまいます。
IEもよ～く見ると文字が見えていたりして…
やっぱり絶対位置指定であとから上書きですかね？

274 ：Name_Not_Found：2005/07/03(日) 01:08:01 ID:???

>>273
そうするしかないのかなぁ。
絶対位置指定したのは、Googleキャッシュなどでは変な位置になっちゃうから
あまり好きではないけどね（;´Д｀）

275 ：Name_Not_Found：2005/07/03(日) 01:37:13 ID:9Bgg05kX

マルチで申し訳ないのだが、忘れられたのでこちらで聞きます。
表組みの連結についてですが、

ttp://www2.atwiki.jp/popnwakaba/pages/9.html
を
ttp://www.wikihouse.com/popnwakaba/index.php?Lv3%A1%C1Lv7
のように表組みを連結させるにはどういったCSSコマンドが必要でしょうか？
ちなみに上のCSSは
/*テーブル枠線設定*/
/*テーブル枠線の外回り部分*/
div#main table{
border-top: #888899 1px solid;
border-bottom: #888899 1px solid;
border-left: #888899 1px solid;
border-right: #888899 1px solid;
padding:3px;
}
/*テーブル枠線の内回り部分*/
div#main td{
border-top: #888899 1px solid;
border-bottom: #888899 1px solid;
border-left: #888899 1px solid;
border-right: #888899 1px solid;
padding:3px;
background-color: #B0E0E6;
}
/*テーブル枠線を重ねて表示*/
table,td{
border-collapse: collapse;
}
を貼ってます

276 ：Name_Not_Found：2005/07/03(日) 02:09:24 ID:???

「連結」の意味がわからん。コマンドって何やねんコマンドって。

<td colspan="2">とか<td rowspan="2">みたいなことを言ってるなら
CSSとは全然関係ないな。スレ違い。

277 ：Name_Not_Found：2005/07/03(日) 02:34:12 ID:9Bgg05kX

例で言うと下のサイトは「中」と「強」のボックス(テーブル？)
が結合されてるのですが上のサイトは結合されないんです。

|中|あいう|えお|
|~|かきく|けこ|
とやれば下のようになるのですが
上のサイトでは「~」が表示されてできない。

という意味です。

278 ：Name_Not_Found：2005/07/03(日) 02:39:54 ID:???

だからスレ違いですって。@wikiの記法を調べるとかしてください。

279 ：Name_Not_Found：2005/07/03(日) 10:20:36 ID:???

最近思うんだけどスタイルシート別に作ってリンクはって
いちいちクラス名つけて指定していくより
divでくくっちゃってそのつどスタイル指定した方が楽だ。配置も楽だし。
スタイルシートを別に作る利点がいまいち分からない。

280 ：Name_Not_Found：2005/07/03(日) 10:25:33 ID:???

後々のことは考えないたちかい？

281 ：Name_Not_Found：2005/07/03(日) 10:41:54 ID:???

>>279
同じ体裁のページがたくさんある時は外部リンクの方が楽だよ

282 ：279：2005/07/03(日) 10:47:46 ID:???

なるほど・・・似たような構成のページか･･･
俺のサイトは似た構成のページがないｗ

283 ：Name_Not_Found：2005/07/03(日) 13:07:35 ID:???

それを厨サイトと呼ぶ。

284 ：サカグチ：2005/07/03(日) 15:08:24 ID:a6qHKM7U

http://www.geocities.jp/sakaguchiapple/

ＩＥ以外で見るとオカシイ。

どなたか問題点を直していただけないでしょうか。

285 ：サカグチ：2005/07/03(日) 15:13:20 ID:a6qHKM7U

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
　<head>
　　<title>The apple</title>
　　<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
　　<meta name="Keywords" content="日記，The apple，THE APPLE ，apple，APPLE，サカグチ">
　　<meta name="robots" content="index,follow">
　　<mata name="author" content="サカグチ">
<link rel="stylesheet" href="style.css" type="text/css">
　</head>
　<body>
<div class="top">
<p>
<img src="top.jpg" alt="The apple">
</p>
<p>
中３の日記。
</p>
<p>
http://www.geocities.jp/sakaguchiapple/
</p>
</div>

286 ：サカグチ：2005/07/03(日) 15:13:34 ID:a6qHKM7U

<div class="left">
<div class="1">
MENU
</div>
ああああ
<div class="1">
COUNTER
</div>
<div class="about">
かうんた
</div>
<div class="1">
Link
</div>
<div class="about">
りんく
</div>
<div class="1">
NEW
</div>
<div class="about">
一週間の出来事
</div>
</div>

287 ：サカグチ：2005/07/03(日) 15:13:45 ID:a6qHKM7U

<div class="right">
　<dl>

<dt>2005.07.02</dt>
<dd>

<p>
今日の日記は笑えません。更に，東京事変が分からないと読む事さえ出来ません。
本当すいません。サカグチです。
</p>
</dd>

</dl>
</div>

<address>
CopyRight© 2005- <a href="mailto:[email protected]">サカグチ</a> All Rights Reserved. Since 2005.06.06
</address>

　</body>
</html>

288 ：サカグチ：2005/07/03(日) 15:14:32 ID:a6qHKM7U

div.top
{font-style: normal;
font-valiant: normal;
font-weight: bold;
font-size: 16px;
line-height: 18px;
font-family: sans-serif;
color: #808080;

text-align: right;

border-style: solid;
border-width: 1px;
border-color: #808080;

background-color: #c0c0c0;

padding: 0.5em;

width: 750px;
height: 150px;
}

289 ：Name_Not_Found：2005/07/03(日) 15:28:28 ID:???

>>284
ソースの中の全角スペースを半角に置き換えろ。
話はそれからだ。

290 ：Name_Not_Found：2005/07/03(日) 15:45:58 ID:???

>>284
やべ、初めて真性のDIV厨のサイト見ちまった。

291 ：Name_Not_Found：2005/07/03(日) 16:54:25 ID:???

神降臨

292 ：ももんが：2005/07/03(日) 16:56:37 ID:???

俺は、 <div id="left">が気に食わない。分かるでしょ？
leftってなー。。。

しかも<div>房で厨房かいな。

293 ：Name_Not_Found：2005/07/03(日) 17:10:16 ID:???

>>284
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

↓

<!SGML HTML SYSTEM "http://www.satoshii.org/dtd/geo/geo-html.sd" >
<!DOCTYPE html SYSTEM "http://www.satoshii.org/dtd/geo/geo-html.dtd" >

参考：http://www.geocities.co.jp/Hollywood-Studio/8691/

294 ：Name_Not_Found：2005/07/03(日) 17:19:18 ID:???

>>292
<div class="left">じゃないか？
id="left"はそんなに変じゃない。

idで位置を規定して
classでコンテンツ関係を規定するのは割と良くある手法だから。

295 ：ももんが：2005/07/03(日) 17:24:38 ID:???

>>294
ｽﾏｿ、目がおかしかった。classだ。orz

296 ：Name_Not_Found：2005/07/03(日) 18:07:12 ID:kryGHKfm

こんにちは。
HTML内部に下のようなDIVタグがあるのですが、
<div id="test"><a href="#">TEST</a></div>
外部ファイルのCSSに
<style type="text/css">
#navi a {
display:block;
border: 2px solid #00f;
width:100%;
margin: 10px;
color: #f00;
}
</style>
と記述してもそのCSSが適応されないのですが、
以下のように空の#naviのセレクタを定義すると
ちゃんと"#navi a"のCSSが適応されます。
<style type="text/css">
#navi {
}
#navi a {
display:block;
border: 2px solid #00f;
width:100%;
margin: 10px;
color: #f00;
}
</style>
これってブラウザのバグなのでしょうか？
当方の環境はIE6のWin2000です。

宜しくお願い致します。

297 ：Name_Not_Found：2005/07/03(日) 18:09:42 ID:???

>>296
そりゃ、id="test"なのに#naviだもんな。
後、スタイルシートはで囲めよ。

298 ：296：2005/07/03(日) 18:11:32 ID:kryGHKfm

すみません・・・一部書き間違えました。
HTML内のDIVタグは、
<div id="test"><a href="#">TEST</a></div> ではなく、
<div id="navi"><a href="#">TEST</a></div> の間違いです。
idはtestではなく、naviです。
宜しくお願い致します。

299 ：Name_Not_Found：2005/07/03(日) 18:16:43 ID:???

ヒント：
!important;

300 ：296：2005/07/03(日) 18:26:28 ID:kryGHKfm

>>299
当方の質問へのヒントでしょうか？
!important;を調べてみたのですが、どうも違うような・・・。

301 ：296：2005/07/03(日) 18:29:06 ID:kryGHKfm

>>297
スタイルシートを以下のように  で囲んだら、ちゃんと動作しました！
<style type="text/css">

</style>

これって何故なのでしょうか？
 ってCSSが理解できないブラウザにコメントと解釈させる
ためだけですよね・・・。
今後のためにも是非理由を教えていただけますでしょうか？？？
宜しくお願いします。

302 ：Name_Not_Found：2005/07/03(日) 18:29:51 ID:???

外部ファイルのCSSに
<style type="text/css">
これは不要だぞ

303 ：296：2005/07/03(日) 18:40:35 ID:kryGHKfm

>>302
ありがとうございました。
<style>タグを削除したら、 無しでも動作いたしました。
外部ファイルのCSSの正確な書き方は、
[ここから]

[ここまで]
で宜しいでしょうか？

304 ：Name_Not_Found：2005/07/03(日) 18:46:24 ID:???

もいらんよ。

305 ：Name_Not_Found：2005/07/03(日) 18:49:53 ID:???

んでファイルの文字コードに合わせて、

@charset "Shift_JIS";

などと先頭に加えてやればなお良い

306 ：ももんが：2005/07/03(日) 19:54:34 ID:???

これを外すと、CSSに対応していないブラウザで表示するとソースが露出
してしまうのですが…

コメントは付けてくれ!

307 ：Name_Not_Found：2005/07/03(日) 20:05:56 ID:???

>>306
>>304は>>303へのレスだってことはわかってるか？
それとも「外部ファイルでは」という前置きを入れろという突っ込みか？

308 ：Name_Not_Found：2005/07/03(日) 20:11:44 ID:???

(´-`).｡oO( >>296とももんがはどんな勉強してきたんだろうなぁ・・・)

309 ：ももんが：2005/07/03(日) 20:17:57 ID:???

レス読み飛ばしｽﾏｿ

310 ：Name_Not_Found：2005/07/03(日) 20:18:49 ID:???

>>306
HTML文書内でstyle要素としてスタイルを定義する場合、を付けてもよい。
style要素を解さないブラウザがstyle要素の内容を本文として表示してしまうのを避けるために、
これは有益である。

XHTML文書内でstyle要素としてスタイルを定義する場合、は付けてはならない。
なぜなら、XHTMLではstyle要素型の内容モデルが#PCDATAとして定義されているために、
で囲まれると単なるコメントになってしまうからである。

外部ファイルの場合、を付けてもよい。しかし、付ける実益はまったくない。

311 ：Name_Not_Found：2005/07/03(日) 21:18:59 ID:???

IEでは次の指定の仕方でオーバーしたときにunderlineが出るのですが、

a:hover { text-decoration: underline }
a:link { text-decoration: none }
a:visited { text-decoration: none }

Operaだとこういう風に順番を入れ替えないと表示されません。

a:link { text-decoration: none }
a:visited { text-decoration: none }
a:hover { text-decoration: underline }

Operaではlinkとvisitedにhover上書きされてるのかなってのは何となくわかるのですが、これはブラウザ側のバグなのでしょうか？
それともIEが柔軟なだけで次のように指定してやるのが普通なのでしょうか？

a:link:hover { text-decoration: underline }
a:visited:hover { text-decoration: underline }

解決法はみつかったものの、疑問に思ったので質問します。

312 ：Name_Not_Found：2005/07/03(日) 21:21:38 ID:???

打ち込みミスです。

a:link:hover { text-decoration: underline !important }
a:visited:hover { text-decoration: underline !important }

でした。

313 ：Name_Not_Found：2005/07/03(日) 21:24:39 ID:???

って、違う。
何度も何度もすまんorz

a:hover { text-decoration: underline !important }

だけでいいのかな。
いや、もうわけわからん。それも含めて教えてください('A`)

314 ：Name_Not_Found：2005/07/03(日) 21:33:47 ID:???

id="left"も変だろ。
右にしたくなったらrightに全部書き換えろってか?

なんでそこがどういう意図でグループ化したかをかけよ。
"navi"とかみたいに。

315 ：Name_Not_Found：2005/07/03(日) 21:38:31 ID:???

別にいいじゃん
そのサイトの作成者がどういったポリシーを持ってるのかまで気にかけなくても

316 ：Name_Not_Found：2005/07/03(日) 21:39:18 ID:i6vvG2JK

>>311
http://www.mozilla.gr.jp/standards/webtips0012.html

317 ：Name_Not_Found：2005/07/03(日) 21:40:32 ID:???

>>311
　ここらへん読むと勉強になるかも知れない。

　実は重要！スタイルシートの記述順！
http://allabout.co.jp/computer/hpcreate/closeup/CU20050621A/index.htm?FM=rss

318 ：Name_Not_Found：2005/07/03(日) 21:41:03 ID:???

>>311
後に書かれたものに上書きされていくから
条件が狭いものほど後に書く必要がある

ググったらこんなん出ました
ttp://allabout.co.jp/computer/hpcreate/closeup/CU20050621A/?FM=rss

319 ：Name_Not_Found：2005/07/03(日) 21:44:32 ID:???

>>316-318
エロイ人達、ありがとう。
IEが柔軟というか勝手に解釈してるだけなんですね。

320 ：Name_Not_Found：2005/07/03(日) 22:05:19 ID:/08Uehkv

質問です。
http://trashtoy.hp.infoseek.co.jp/css-study/pin.html
のような、コルクボードにカードをピン留めした感じのデザインを作ろうとしたのですが
外枠のdiv要素にwidth指定をした場合、IEではピンの画像が途切れてしまいます。
ちなみにFirefoxとOperaでは意図した通りに表示されています。

IEで意図した通りに表示させるにはどこを直せばよいのでしょうか。

321 ：Name_Not_Found：2005/07/03(日) 22:08:58 ID:???

h2 を relative でマイナス指定してやればいいんじゃね？

322 ：Name_Not_Found：2005/07/03(日) 22:15:00 ID:???

お前まじで頭いいな

323 ：Name_Not_Found：2005/07/03(日) 22:49:02 ID:???

一日一ページ。
今までのテーブルデザインされたページをCSSに切り替えていこう。
作業は何百とあるので大変だけど将来のことを考えれば。
現にデザインを変えたいときに『うわ…こんな大量にあるのに…』ってなる。
今は大変だけど頑張る！

324 ：Name_Not_Found：2005/07/03(日) 23:28:28 ID:???

H2やH3を使うようになりました。
そこで囲む感じで背景とborderをつけたんですが、
中の文字がこんな感じで上側にベットリくっついてしまいます。

_________________________________
|　　　　　　タイトル　　　　　|
|________________________________|

paddingでtopとbottomを微調整するしかないですか？
全体のcenterがあるのならいいんですけど…。

325 ：サカグチ：2005/07/03(日) 23:37:51 ID:a6qHKM7U

あ。かなり叩かれてる。すいません。勉強不足で。

１　divの多用はなぜいけないか教えてください。

２　全角を半角に変える意味を教えてください。

宜しくお願いいたします

326 ：Name_Not_Found：2005/07/03(日) 23:47:06 ID:???

>>325
ここの人たちがイヤがるdivの使い方って言うのは、
適切なタグが用意されているのに、それを使わずに
わざわざdivやspanで代用すること。
領域ごとにdivで囲んでidやclassつけるのなら、
それは本来の使い方だから一向に構わない。

全角スペースはマルチバイト文字です。
CSSではコメント以外ではASCII文字しか使えないので
ブラウザによってはまずいかと思います。

327 ：Name_Not_Found：2005/07/03(日) 23:47:32 ID:j2dCw3aB

>>325
てめぇで調べろ

328 ：Name_Not_Found：2005/07/03(日) 23:47:53 ID:???

ださ

329 ：Name_Not_Found：2005/07/03(日) 23:49:25 ID:???

>>324
h2 や h3 に height でも指定してるんだよな？
height をやめて line-height にすれば、ある程度思い通りになるかと。
改行入ると見辛くなるけどなー

330 ：Name_Not_Found：2005/07/03(日) 23:57:52 ID:???

>326
＞CSSではコメント以外ではASCII文字しか使えない
んなこたない
もしそうなら font-family が指定できなくなる

331 ：サカグチ：2005/07/03(日) 23:59:19 ID:a6qHKM7U

>>326

では，適切なタグとはこの場合なんでしょうか？
更に，適切なタグ以外で構成すると，どんな障害が起こるのでしょうか？

332 ：Name_Not_Found：2005/07/04(月) 00:04:39 ID:???

>>331
おまえマークアップって分かるか？

333 ：サカグチ：2005/07/04(月) 00:08:13 ID:splnzNPL

>>332

検索してみた所。分かりました。
マークアップ
という言葉が分からなかったため検索できませんでした。
すいません。

適切なタグを教えてください

334 ：Name_Not_Found：2005/07/04(月) 00:11:56 ID:???

>>333
ここは子守するところじゃねぇんだよ、てめぇで調べろや
>>332はマークアップ学べって意味だ

335 ：Name_Not_Found：2005/07/04(月) 00:50:19 ID:???

>>331
見出しをh1～h6要素としてマーク付けしたり
箇条書きをul要素やol要素としてマーク付けするのが適切なマーク付け。
適切なマーク付けをした上でならdivを多用しようがしまいがそれほど問題にはならない。

適切なマーク付けをしないと、文書制作者の意図が正確に伝わりにくくなる。
「適切にマーク付けしなくても、それっぽく表示されればそれでいいんじゃない？」
というかもしれないが、それはあなたが想定している環境でのみ「それっぽく表示」
されるだけであって、想定していない環境―例えばテキストブラウザ、音声ブラウザ、
携帯のブラウザ、閲覧者が独自のスタイルシートを使っているブラウザ、
将来のブラウザ、…―だとまったく意味不明になるとこだってありうる。
それは、環境に依存しないように作られたHTMLの利点を殺す行為。

適切にマーク付けされていれば、文書制作者の意図を抽出することが容易になる。
例えば、文書制作者がh1～h6要素としてマーク付けしているものを抽出すれば、それだけで目次になる。
重要な単語を調べたければ、em要素やstrong要素を抽出すればいい。

そのように、WWWを使いやすいものにするか使いにくいものにするかはあなた次第。
使いやすいものにしたかったら、HTMLを学べよ。
幸い、ウェブにはHTMLに関する優れた文献がたくさんある。次にその一部を挙げておく。

はじめてのWebドキュメントづくり（http://www.asahi-net.or.jp/~sd5a-ucd/www/）
ごく簡単なHTMLの説明（http://kanzaki.com/docs/htminfo.html）
PC Tips（http://members.jcom.home.ne.jp/pctips/）
bakera.jp（http://bakera.jp/）
HTML 4.01仕様書の翻訳（http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html）

ていうか>>293は無視か？

336 ：Name_Not_Found：2005/07/04(月) 01:19:12 ID:???

filterに関して質問なんですが、半透明にする際
Alpha
progid:DXImageTransform.Microsoft.Alpha
の2通りがありますが、この2つの違いはなんなのでしょう？
それから後者の方はIE5.5からということですが、何故既にAlphaと使えるものがあるのにIE5.5からのものとして追加したのでしょうか？

337 ：320：2005/07/04(月) 02:30:01 ID:IG69qUM9

さきほど質問させていただいた >>320 です。
おかげさまで出来ました！　即レスどうもありがとうございます。

http://trashtoy.hp.infoseek.co.jp/css-study/pin.html

それにしても議論アツいですね～
適切なマーク付けうんぬんって話なんですけど、例えば
「見出しを見出しとしてマーク付けすることによって、例えば amaya のようなブラウザでは、
論文の目次みたくアウトラインを表示してくれる」
みたいな例を挙げてやれば理解しやすいんじゃないかな～と思います。

338 ：Name_Not_Found：2005/07/04(月) 07:27:51 ID:???

>>サカグチくん
たとえばお前のサイトを例にとると、
<div class="box">
<a href="index.html">Home</a>
</div>
こんな部分があるが、この<div>は一体何のためにつけてるんだ？
<a>に直接指定すればよかろうに。
わざわざ<div>で囲わなくても<a>に指定すれば同じように出来るのに。
こういう無駄がここの住人は大嫌いなんだよ。

339 ：Name_Not_Found：2005/07/04(月) 07:37:02 ID:???

>>338
お前もマークアップ勉強してこい。

340 ：Name_Not_Found：2005/07/04(月) 07:46:27 ID:???

>>339
ﾌﾟ

341 ：Name_Not_Found：2005/07/04(月) 09:05:19 ID:VrrORxok

テイブルレイアウト⇒CSSレイアウトって言えば↓が有名
ttp://www.yahoo.com
ttp://news.com.com/

342 ：Name_Not_Found：2005/07/04(月) 11:05:06 ID:qP0z/Wc2

【Webノウハウ】神王リョウ様って【ir大学】
http://pc7.2ch.net/test/read.cgi/affiliate/1120404632/l50

【Webノウハウ】神王リョウ様3冊目【ir大学】
http://money4.2ch.net/test/read.cgi/manage/1116439833/

343 ：Name_Not_Found：2005/07/04(月) 13:18:53 ID:???

ももんがが無知なのはわかった
ところで、なんでこいつコテハン？

344 ：Name_Not_Found：2005/07/04(月) 13:52:36 ID:???

>>310
亀？だけど、
XHTMLはを非推奨にしてなかったっけ？

345 ：Name_Not_Found：2005/07/04(月) 16:13:27 ID:sff2npHS

googleなどのキャッシュでCSSの文字サイズ、背景などが機能しないのはなぜでしょうか？

346 ：Name_Not_Found：2005/07/04(月) 16:34:50 ID:???

CSSをキャッシュしてないからじゃない？
ページ内にスタイルシート埋めればOK。

347 ：Name_Not_Found：2005/07/04(月) 22:07:35 ID:???

>>345-346
Googleのキャッシュは確か外部ファイルはキャッシュしないらしい。っつーか、Google指定のキャッシュ
が適用されてしまうのでは?ようわからんけど。

348 ：Name_Not_Found：2005/07/04(月) 22:31:37 ID:???

俺はGoogleのキャッシュは捨ててるよ。
中途半端に背景付けといてレイアウトグチャグチャだし。

349 ：Name_Not_Found：2005/07/04(月) 22:38:50 ID:???

CSSによって<PRE>のような表示方法はできますか？

例えば、
<div class="code">
void main(void)
{
　　　return;
}
</div>
のようにしたいのですが・・・。

350 ：Name_Not_Found：2005/07/04(月) 22:45:09 ID:???

>>349
http://hp.vector.co.jp/authors/VA022006/css/text.html#white-space

> 【注】：特に 'pre' の指定には充分に注意してください。
> 制作者が指定したwhite-spaceプロパティは，CSS仕様の適合性において無視される可能性があります。
> また，CSS非実装（または制作者スタイルが無効な設定）の HTML適合 UA も考慮する必要があります。
> 従って，ソースコードの例示などのように整形済みテキストを必要とする場合，HTML文書においては，
> スタイル指定ではなく，pre要素でマーク付けしておくのが無難です。

351 ：Name_Not_Found：2005/07/04(月) 22:50:06 ID:???

> <div class="code">
> void main(void)
> {
>　　　return;
> }
> </div>

？？？？？？？？？？？？？？

352 ：Name_Not_Found：2005/07/04(月) 23:18:35 ID:???

>>350
あ～ありがとうございます
でも、これってXHTML+CSSとしてやってしまってもいいのかな？なんて思うのですが・・・。

353 ：Name_Not_Found：2005/07/04(月) 23:24:41 ID:???

>>344
xhtmlでstyle要素に書く事は禁止でも、文法違反でもないよ。
コメントとして扱われて、cssとして解釈されなくなるだけ。
application/xhtml+xmlとか使うと、firefoxなどは実際そうなる。

354 ：質問厨：2005/07/05(火) 00:24:03 ID:???

BODYの横幅設定が思うように設定できないので教えてください。
全体の横幅を750px固定にするのが理想です。
IE：数値や単位を変更しても幅が100%で変わらない。
（marginやpaddingの指定はできる。）
Ff1.0：問題なし
NN7.0：問題なし

【html】--------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="description" content="ここにサイトの紹介文">
<title>タイトル～hogehoge～</title>
<link rel="stylesheet" href="test.css" type="text/css" title="test">
</head>
<body>
<div id="top">
<h1>タイトル～hogehoge～</h1>
<p>hogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲhogeほげHOGEホゲ</p>
</div>
</body>
</html>

【CSS】---------------------------------------------------------------
body {
width:750px;
}

355 ：Name_Not_Found：2005/07/05(火) 00:29:58 ID:???

>>353
いやいや、XHTMLに注釈タグがなかったぞ。
それに、style要素の話はしてない。

356 ：Name_Not_Found：2005/07/05(火) 00:36:54 ID:???

>>355
XMLのコメントだろ。

357 ：Name_Not_Found：2005/07/05(火) 00:41:28 ID:???

>>354
全体をdivでくくって、そのdivに対して幅を指定すべし。

358 ：Name_Not_Found：2005/07/05(火) 00:43:16 ID:???

firefoxとIEで全然違うんだけど何とかならない？
行間とかfloatとかmargin、paddingなど。
空間表現が同じじゃないから困ってる。
IEだけの設定、Firefoxだけの設定とか出来ないかな。

359 ：Name_Not_Found：2005/07/05(火) 00:46:56 ID:???

>354
div#top {
width:750px;
}

あとはお好みでmargin付けてみたりborderしてみたり。
たぶん中央辺りにメイン情報が来ると思うけど、段組するならまたDIVで。

360 ：Name_Not_Found：2005/07/05(火) 00:48:10 ID:???

ん…まさかウィンドウの幅自体を変えたいのかな？
だとしたらJavaScriptしかないけど、まさかな…。

361 ：質問厨354：2005/07/05(火) 01:42:28 ID:???

解決しました。ありがとうございました。
>>360
違います。イメージとしてはYahoo!みたいな幅固定です。

362 ：Name_Not_Found：2005/07/05(火) 01:50:27 ID:???

>354

解決したらしいけど
標準モードならちゃんとIEでも有効
あえて互換モードにする意味がないのなら標準にすれば？

363 ：Name_Not_Found：2005/07/05(火) 06:21:59 ID:???

>>358
たしかにIEは極端だよな。一応代替手段としてはいくつかあるんだけど、そのうちの一つ。

　1．FF以下、素直なブラウザを基準にCSSを構築する
　2．IE用に修正CSSを用意する
　3．IEの場合は2で用意したCSSを読み込ませる



importを利用するやり方もあるけど、俺はこっちのほうが簡単なのでこうしてる

364 ：Name_Not_Found：2005/07/05(火) 09:07:31 ID:???

margin、paddingはpxで指定するってのはいけないの？

365 ：Name_Not_Found：2005/07/05(火) 09:11:50 ID:???

>>364
何故そう思う？

366 ：Name_Not_Found：2005/07/05(火) 09:19:34 ID:???

>365
>358の>行間とかfloatとかmargin、paddingなど。
で、pxで指定すれば、表示差はなくなるかなっと。

367 ：Name_Not_Found：2005/07/05(火) 09:36:39 ID:???

pxでもズレるから問題なんだよ。

368 ：Name_Not_Found：2005/07/05(火) 10:00:52 ID:???

>>358
そもそも現状では、異なるブラウザにおいて全く同じにしようという考えが間違っている。
>>363の方法やハックを使って解決するしかないが、全く同じには出来ない。

はっきりいって、ずれて困るデザインにしなければいいのよ。

369 ：Name_Not_Found：2005/07/05(火) 10:59:03 ID:???

Webサイト製作初心者用質問スレから飛んできました。

テーブルにリンクを張ったメニューを作り、各セルのどこでもクリック可能にするため、
各<TD>内のAに対しスタイルシートでdisplay:block;width:100%;height:100%を設定しました。
これでセル内どこでもクリック可能にはなったのですが、
リンクを張った文字列を縦方向のセンタリングがうまくできません。
ぐぐってみたところブロック要素にvertical-alignは設定できない旨の記述がありました。
そこで、フォントサイズ、セルの高さを固定してちょうどいいpaddingを設定することによってうまくいったと思ったのですが、
FireFoxで確認したところ余白がセルからはみ出した状態になってしまいます。
再度ぐぐってみたところ、どうやらIEは他のブラウザと違い、padding等を含めてwidthを計算するとのことらしいのですが、
両方のブラウザでdisplay:blockを設定し、見た目上縦方向にセンタリングし、a:hoverでセルの色を変化させるといったことは可能でしょうか？
記述したスタイルシートの該当部分をコピペしておきます。
よろしくお願いします。

td.menubar a {display: block;height: 100%;width: 100%;padding-top: 4px;}
td.menubar a:hover {display: block;height: 100%;width: 100%;padding-top: 4px;background-image: url(TDbackground2.gif);background-repeat: repeat-x;}

370 ：Name_Not_Found：2005/07/05(火) 11:19:36 ID:???

>>369
先ず、FireFoxで希望通りに表示するようにつくれ。
その後、IE用にアンダースコア・ハックを利用して設定するとGoood ｶﾓｼﾚﾅｲ

371 ：Name_Not_Found：2005/07/05(火) 11:32:46 ID:u1LVB4Ev

スタイルシートを使って右上と左下に背景を固定したいのですが
どうやったらよいでしょうか。

フレームを挟んでるので可能なのか解りませんが、
800*600でも1024*768でもレイアウトが崩れないようにしたいと考えています。

イメージはこんな感じです↓
http://douga.sakura.ne.jp/uploader2/src/up10979.jpg

二つの画像を固定するソースを見かけた事が無いのでお願いします。

372 ：Name_Not_Found：2005/07/05(火) 11:43:19 ID:???

>>371
何をもって「右」「下」を定義するのかアレだけど。
background-positionをうまく使ってください。

373 ：Name_Not_Found：2005/07/05(火) 11:51:41 ID:???

IEで、印刷したときにヘッダ・フッタを印刷させたくないのですが可能でしょうか？
できれば環境に依存しないほうがいいです。（「印刷の設定」を変更させない）

調べたところ↓のページでCSSの@media printを使えばできるみたいなことが書いてあるのですが、
http://cgi.din.or.jp/~hideyuki/cgi-bin/hpboard/perltreebbs.cgi?mode=tree&action=read&parent=2464
具体的になにをＣＳＳに書けばよいのかがわかりません。

どなたかご存知の方はいないでしょうか？

374 ：Name_Not_Found：2005/07/05(火) 11:56:06 ID:???

>>373
ヘッダ、フッタを印刷しないのだよね。
印刷したくない範囲に

{
display:none;
}
を指定する。

375 ：Name_Not_Found：2005/07/05(火) 11:57:42 ID:???

普通に書くのと同じことだよ。
ヘッダを印刷させたくなかったらdisplay:none;を使ったりさ。
ようするに、もう一種類別のCSSを用意して、レイアウトを変えようというだけの話。

376 ：Name_Not_Found：2005/07/05(火) 12:00:02 ID:???

>>373
たぶん>>374-375の書いていることで足りるんだろうけど、
もしIEとかが勝手に付ける一番上にでるタイトル要素の文字列とか日付とか、
一番下に出るurlとかのことを指しているのだったら、

どーにも無理。

377 ：Name_Not_Found：2005/07/05(火) 12:29:53 ID:???

>367
へ～margin、padding、px指定でもズレるんだ。
どんなケースでズレるの？

私ズレたことないんだよね。MacIE5.2,5.1、Safari、WinIE6,5.5,5.0、NN7、FF1、Opera7,8全てでmargin、paddingは変わらないんだけど。
文字サイズと行間は異なるけどね。

Default Styale Sheetが有効になっているだけじゃなくて？

378 ：Name_Not_Found：2005/07/05(火) 12:36:08 ID:u1LVB4Ev

background-position : right top;（右上）
background-position : left bottom;（左下）

で書くと、どちらか一枚（左下の画像のみ）
の表示になり、二枚同時表示になりません。

BODY{
background-image : url(m.jpg) ;
background-image : url(h.jpg) ;
background-color : #ffffff ;
background-repeat : no-repeat ;
background-attachment : fixed ;
background-position : right top ;
background-position : left bottom;

}

こんな感じだと駄目なのでしょうか。

379 ：Name_Not_Found：2005/07/05(火) 12:39:12 ID:???

<div class="bg1">
  <div class="bg2">
    ...
  </div>
</div>

bg1 { background: url(topr.jpg) top right no-repeat;}
bg2 { background: url(btml.jpg bottom left no-repeat transparent;}

380 ：Name_Not_Found：2005/07/05(火) 12:39:50 ID:???

コンマ忘れてた。補完よろ

381 ：Name_Not_Found：2005/07/05(火) 12:50:50 ID:???

>>377
widthとpadding同時に使ってみろ。

382 ：371、378：2005/07/05(火) 12:53:17 ID:u1LVB4Ev

何度もすみません。

<STYLE type="text/css">
<! --
BODY{

<div class="bg1">
<div class="bg2">
...
</div>
</div>

bg1 { background: url(topr.jpg) top right no-repeat;} ;
bg2 { background: url(btml.jpg bottom left no-repeat transparent;} ;

-->

・・・の所に何か書くのでしょうか。
このまま書き足すと上手くいきません。
宜しくお願いします

383 ：Name_Not_Found：2005/07/05(火) 12:56:00 ID:???

理解して参考にしろよ
わかってれば間違いがあるのがわかるだろ禿

384 ：Name_Not_Found：2005/07/05(火) 12:59:02 ID:???

おまいなぁ　基本的なもの勉強してからまた来いよ。な？
おじさんはあきれたよ。

385 ：371、378：2005/07/05(火) 13:03:34 ID:u1LVB4Ev

>>383　384
ごめんなさい、参考サイトを見てはコピペで凌いでまして
余り、というよりも殆ど理解しておりません。
教えて君状態で投稿してますので、気に障るようでしたら申し訳ありませんでした。

呆れつつも教えて下さる方がいらっしゃいましたら、お願いします

386 ：379：2005/07/05(火) 13:09:40 ID:???

2個目のurlの括弧も閉じてないな。眠い。

387 ：Name_Not_Found：2005/07/05(火) 14:03:48 ID:???

>>386は寝ろ

388 ：Name_Not_Found：2005/07/05(火) 14:05:57 ID:???

ボックスをセンタリングして文字を左揃えにするために
火狐やネスケでは
<div class="a">
　　<p>中身</p>
　　<p>中身</p>
</div>
.a {margin:auto;}
といった感じでシンプルにできますが
IEでは
<div class="b">
　　<div class="c">
　　　　<p>中身</p>
　　　　<p>中身</p>
　　</div>
</div>
.b {text-align:center;}
.c {text-align:left;}
といった感じに２重囲みをやらないと無理ですか？

389 ：Name_Not_Found：2005/07/05(火) 15:53:44 ID:???

どっちも無理。

390 ：Name_Not_Found：2005/07/05(火) 18:45:37 ID:???

>>389
わざわざひとつブロックを足さなきゃいかんくらいなら、
bodyをつかえばいいじゃない。

391 ：Name_Not_Found：2005/07/05(火) 20:45:08 ID:???

floatを使うと左か右端に行っちゃうからそこでDIVの活躍だな。

392 ：388：2005/07/05(火) 21:12:47 ID:???

>>390
なるほど！
ｻﾝｸｽｺ!

393 ：Name_Not_Found：2005/07/05(火) 22:51:02 ID:???

IEで最後の文字が1文字だけぴろっと予測不可能な位置に飛ぶのは何故なんでしょうか？
飛ぶときと飛ばない時があるのでどういう状況で起きるのかよくわからないのですが……

394 ：Name_Not_Found：2005/07/05(火) 23:03:29 ID:???

次郎さんに訊いたほうが医院ジャマイカ？

395 ：Name_Not_Found：2005/07/06(水) 00:52:50 ID:???

イジリー岡田の物まねで十分

396 ：Name_Not_Found：2005/07/06(水) 03:21:05 ID:???

誰？

397 ：Name_Not_Found：2005/07/06(水) 06:33:06 ID:???

フォントの一括指定「font」プロパティについて質問です。宜しくお願いします。
例えば、以下のような指定を作ったとして、

　　　font: small/1.4em "Arial", "Trebuchet MS", sans-serif;

ここに、さらに「font-style」や「font-weight」を指定したい場合、

　　　font: bold itaric small/1.4em "Arial", "Trebuchet MS", sans-serif;

とか書くことができるかと思うのですが、ここで例えば、

　　　font: normal normal small/1.4em "Arial", "Trebuchet MS", sans-serif;

という記述をした場合に、この2つの「normal」が、「font-style」「font-variant」「font-weight」のうち、
一体どれとどれを示すものなのか、UAはどう判別するのでしょう？
3つ「normal」と書いてあれば、「font-style」「font-variant」「font-weight」全てが「normal」で済むのかと思いますが、
2つ（あるいは1つ）だけしか記述がない場合に、何かしらの規則（仕様なりUA準拠なり）があるのかどうかを知りたいです。

398 ：Name_Not_Found：2005/07/06(水) 06:47:20 ID:???

>>393
君が使ってるtext-alignを教えて。
あと、そういうことは頻繁には起こらないはず。

399 ：Name_Not_Found：2005/07/06(水) 07:00:15 ID:???

>>397
?????????

400 ：Name_Not_Found：2005/07/06(水) 07:32:17 ID:???

>>397です。
すみません自己解決しました。仕様書を訳し間違えて誤解してたようです。
normalが2つ並べて書くこと自体、仕様を理解してないってことですね。
大変失礼しました。

401 ：Name_Not_Found：2005/07/06(水) 07:36:18 ID:KGX5b4pj

>>397
fontプロパティを用いると、まずあらゆるフォント関連のプロパティは初期値
にリセットされます。

「font-style」「font-variant」「font-weight」には normal が設定されます。

よって「normal normal」と書いた場合、UA はそれらを無視し、bold のような
固有値が出現したときのみ、該当するプロパティに上書きします。

402 ：Name_Not_Found：2005/07/06(水) 08:03:12 ID:???

>381
あ～IEの互換モードね。
そんないくらでも回避できるじゃん。

403 ：Name_Not_Found：2005/07/06(水) 08:04:44 ID:???

まっバグを回避したCSS作るでFA

404 ：Name_Not_Found：2005/07/06(水) 09:32:45 ID:???

>402
そうなん？
俺もwidthとpaddinngでずれてるんだけど。
ググったら出るかな

405 ：Name_Not_Found：2005/07/06(水) 11:24:02 ID:???

みんなはCSSの容量いくつ？
俺のは全ページ共有で8KBなんだけど、
関係ないページの分まで読み込むのって無駄かな。

406 ：Name_Not_Found：2005/07/06(水) 12:38:42 ID:???

>>405
全体で共有する用と、そのページ固有用のと、
必ず二つ読むようにしています。
<link rel="stylesheet" type="text/css" href="/css/hoge.css">
<link rel="stylesheet" type="text/css" href="css/hoge.css">

って書いて。

407 ：Name_Not_Found：2005/07/06(水) 13:27:44 ID:???

>>405
確実に他のページも見てくれるなら、
キャッシュするブラウザが多い現状では
意味があるから先読みのつもりで読ませるのも悪くはないだろうけど。
転送量過多でもないかぎり、悩むほどのことでもないのでは？

408 ：Name_Not_Found：2005/07/06(水) 15:57:02 ID:xOuVn965

<div><ul>
<li>a_1</li><li>a_2</li><li>a_3</li>
<li>b_1</li><li>b_2</li><li>b_3</li>
<li>c_1</li><li>c_2</li><li>c_3</li>
</ul></div>
この9つのリストを3段組にしたいのですがよい方法は無いでしょうか？（<div>等余分なタグを入れない方法で）
floatなど試したのですがちょっとわからなかったので質問させてもらいました。

409 ：Name_Not_Found：2005/07/06(水) 16:13:02 ID:???

>>408
リストの内容がわからないのでなんとも言えませんが、
テーブルではダメなのですか？

410 ：ジュンコ：2005/07/06(水) 17:08:25 ID:KQOhla80

月とうさぎの、ほんとにノーリスクなお仕事よ☆
イッテみてね！！わすれないでね☆
http://koukokutou-club.com/sbanner_fx/in.cgi?id=1119

411 ：Name_Not_Found：2005/07/06(水) 17:49:03 ID:xOuVn965

>>409
ただのリンク集的なものなのでテーブルでは適切でないと思いました。
あと自己解決しました。
liをblockにして幅をDIVの3等分してfloatさせることにより出来ました。
考えて下さった方ありがとうございました。

412 ：408：2005/07/06(水) 18:07:25 ID:???

あっ名前付け忘れました。
411=408です。

408は解決済みです。失礼しました。

413 ：Name_Not_Found：2005/07/06(水) 18:09:44 ID:???

>>405
それってページごとに<body id="hoge">ってやって
#hoge dt {color : nulupo;}　とかやってるってこと？
それはちょっと無駄かも。

俺はそういうのやめてからcssの転送量80％カットできた。
いくつかのcss用意してimportで読み込ませると楽だよ。

ただページデザインは統一したほうが閲覧し易いだろうから
あまり華美な装飾はオススメしない。
シンプルなcssのほうが読みやすいこともあるよ。

414 ：Name_Not_Found：2005/07/06(水) 18:17:09 ID:???

>406
そんなこと出来たんだ。
今までずっとCSS一つでやってきたよ。
タメになった。

>407
なるほど。
転送量はまだ半分余裕あるからいいかな。
テーブルレイアウトからCSSにしただけで20%も軽減したし。

415 ：Name_Not_Found：2005/07/06(水) 19:58:32 ID:???

CSSで、例えばボックス作る時に角を丸くしたいのですが。
あれって画像ですよね？画像だとしたら、どこで配布されてますか？
自分で作れないorz

416 ：Name_Not_Found：2005/07/06(水) 20:26:48 ID:???

>>415
ペイントでもつくれるよ。
楕円機能でがんばって真円を描いて
キャンパスのサイズを変えればスライスできるから。

417 ：Name_Not_Found：2005/07/06(水) 20:34:56 ID:???

簡単なのは、取り合えずテーブルでも何でもいいから
元となる四角いボックスを作ろう。
そしてそれをキャプチャーして、端っこを斜めにしてみる。
その後はちょっとイジって丸くすればいいだけ。

418 ：Name_Not_Found：2005/07/06(水) 20:36:17 ID:???

なるほど、その手がありましたか。
GIMPなんだけどね。楕円機能が分からないorz

419 ：Name_Not_Found：2005/07/06(水) 20:44:02 ID:???

>>416
頑張るも何もShift押せよ

420 ：Name_Not_Found：2005/07/06(水) 20:45:13 ID:???

分からないならやらなければいいよ

421 ：Name_Not_Found：2005/07/06(水) 21:00:22 ID:???

ありがと。やってみます。

422 ：Name_Not_Found：2005/07/06(水) 21:14:24 ID:???

取り合えず四角で作って、後は暇な時に丸くする。
ってかスレ違いだな

423 ：Name_Not_Found：2005/07/06(水) 21:34:31 ID:???

だが406のやりかただとIEで不具合が出る件について

424 ：Name_Not_Found：2005/07/06(水) 21:35:56 ID:???

>>423
そうなの？

425 ：Name_Not_Found：2005/07/06(水) 22:45:37 ID:???

CSSで画像なしの丸い枠作る方法ならあるけどな。文章の構造を複雑化する恐れがあるのでオススメしないが。

426 ：Name_Not_Found：2005/07/06(水) 23:10:56 ID:???

fieldsetか？　Winｸﾗｼｯｼだと角だぞ。

427 ：Name_Not_Found：2005/07/06(水) 23:20:17 ID:???

丸い枠どころか家を作ったりするからな。

428 ：Name_Not_Found：2005/07/07(木) 00:50:03 ID:kI5dYtg2

border関連のプロパティを使って行間を空けるには、どうすればいいんでしょうか？

.test {
border-top-style: none;
border-top-width: 10px;
}

で、

あああああああ
<div class="test">
</div>
いいいいいいい

とか色々やりましたが、うまくいきません。
ただ、上のnoneをsolidなどにすると、たちまち線が現れてその分行間が空きます。
何故なのかどうしても分かりません…。

ご存じの方いらっしゃいましたらよろしくお願いします。

429 ：Name_Not_Found：2005/07/07(木) 01:22:52 ID:???

とりあえずmargin。
ってかそれはhrじゃ駄目なのか？

430 ：Name_Not_Found：2005/07/07(木) 01:45:10 ID:???

どっかの糞サイトで洗脳されたんじゃ？

431 ：Name_Not_Found：2005/07/07(木) 01:53:47 ID:???

>>428
とんでもないなw
どこでそんなやり方学んだの？

432 ：Name_Not_Found：2005/07/07(木) 01:57:47 ID:???

>>428

.test {
margin: 10px 0px 10px 0px;
border-top-style: none;
border-top-width: 10px;
}

433 ：428：2005/07/07(木) 02:04:40 ID:kI5dYtg2

皆さんどうもありがとうございます。
marginでできました。

>>432

.test {
margin: 10px 0px 10px 0px;
border-top-style: none;
border-top-width: 10px;
}

でも

.test {
margin: 10px 0px 10px 0px;
}

でもできましたが、どちらがいいんでしょうか？

434 ：Name_Not_Found：2005/07/07(木) 02:14:18 ID:???

>>432
もっと根本的な事いってやらないと、罪なやつだな笑
>>428
HTML部分本当にそうゆうコーディングするつもり？

435 ：Name_Not_Found：2005/07/07(木) 02:17:04 ID:???

ｉモードにもスタイルシートは適用されているのですか？
よろしくお願いします

436 ：Name_Not_Found：2005/07/07(木) 02:17:46 ID:kI5dYtg2

>>434
marginでも間違ってますか？(´･ω･`)
一応行間を空けることはできましたが…どこがおかしいのか分かりません。

437 ：Name_Not_Found：2005/07/07(木) 02:24:27 ID:2duEOrJs

>>436
ｽﾀｲﾙの記述は別に深く言わない。間違っていないことは確かだから安心しな。
もちろん余白も空くでしょう。
でもHTMLコーディングの部分に問題がある。その空のDIV要素で余白を空けようという考えはだめ。

438 ：Name_Not_Found：2005/07/07(木) 02:29:50 ID:kI5dYtg2

>>437
ありがとうございます。中に何か入れないと駄目なんですね。
普通は何を入れればいいんでしょうか？
<br>を入れてみましたが、余分に行間が空いてしまうようです…。

439 ：438：2005/07/07(木) 02:30:48 ID:???

あ、すいません。

440 ：438：2005/07/07(木) 02:32:25 ID:???

すいません。上のは途中で投稿してしまいました。

もしかすると

あああああ
<div class="test">
いいいいい
</div>

にすればいいんでしょうか？

441 ：Name_Not_Found：2005/07/07(木) 02:34:51 ID:???

>>438
　何にも考えずにこうしな。
<p>あああああああ</p>
<p>いいいいいいい</o>

442 ：Name_Not_Found：2005/07/07(木) 02:35:20 ID:???

<p>いいいいいいい</p>

443 ：Name_Not_Found：2005/07/07(木) 02:36:31 ID:???

なんか七夕釣りに見えてきた。

444 ：Name_Not_Found：2005/07/07(木) 02:45:58 ID:2duEOrJs

文章をマークアップ。

441みたいにするの。
スタイルの前にHTMLを覚えたほうがいーよ。短冊に願いをこめて

445 ：Name_Not_Found：2005/07/07(木) 11:57:23 ID:???

pはなかなか便利だぞ。
フロントページ使っていた時はdivと同じようなブロック要素だとは思ってもいなかった。
あまりに複雑に構成するときはdiv使ってりするけど。

446 ：Name_Not_Found：2005/07/07(木) 12:43:14 ID:???

>divと同じようなブロック要素だとは思ってもいなかった。

　　違うって！！

447 ：Name_Not_Found：2005/07/07(木) 12:52:05 ID:???

<p>で段落を作った後に一行分空けたいのですが
フォントサイズを％にしている場合はそのマージンも
％にすべきなのでしょうか？

その場合、フォントサイズが８０％だとしたら
一行空けるには何％を設定すればよいですか？

初心者な質問ですみませんが、よろしくお願いします。

448 ：Name_Not_Found：2005/07/07(木) 12:53:38 ID:???

あ？

449 ：Name_Not_Found：2005/07/07(木) 12:59:12 ID:???

マージンもナニも指定しなくて良い。

って、やってみてから質問しろよ、ｺﾗ

450 ：447：2005/07/07(木) 13:06:40 ID:???

>>449
やってみたんですが一行分空かないんです。

<p>あいうえお</p>
<p>あいうえお</p>

を

あいうえお

あいうえお

と<br>を使わずに書きたいのですが。
もしかしてとんでもないアホなこと言ってますか？汗

451 ：Name_Not_Found：2005/07/07(木) 13:07:30 ID:???

もう夏厨の季節なのか？　そうなのか？

452 ：Name_Not_Found：2005/07/07(木) 13:09:13 ID:???

>>447
釣りじゃなかったらCSS出せ！

453 ：Name_Not_Found：2005/07/07(木) 13:12:22 ID:???

わけも解らずパクってきたやつをそのまま使ったって駄目だぞ >>447

454 ：447：2005/07/07(木) 13:26:46 ID:???

私も当然一行空くものだと思って書いてみたら
空かないのでわからなくなって質問しました。
CSSのｐにはフォントサイズしか指定してません。

455 ：Name_Not_Found：2005/07/07(木) 13:29:40 ID:???

>>447
font-size と margin とでは % 値の意味が違う。
font-size の場合は親要素のフォントサイズに対する割合 * 100、
margin の場合は親要素の横幅に対する割合 * 100 になる。

そういう場合 margin には em 単位を使ったらいい。
em 値はその要素のフォントサイズに対する割合になるので、
親要素のフォントサイズ分だけ空ける場合は
1 / (80/100) = 1.25em にする。

456 ：447：2005/07/07(木) 13:44:22 ID:???

>>455
こんなとんちんかんな質問にレスしてくださってありがとうございます。
とてもよくわかりました。

457 ：Name_Not_Found：2005/07/07(木) 14:06:05 ID:???

>446
何だって！？
まあボチボチ勉強していくよ。

458 ：Name_Not_Found：2005/07/07(木) 14:08:13 ID:???

>450
基礎中の基礎だぞ。

<p class="1">あいうえお</p>
<p>あいうえお</p>

p.1 {
margin-bottom:10px;
}

459 ：Name_Not_Found：2005/07/07(木) 14:53:17 ID:???

>458
class名（一般にセレクタ名）の先頭に数字が使えないのも
基礎中の基礎…でもないかでも知っておくべき事項

460 ：Name_Not_Found：2005/07/07(木) 15:01:03 ID:???

んにゃ

461 ：Name_Not_Found：2005/07/07(木) 15:14:19 ID:???

>>458
<p>あいうえお</p>
<p>あいうえお</p>

なにも指定しなけりゃ間違うことはない。　な？

462 ：Name_Not_Found：2005/07/07(木) 15:37:55 ID:???

>459
数字だけなんて使わないよ。
どうでもいいけど。

463 ：Name_Not_Found：2005/07/07(木) 15:50:26 ID:???

>>458
10px はどこから来たのか気になる(w

464 ：Name_Not_Found：2005/07/07(木) 15:53:30 ID:???

10が好きなんだろｗｗｗ
どうでもいいことだなｗｗｗ

465 ：Name_Not_Found：2005/07/07(木) 16:01:13 ID:K4LLCq4g

テーブルのセルにフォームのテキストフィールドを入れたところ、
そのセルにはそのテキストフィールドしか入っていないのにもかかわらず、
その下（セルの中）の1行近いスペースが開いてしまいます。
テスト用にCSS等の設定は全くせずにテーブルとテキストフィールドを作ってみたところどうしてもスペースが開いてしまいます。
コードは以下の通りです。

<table width="100%" border="1"><tr>
<td>aaaaa</td>
</tr><tr>
<td><form name="form1" method="post" action="">
<input name="textfield" type="text" size="20">
</form></td>
</tr></table>

また、テキストフィールドだけでなくボタンやイメージでも同様に余計なスペースが開いてしまいます。
回避する方法はあるのでしょうか？

466 ：Name_Not_Found：2005/07/07(木) 16:19:10 ID:???

すいませんが、docomoのCSSについて詳しく解説してある
サイトご存知ないですか？
docomoの解説見てもよくわかんねです。

467 ：Name_Not_Found：2005/07/07(木) 16:29:04 ID:???

docomoってなーに？

468 ：Name_Not_Found：2005/07/07(木) 16:32:29 ID:???

ここの住人はやさしいな。。↓見て嫌な気分になった

ttp://www.hatena.ne.jp/1120718634

469 ：４６６：2005/07/07(木) 16:33:03 ID:???

>467
え？マジで何かおかしいですか？
DoCoMo？
ドコモの端末のCSSについてでいいですか？

470 ：Name_Not_Found：2005/07/07(木) 16:35:58 ID:???

↓パス

471 ：Name_Not_Found：2005/07/07(木) 16:38:21 ID:???

>>465
<form name="form1" method="post" action="">を
<form name="form1" method="post" action="" style="margin:0;">に。
>>466
携帯向けではstyleは使わない。

472 ：Name_Not_Found：2005/07/07(木) 16:40:02 ID:???

auは結構対応してる

473 ：Name_Not_Found：2005/07/07(木) 16:40:46 ID:???

>462
「先頭が」数字だったら 1a だろうと 2ch だろうとダメなんだってば
まあどうでもいいけど

474 ：４６６：2005/07/07(木) 17:01:51 ID:???

>471
auの端末では使えるようですが、
ドコモの端末ではtextareaやinputに
styleは使えないということでしょうか？

475 ：Name_Not_Found：2005/07/07(木) 17:18:59 ID:???

ドコモに訊けよ。

476 ：Name_Not_Found：2005/07/07(木) 17:25:10 ID:???

>>465
マルチは回答無いよ。消えな。

477 ： ↑ ：2005/07/07(木) 17:43:15 ID:???

>>465
ごめんよ。

478 ：Name_Not_Found：2005/07/07(木) 17:45:35 ID:???

>>465
　ソース改行無しでやってみな。
<td><form name="form1" method="post" action=""><input name="textfield" type="text" size="20"></form></td>

479 ：Name_Not_Found：2005/07/07(木) 18:13:10 ID:???

>>474
携帯端末はWEB制作の中ではちょっと特殊。
通常インターネットに利用する端末はPCだから。
なので携帯用な特殊なスレッドに移動したほうがいいんじゃないかな。

正直俺（ら？）は携帯端末が機種によってどうなってるこうなってるなんて知りもしないし
興味もない。
ゆえに誘導先も知らない

480 ：Name_Not_Found：2005/07/07(木) 18:16:43 ID:???

>>478
ﾌﾟｷﾞｬｰ

481 ：Name_Not_Found：2005/07/07(木) 18:21:02 ID:???

DoCoMo公式にあるじゃん。分からないなら諦めろ

482 ：Name_Not_Found：2005/07/07(木) 18:30:43 ID:???

>>474
誘導しときます

携帯端末用のWeb制作6
http://pc8.2ch.net/test/read.cgi/hp/1116430358/

483 ：465：2005/07/07(木) 18:55:30 ID:???

>>471,478
レスありがとうございます。
解決しました。

484 ：４６６：2005/07/07(木) 18:59:08 ID:???

皆さんご丁寧にありがとうございました。
>482
そちらで聞いてきます。
仕様書嫁で終わりそうですがｗ

485 ：406：2005/07/07(木) 19:04:05 ID:???

>>423
えっ、そうなの？
なんか不安になってきた(´･ω･`)

教えてエロイひと。

486 ：Name_Not_Found：2005/07/07(木) 19:19:02 ID:???

すみません、教えてください。
http://www.s-freesia.jp/
↑このサイトのようにバックに画像リピートで並べ、中身をコンテナで作るサイトを
制作途中ですが、バック画像の陰がDreamweaverのプレビューでは表示されるのですが
ブラウザでは陰の画像だけ表示されません。CSSが原因なのかDreamweaverが原因なのか
判断つきませんが、CSSを使わずにイメージを貼り込むと表示されます。

因みにMac OS-X 10.3.9　Dreamweaver MX 2004です。



#shadow {
width: 840px;
padding: 0px;
margin: auto;
background: #FFFFFF url(./img/shadow.gif) repeat-y center;
text-align: center;
}



<div id="shadow">
<div id="mainBG">
<div class="tytle">
～略～

確か前スレにもこんな書き込みがあった記憶もあるのですが、倉庫行きで見る事が出来ません。

487 ：Name_Not_Found：2005/07/07(木) 19:25:54 ID:???

background: #FFFFFF url(./img/shadow.gif) repeat-y center;

　　　　　　　　　　　　　　　　　　　　　　　　　　　↑これかな？

488 ：Name_Not_Found：2005/07/07(木) 19:26:32 ID:???

あっずれた。

489 ：Name_Not_Found：2005/07/07(木) 20:00:23 ID:???

>>487さん
早速のResありがとうございます。試してみましたが、ダメでした。
mainBGをコンテナにして、その後ろにもdivで作っています。
</div>の位置かな？やってみます。

490 ：423：2005/07/07(木) 20:06:43 ID:???

>>485
そのまま書く分には問題ないよ。不具合が出るころには
スキルアップしてるだろうから、回避策を聞かなくても
解決方法は分かる。心配スンナ

491 ：Name_Not_Found：2005/07/07(木) 20:58:36 ID:???

>468
…。
まあ始めは俺もまったく分からなかったしな。
ちょっとずつ学んでやっていけばいいよな。
一気にやろうとするから失敗する。

492 ：Name_Not_Found：2005/07/07(木) 21:04:34 ID:???

Winに旧IEを入れる方法あるじゃん。
あれ使えないね。

入れたIE5.5でおｋだったページを、本当のIE5.5で見たらエラくズレた。

どうもレンダリングはインスコしてある最新のIEでされるみたい。

493 ：Name_Not_Found：2005/07/07(木) 21:49:53 ID:???

>>492
http://swfz.hp.infoseek.co.jp/R3_temp.swf?inputStr=%82%BB%82%EA%82%AA%82%C7%82%A4%82%B5%82%BD%81B

494 ：Name_Not_Found：2005/07/08(金) 00:01:45 ID:???

>>450
marginじゃなくてline-heightとかじゃだめなの？

495 ：Name_Not_Found：2005/07/08(金) 00:03:10 ID:goJOhB3a

ブログ等でよく見かける３カラムレイアウトをHTML4.01strictとCSSで作成する場合、
ヘッダとフッタのheightを固定にして、ボディ部分だけを可変サイズ（スクロールもボディ部のみ）
にする事って出来るんでしょうか？

CSSの仕様的にはOKでも、ブラウザ毎に解釈の仕方が異なるためどーしても
出来ません。
試した物としては

・ボディ部のDIV要素のtopとbottomを指定
-> IEではbottomが無効になる。
・ボディ部のDIV要素の中にヘッダとフッタのDIV要素を入れ子にして、フッタのポジションにbottom:0を指定
-> IE6.0の標準モードだとフッタの下に1pxの隙間が出来る事がある。

ほかにも色々試したのですが、大抵はIEでOKだと他ブラウザがNGだったり、
その逆だったりします。

出来ればIE、NN、Opera、Firefox、Mozilaのそれぞれ最新バージョンで
テーブルレイアウトを使わずに問題なく表示されるようにしたいです。

どなたか良い解決策をお持ちの方がいらっしゃいましたら教えて下さい。
色々な文献をあさってみましたが、もうネタ切れです・・・

496 ：Name_Not_Found：2005/07/08(金) 00:25:51 ID:???

>495
これうまく使えばできそうな希ガス
ttp://www.so-net.ne.jp/

497 ：Name_Not_Found：2005/07/08(金) 00:29:33 ID:???

>>495

div.head {
height:10px;
position:fixed;
top:0;
left:0;
right:0;

_position:static;/* IE用 */
}
div.foot{
height:20px;
position:fixed;
bottom:0;
left:0;
right:0;

_position:static;/* IE用 */
}
div.body{
padding-top:10px;
padding-bottom:20px;

_padding-top:0;/* IE用 */
_padding-bottom:0;/* IE用 */
_overflow:auto;/* IE用 */
_height:expression(body.clientHeight - 30 + "px");/* IE用 */
}
body{_overflow:hidden;}/* IE用 */

IE用はscript無効にしてると効かないけど。

498 ：Name_Not_Found：2005/07/08(金) 00:32:44 ID:???

ブラウザごとのCSSって公式なやり方は、javascriptでUA判定して<link>タグを振り分けるんだよな。

499 ：Name_Not_Found：2005/07/08(金) 00:39:12 ID:???

何をもって「公式」なのよ？
サーバサイドで振り分けたっていいし、
cssだけで完結したっていい

500 ：Name_Not_Found：2005/07/08(金) 01:28:37 ID:EZI7HHFO

質問です。
ある事で、拡張子？の意味を調べなきゃならなくて、
下記の用語の意味だけがどうしてもわかりません。
一応ググってみたのですが意味がわからず・・・
どなたか詳しい方、下記の用語解説を簡単でいいので教えていただけないでしょうか？
よろしくおねがいします。

・HRZ
・GIH
・GBR
・FITS
・Blinkenlights
・C-Source

501 ：Name_Not_Found：2005/07/08(金) 01:35:17 ID:???

>496-497
結局はDIVなんだな。
3カラムは俺もよくわからなくて、もうDIVでいいやって思ってやっちゃったけど。
やはりそれしかないのかな

502 ：Name_Not_Found：2005/07/08(金) 01:37:03 ID:???

> ・FITS
ポリプロピレンの衣装ケース

503 ：Name_Not_Found：2005/07/08(金) 01:37:05 ID:???

>500
学校の宿題か？
どっちにしろスレ違い。

504 ：Name_Not_Found：2005/07/08(金) 01:40:22 ID:???

すみません・・・スレ違いでしたね。
CG板に逝ってきまつ。

505 ：Name_Not_Found：2005/07/08(金) 11:18:04 ID:PA7qQXzB

ttp://centricle.com/ref/css/filters/tests/fabrice/

506 ：Name_Not_Found：2005/07/08(金) 13:23:49 ID:???

こったレイアツトや構造を考えるとdivを使うことになっちゃうけど、将来tableはイケナイ！みたいなノリで
divもダメって言われそうだね。

507 ：Name_Not_Found：2005/07/08(金) 13:40:57 ID:???

>>506
スタイルシートが要素のスタイルしか指定することができないので、
何らかの要素が必要になる。

テーブルレイアウトが非難されることがあるとすれば、理由は「表じゃないから」
だろうけど、divはこれといった意味のないコンテナブロックだから、
駄目！って言われることがあるとすれば別のアプローチだろうね。

あと、嫌div派の皆さんには今でも十分「div駄目！」って言われますよｗ

508 ：Name_Not_Found：2005/07/08(金) 16:26:27 ID:???

>>506
divも構造的に間違った使い方をしていなければ使いまくってもOKだよ。
"デザイン用のdiv"や"中身が１つしかはいっていないdiv"でなければな…

509 ：Name_Not_Found：2005/07/08(金) 18:25:55 ID:???

divって文章構造にはまったく関係ないよね？spanも。

510 ：495：2005/07/08(金) 23:42:11 ID:goJOhB3a

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

>>496
私の説明が下手だったのだと思いますが、これって通常の３カラムレイアウト
ですよね？
私が言いたかったのは「ヘッダとフッタを常に固定サイズで固定表示」だった
んです。もしかして、そのヒントもソースの中にあるんでしょうか？？

>>497
やはりスクリプトを使うしかないんでしょうかねぇ。
クライアントサイドのスクリプトは、補助的な物以外極力使いたく無いと
思っているのですが、難しいですね・・・。

Web制作をすればするほどIEが嫌いになるのは私だけでしょうか？w

511 ：Name_Not_Found：2005/07/09(土) 00:18:54 ID:???

>510
「fixed IE」→google
ttp://www.google.com/search?num=100&hl=ja&inlang=ja&q=fixed+IE&btnG=Google+%E6%A4%9C%E7%B4%A2&lr=lang_ja

例えば上から4番目
ttp://hp.vector.co.jp/authors/VA026021/IT/iePositionFixed.html
にあるリンク先
ttp://tagsoup.com/-dev/null-/css/fixed/

上中下ができるかどうかは知らないけどできそうな気がする
あとはそれをIEにだけ適用して残りは残りで

というか IEとそれ以外でできてるんだったら
ブラウザ振り分けるだけでできそうな感じだけれども

512 ：Name_Not_Found：2005/07/09(土) 00:45:37 ID:???

>>510
ここ参考にすれば出来るよ。

　http://www.stunicholls.myby.co.uk/layouts/3cols.html

513 ：Name_Not_Found：2005/07/09(土) 09:02:26 ID:???

>>512
そういうのは大嫌いなんですよ・・・。

514 ：Name_Not_Found：2005/07/09(土) 11:31:26 ID:???

あっそ

515 ：Name_Not_Found：2005/07/09(土) 12:38:17 ID:ape+MECv

スタイルシートを使って、画像の大きさをブラウザのウィンドウサイズに
合わせて伸縮させる方法ってないでしょうか？

516 ：Name_Not_Found：2005/07/09(土) 13:01:35 ID:???

>515
あるよ。

517 ：Name_Not_Found：2005/07/09(土) 13:06:38 ID:ape+MECv

>516
そーなのかー

518 ：495：2005/07/09(土) 15:08:52 ID:lpSJuIVa

>>511,512
情報ありがとうございます。
教えていただいたサイトを参考に、もーすこし粘ってみたいと思います。
ありがとうございました。

519 ：Name_Not_Found：2005/07/09(土) 18:29:40 ID:N4UkyTbN

http://hp17.0zero.jp/253/yuki0906/

520 ：Name_Not_Found：2005/07/09(土) 19:29:47 ID:???

>>519
たまたま見たら、キリ番getしちまったよ

521 ：Name_Not_Found：2005/07/09(土) 19:33:55 ID:???

キリ番とかそういうのにこだわるのがおかしい。
宣伝した本人だな。

522 ：Name_Not_Found：2005/07/09(土) 19:48:22 ID:???

ttp://www.kanzaki.com/docs/htminfo.html#simple-html
このサイトのように右側の空間を空けるにはどうしたらいいのでしょうか？
p {max-width:60em}
としてもだめだったのでどうやったら空間が空きますか？

523 ：Name_Not_Found：2005/07/09(土) 20:51:16 ID:???

↑margin

524 ：Name_Not_Found：2005/07/09(土) 21:41:14 ID:???

>>521
拘ってないが、たまたま覗いたらそんな表示があったんだよ
そんだけ

525 ：Name_Not_Found：2005/07/09(土) 21:46:26 ID:???

バレてないと思ってるのは、あなただけですから。
残念ながらバレバレなんです。

526 ：Name_Not_Found：2005/07/09(土) 21:57:44 ID:???

このスレに来るようなヤツが800ぐらいでキリ番とか言うか？
どこをどう見ても宣伝目的ですね。ハイ。

527 ：522：2005/07/09(土) 22:07:42 ID:???

>>523
marginをどのようにして使えばいいのですか？

528 ：522：2005/07/09(土) 22:14:25 ID:???

自己解決しました。
>>523さんありがとうございました。

529 ：Name_Not_Found：2005/07/09(土) 22:15:54 ID:3lebpyKO

・OS:win xp
・ブラウザ:IE6

リンク部分の上にカーソルがくるとアンダーラインが表示されるようにしたい。
一度visitedの状態になってしまうと、ずっとなりっぱなしなんですか？
カーソルが上にいってもhover状態にならない。

530 ：Name_Not_Found：2005/07/09(土) 22:47:56 ID:???

>>529
書く順番があるんだよん。

　疑似クラスの順番
a:link{
a:visited{
a:hover{ text-decoration:underline;

531 ：Name_Not_Found：2005/07/09(土) 23:22:13 ID:???

>>529
よくリンクの部分はアンダーラインを消すなって聞くけど、、、
どれがリンクだか分かるようなデザインを提供するんだよ。

532 ：Name_Not_Found：2005/07/10(日) 00:00:33 ID:???

アンダーラインを消してこそのデザインを昔やったことがあった。

533 ：Name_Not_Found：2005/07/10(日) 00:42:12 ID:nvYwu5BZ

文字とアンダーラインの間隔ってどうにもならないんでしょうか？

534 ：Name_Not_Found：2005/07/10(日) 00:52:42 ID:???

borderで代用とか

535 ：Name_Not_Found：2005/07/10(日) 01:06:22 ID:???

http://nyar.jpn.org/

微妙なサイトで例えてしまって申し訳ないのですが、
左のContentsなどの下にあるグレーのバーはどの
ようにして書いているのでしょうか？ソースを見ても
まったくわかりません。最上部のタイトル下の薄い
グレーの線も同様です。ご存じ方がおられましたら
御指南下さい。

536 ：Name_Not_Found：2005/07/10(日) 01:12:12 ID:???

>>535

WinnyArchives | nyNode.info　の下線

　　　　　　　と

(c) nyNode.info 2004　の上線

537 ：Name_Not_Found：2005/07/10(日) 01:29:23 ID:???

>>535
border-bottom:1px solid silver;

538 ：Name_Not_Found：2005/07/10(日) 07:59:25 ID:???

本気でsilverなんていう値が存在していると思っているのであれば、大変なことだ

539 ：Name_Not_Found：2005/07/10(日) 08:13:32 ID:???

(=ﾟωﾟ)つ【color name】

540 ：Name_Not_Found：2005/07/10(日) 08:17:37 ID:???

現段階では16種以外のcolor nameは認められていない。
pinkとかは駄目

541 ：Name_Not_Found：2005/07/10(日) 09:29:24 ID:???

分からない時はblackかwhiteにしとけばいいんだよ。

542 ：Name_Not_Found：2005/07/10(日) 10:12:12 ID:???

Fireworks1.04でセンタリングできません。
IEだとbodyにtext-align: center;でいけたのですが・・。

どうすればいいでしょうか？

543 ：Name_Not_Found：2005/07/10(日) 10:14:23 ID:???

間違えました。
Fireworks→Firefox

544 ：Name_Not_Found：2005/07/10(日) 10:21:21 ID:???

>>542
>>5

545 ：Name_Not_Found：2005/07/10(日) 10:35:22 ID:???

>>544
すみません、テンプレ見逃していました・・。ありがとうございました。

546 ：Name_Not_Found：2005/07/10(日) 11:22:51 ID:6QoVT1IW

基本的に、IE6.0やFirefoxやネストやOperaで
CSSでレイアウトを組んだ場合、それぞれ同じ見た目
にしたいのならwidthの指定は必須だと考えた方がいいのでしょうか？
しかも、%ではなくpxで。

さっきからずっとテストしているのですが、どしても%指定だと
ずれてしまいます。また、paddingに応じて引き算してwidthを
指定しないと、IEでは大丈夫でもFirefoxなどではずれます。

547 ：Name_Not_Found：2005/07/10(日) 12:08:51 ID:???

っ[ 標準準拠モード ]

548 ：Name_Not_Found：2005/07/10(日) 13:20:12 ID:???

>>525 >>526
だからよ、キリ番です～って表示がでてたんだよ
で、リロードしてみたらその表示が消えたから、俺キリ番だったんだなって思って書いただけさ

誰があんなクソみたいなサイト（以下自粛

549 ：Name_Not_Found：2005/07/10(日) 15:22:36 ID:???

>>548
宣伝乙

550 ：Name_Not_Found：2005/07/10(日) 15:39:39 ID:r9aYrGCg

スタイルシートを使って、画像の大きさをブラウザのウィンドウサイズに
合わせて伸縮させる方法ってないでしょうか？

551 ：Name_Not_Found：2005/07/10(日) 16:32:44 ID:???

>>550
>>516

552 ：Name_Not_Found：2005/07/10(日) 16:56:29 ID:???

>>546
いや、おかしいのはIEの方ですから。
Firefoxとかは世界標準規格に従ってるだけ。

553 ：Name_Not_Found：2005/07/10(日) 17:12:21 ID:???

>>551
>>517

554 ：Name_Not_Found：2005/07/10(日) 17:14:45 ID:???

そーなのかー。
俺もFireFoxに合わせて作りたいけど
実際は85%が未だにIEなんだよな…。
あんな糞ブラウザ使うな！って言いたいけど強要はできん。
結局IE基準で作っちゃう俺。

いやー、どっちかメインで作った方が楽なんですよ…。

555 ：Name_Not_Found：2005/07/10(日) 18:01:21 ID:???

>>554
ソース公開してないからねぇ、、IEは…

でも、今IE使用者が減ったみたい。晒してみるよ、アクセスレポートの結果を(w
http://www.geocities.jp/satonet13/

556 ：Name_Not_Found：2005/07/10(日) 18:26:30 ID:???

細かい表で整理してたら表を見るとすげぇ見難い。
例）
一行目はすべてバックの色を黒
二行目はすべてバックの色を赤
三行目はすべてバックの色を黒
四行目はすべてバックの色を赤
って感じに黒赤黒赤・・・と永遠に変える方法ない？
いちいちテーブルタグにclassとか手動で書き込むのは疲れる・・・

557 ：Name_Not_Found：2005/07/10(日) 18:58:14 ID:???

>>556
工夫ってものを知らないようだな。

558 ：Name_Not_Found：2005/07/10(日) 19:03:57 ID:???

>>556
全部一枚の画像にして貼り付けれ。

559 ：Name_Not_Found：2005/07/10(日) 19:50:12 ID:???

>>554
あまり凝ったつくりにしないで簡素に美しくまとめたあと
paddingやらfloatやらで微妙に誤解してくれるIE用に別ファイルを渡す。
そんなに難しい作業じゃないだろ？

560 ：Name_Not_Found：2005/07/10(日) 20:18:51 ID:???

>>558
それだと更新しにくくなるｼﾞｬﾏｲｶ

561 ：Name_Not_Found：2005/07/10(日) 20:34:58 ID:???

>555
それってどこのサイト？
この板からならFireFoxが多いし一般サイトならIEが多い。

562 ：Name_Not_Found：2005/07/10(日) 20:40:11 ID:???

>>561
どー考えても偏ってるって。
統計の意味ない。

563 ：Name_Not_Found：2005/07/10(日) 20:47:28 ID:???

>>561
自サイトです。アクセスレポートからの引用。
ただの統計です。アクセス元は、サーチエンジンやらリンクやら、２ちゃんねるやら。。

564 ：Name_Not_Found：2005/07/10(日) 21:07:03 ID:???

>556
JavaScriptを使えば可能

CSS3（だったかな）には :nth-child() といった擬似クラスがあるらしい
ttp://zng.info/w3-specs/css3-selectors.html.utf8#nth-child-pseudo

565 ：Name_Not_Found：2005/07/10(日) 21:35:12 ID:???

>>564
THX・・・読んだけどいまいちわからねぇ・・・

566 ：Name_Not_Found：2005/07/10(日) 22:15:31 ID:???

実際に統計を取るとしたら何万というデータがいるな。
そして普通な話題のサイトを作る、と。
普通な話題ってのは旬のこととか、万博とか。
2ch系のサイトってのは変わり者が多いからデータにならないな。

567 ：Name_Not_Found：2005/07/11(月) 00:02:00 ID:???

CSSの指定をJavascriptで入れ替えて、
別ページを作らずにスタイルを変える方法。
フレームを越えてそれを指定するにはどうしたらいいのでしょうか？
同フレーム（単一ページ）なら上手くいくのですが・・・。

568 ：Name_Not_Found：2005/07/11(月) 01:00:14 ID:???

それはJavaScriptスレで聞いたほうがいいと思われ

569 ：Name_Not_Found：2005/07/11(月) 01:27:39 ID:???

そうですね、そうします。

570 ：Name_Not_Found：2005/07/11(月) 01:40:22 ID:???

FirefoxでのCSSの使用方法が書いてあるサイトってないですかね？
自分もIEを基準にサイトを構築しているのですが、
どうも%指定でIEとFirefoxでは大きく受け取り方が違うので
Firefoxでは思った通りにならない事がしばしばです。

出来るだけ世界標準規格に従って作りたいので、参考サイトを教えて下さい
（ググったけど、ググりかたが悪くて見つかりません

571 ：Name_Not_Found：2005/07/11(月) 01:43:35 ID:???

>>570
話が矛盾してる。
>出来るだけ世界標準規格に従って作りたい
のならばIE基準をやめる。
>参考サイトを教えて下さい
テンプレ嫁。本を買え。

572 ：Name_Not_Found：2005/07/11(月) 02:58:02 ID:???

>>549
こんなに拘るってのは、前に宣伝して叩かれた奴に違いない

573 ：Name_Not_Found：2005/07/11(月) 06:13:23 ID:???

>>570
一般的なcssをきちんと解説しているサイトなら自然とFF基準になる。
バグスレッドやバグ辞典、あとは…もじら組でも見ておきなされ。

もじら組
ttp://www.mozilla.gr.jp/

574 ：Name_Not_Found：2005/07/11(月) 06:15:46 ID:???

>>570
いいよ。IEなんかに合わせなくても。

575 ：Name_Not_Found：2005/07/11(月) 06:30:52 ID:???

そうも言ってられんだろ。
素人サンにとっては「パソコン＝Win」「インターネットする＝IEを立ち上げる」なんだから。
ついでに「検索する＝Yahoo!検索」でもある。

576 ：Name_Not_Found：2005/07/11(月) 07:31:59 ID:???

俺はLinux使ってるからデフォルトでmozillaがあった。
Fire Fox は最近いれたばかり…。
よーするに、これからはマイクロソフトみたいな「ソース公開しないで、企業秘密
なOS」じゃ駄目だったり。

だからバグばっかりなんだよ。ったく。。。

577 ：Name_Not_Found：2005/07/11(月) 07:33:47 ID:???

>>576
それはそれで偏った意見だと思うが

578 ：Name_Not_Found：2005/07/11(月) 07:44:11 ID:???

素人でなくてもIEコンポのタブブラウザ使ってる人はいっぱい居るしなぁ

579 ：Name_Not_Found：2005/07/11(月) 07:51:54 ID:???

IEやバグだらけの欠陥品。っつーか早くなんとかしてくれよぅp

580 ：Name_Not_Found：2005/07/11(月) 07:52:21 ID:???

↑日本語おかしくなってる…

581 ：Name_Not_Found：2005/07/11(月) 08:37:13 ID:???

cellspacing="4" cellpadding="4" border="4"

これをCSSにしたくて色々やっているのですが出来ません。
.test{padding;4;border-spacing:4;border="4"}
何処か違っているのでしょうか？

582 ：Name_Not_Found：2005/07/11(月) 09:18:55 ID:???

でもさ、やっぱり思うのが世の中IE標準だよ。
「ちょっとインターネットでも見るか」的な
利用が圧倒的に多いだろ？パソコン使用者に。

同業者でたまにオペラやらFirefoxやらが入っている
PCを見る事はあるが、普通にネットする人はIE以外に
入れようと思わないよ。

と言いつつ、IEとNSとFirefoxとオペラで同じ表示に
させようとがんばっている俺がいる・・・・

583 ：Name_Not_Found：2005/07/11(月) 09:49:38 ID:???

IEの利用者が50%まで減るまで俺はIE基準を止めない!!
お前らがなんと言おうと俺は止まらんぞ!
フハハハハ

584 ：Name_Not_Found：2005/07/11(月) 09:54:02 ID:???

>俺は止まらんぞ
止めなくていいけど、大小便だけは垂れ流しにしないように。

585 ：Name_Not_Found：2005/07/11(月) 10:32:29 ID:???

ttp://www.andybudd.com/archives/2003/11/no_margin_for_error/
誰かこれを日本語訳したサイトしらない？

586 ：Name_Not_Found：2005/07/11(月) 10:38:20 ID:???

あるの？

587 ：Name_Not_Found：2005/07/11(月) 11:57:00 ID:???

bodyにmargin-right,light: auto;をして中央にセンタリングしています。
それで上下異なるサイズのボックスを左寄せしたいと思っています。

例えば下記のようなサイズのボックスがあったとして
[---760px---]
[---750px---]

このように表示させたいのですが、bodyをセンタリングしているので
[---760px---]
　[--750px--]

このように表示されます。bodyをセンタリングしても
左寄せにすることはできないのでしょうか？

588 ：Name_Not_Found：2005/07/11(月) 11:57:51 ID:???

>>581
まず>>3から。paddingはtd,thのだ。

589 ：Name_Not_Found：2005/07/11(月) 12:00:20 ID:???

>>587
text-align併用してる? なら削除

590 ：Name_Not_Found：2005/07/11(月) 12:02:03 ID:???

>>587
ネスト

591 ：587：2005/07/11(月) 12:40:39 ID:???

>>589
併用ってbodyにですよね？してます。
けど、それだとIEはセンタリングしないので
上下のボックスにもmargin-right,light: auto;をしています。

そしたらやはり中央揃えになるので、下だけ左に、とかできません。。

592 ：Name_Not_Found：2005/07/11(月) 12:56:25 ID:???

>584
意味わからんこと言ってないで止めてくれよ

593 ：Name_Not_Found：2005/07/11(月) 12:59:13 ID:???

>587
つまり基本は中央寄せでこんな風にしたいわけだな？

　　　　　　　[---760px---]
　　　　　　　[--750px--]

それだとDIVを挟めば楽になれる。
divは中央配置、760と750は左寄せ。しかし、こういう使い方もDIV厨って言われるんだろうな。否定はしない。
　　　　　　　<div>
　　　　　　　[---760px---]
　　　　　　　[--750px--]
　　　　　　　</div>

594 ：Name_Not_Found：2005/07/11(月) 13:09:00 ID:???

↑新しいdiv入れなくても、
中央寄せした760のコンテンツの中に
左寄せの750のコンテンツ入れればいいと思う。

595 ：Name_Not_Found：2005/07/11(月) 13:12:07 ID:???

>>594
それだとメンテが面倒ジャマイカ？

596 ：587：2005/07/11(月) 13:15:25 ID:???

>>593-595
ありがとうございます。
その760や750のボックスの左寄せですが、
text-align: left;で左寄せするんですよね？

しかし、それをやっても思い通りにはなりません。。
（新しいdivを追加するのも試したのですが

597 ：593：2005/07/11(月) 13:22:29 ID:???

>594
587がどんな構成にしてるか分からないけど
レイアウトだけのDIVならそれでいけるかな。
borderとかも使うのなら別々にした上がいいかも。

>596
詳しくは分からないから勘だけど、そのやりたいようにデザインするのは可能。
タグとかCSS面倒だから↓の見てあとは適当に外部にしたり編集してね。
タイトルとかなら途中のはH1にしたりメニューならLI使ったり。取り合えずDIVでやった。

<div style="text-align:center;">
<div style="text-align:left; width:760px;">[---760px---]</div>
<div style="text-align:left; width:750px;">[--750px--]</div>
</div>

598 ：593：2005/07/11(月) 13:25:23 ID:???

ああ、スマン間違えた。始めのDIVがleftで後のは要らないんだ。
bodyでcenterやってあるならいけると思う。

599 ：Name_Not_Found：2005/07/11(月) 13:26:25 ID:???

margin:0 auto; position:relative;
これを基本DIVにしておくといいかも。

600 ：Name_Not_Found：2005/07/11(月) 13:29:22 ID:???

俺のとこは出来てるんだけど、新しく色々考えてたらわけわからなくなってきた。
とにかく587頑張れｗ

601 ：587：2005/07/11(月) 13:32:53 ID:???

>>597
593さん、ありがとうございます。
Firefoxだと思った通りに表示出来ますが
IEだと表示出来ません。597さんのようにしているのですが。。

もう少し考えてみます。

602 ：594：2005/07/11(月) 13:37:45 ID:???

確かにメンテ悪かった。
>>587聞きたいのだが
>bodyにmargin-right,light: auto;をして中央にセンタリングしています。
このまま書いていないよね？

--- html ---
<div id="container">
<div id="a">760px</div>
<div id="b">750px</div>
</div>

--- css ---
#container{
width: 760px;
margin: 0 auto;
}
#a { width:760px; }

#b { width:750px; }
これが最低限の設定だと思うよ。

603 ：Name_Not_Found：2005/07/11(月) 13:46:13 ID:???

CSSの本にメールフォームのインターフェースは
テーブルで表すと書いてあったんですが、あれは
ふつうに”表”と解釈していいんでしょうか？

CSSに移行しはじめたばかりでテーブル過敏症に
陥ってしまい考え過ぎて何がなんだか
わからなくなってきました。

皆さんはどのように作成されているのでしょうか？
よろしければ教えてください。

604 ：587：2005/07/11(月) 13:47:10 ID:???

>>602
>>bodyにmargin-right,light: auto;をして中央にセンタリングしています。
>このまま書いていないよね？

上記はあくまで説明ようで、このように書いていません。

また、実際はブログのテンプレートを作っていまして
上と下のボックスのサイズは違うというのはそうなのですが
間にいろいろとあるので、それでおかしくなっているかもしれません。

605 ：Name_Not_Found：2005/07/11(月) 13:48:08 ID:N68LlKk1

>>601
あのな、今うまくゆかないってそのソースを出してくれ。話はそれからだ。

606 ：Name_Not_Found：2005/07/11(月) 13:49:17 ID:???

>>587
標準準拠モードには?
それともIE5+も視野?

607 ：Name_Not_Found：2005/07/11(月) 13:50:06 ID:???

>>604　情報の小出し、よくない。いいからソース書け。

608 ：Name_Not_Found：2005/07/11(月) 13:52:18 ID:???

>>603 Strict HTML スレッドででも訊いて下さい。

609 ：Name_Not_Found：2005/07/11(月) 13:56:44 ID:???

>>597の間違いだよ。
borderがないなら602で問題ないと思うぞ。
ソース出してみなよ。

610 ：587：2005/07/11(月) 14:04:32 ID:???

すみません、アップしました。
http://up.isp.2ch.net/up/1da471f8e7f7.zip

とりあえず、文章とかは削除して、ボックスのみにしています

611 ：Name_Not_Found：2005/07/11(月) 14:07:38 ID:???

解凍（回答）するの面倒臭い。

612 ：603：2005/07/11(月) 14:45:57 ID:???

すみませんでした。
strictの方で質問してきます。

613 ：587：2005/07/11(月) 14:48:37 ID:???

自己解決しました。
>>602さんのソースを参考に
全体を覆う<div id="container"> にwidthの指定が
無かったので、センタリングされませんでした。

色々とお騒がせしました。教えて頂いた方、ありがとうございます。

614 ：Name_Not_Found：2005/07/11(月) 16:17:43 ID:???

>>597
うんこ

615 ：Name_Not_Found：2005/07/11(月) 17:10:16 ID:???

これがゆとり教育か。

616 ：574：2005/07/11(月) 18:12:38 ID:???

マイクロソフトなんて糞。なんであんな糞OS使ってるのさ。
バグがあるんだから使えないだろ。ソース公開汁！！１

617 ：Name_Not_Found：2005/07/11(月) 18:21:41 ID:???

駄目実装ブラウザなのに9割以上の占有率だったり、
巨額の国債のせいで金利が上げられなかったり、
郵貯が役人のお小遣いになったり。
クソなコトは山ほどあるけど、文句ばかり言ってないで
なんとか楽しむ方法を模索するのがクリエイティブってもんだ。

618 ：Name_Not_Found：2005/07/11(月) 18:38:06 ID:???

昔はDIVでレイアウトしてた。
今は<UL><LI>ばかり使ってる。
反省はしていない。

619 ：Name_Not_Found：2005/07/11(月) 20:33:06 ID:???

誰かかっこよくてみやすくてそれでいて地味じゃないスタイルを教えてください

620 ：Name_Not_Found：2005/07/11(月) 20:37:16 ID:???

>>619
谷原章介

621 ：Name_Not_Found：2005/07/11(月) 21:33:26 ID:???

妙に納得したよ

622 ：Name_Not_Found：2005/07/11(月) 21:52:47 ID:???

123とあるのを213と並べる方法ってある？floatとかをうまく使うのかな。
レイアウトでは今のままで構わないけど、メニューより情報自体を一番上にしたいなと思って。
ロボット対策用にね。

|￣￣|　|￣￣|　|￣￣|
|　2. |　|　1.　|　|　3.　|
|＿＿|　|＿＿|　|＿＿|

<ul>
<li>1.メニュー</li>
</ul>

<h1>2.見出し</h1>
<p>2.とか色んなタグ</p>

<p>3.サブ情報みたいなショートカットとかナビ</p>

2をfloat:leftで3をfloat:rightで1をfloat:right?

623 ：574：2005/07/11(月) 22:12:05 ID:???

>>622

<ul>
<li>1.メニュー</li>
</ul>

だったら、
<ol>
<li>メニュー1</li>
</ol>
の方が良くない？

624 ：Name_Not_Found：2005/07/11(月) 22:20:42 ID:???

そのメニューに順番が無いならulでいいんじゃないかな。

625 ：Name_Not_Found：2005/07/12(火) 00:07:43 ID:???

そうじゃなくて >622の図の「1」のところに<ul> ってだけの意味でしょ

626 ：Name_Not_Found：2005/07/12(火) 00:17:30 ID:???

>>622

#block1 {
margin-left: xx%; /* IEだとアレかも */
width: xx%;
float: left;
}
#block2 {
position: absolute;
top: 0;
left: 0;
}
#block3 {
width: xx%;
float: left; /* or right */
}

とりあえず思いつきで。
1/2 を float で配置して、3を position:absolute するのもアリかもしれない。

627 ：Name_Not_Found：2005/07/12(火) 00:58:32 ID:???

>622
ソースと図を見る限りだと
ソース上はメニューが先頭ででも表示は真ん中で
これって「メニューより情報自体が一番上」になってないけど？

ともかく以下適当に読み替えてください
WinのIE6（標準） Fx1.0.4 Op8.01確認済み

body { position: relative; padding: 0; margin: 0; }
#main { position: absolute; left: 20%; top: 0; width: 65%; height: 300px; background: red; }
#menu { position: absolute; left: 0; top: 0; width: 20%; height: 250px; background: green; }
#navi { position: absolute; left: 85%; top: 0; width: 15%; height: 350px; background: blue; }

<body>

<div id="main"><p>main contents</p></div>
<div id="menu"><p>menu contents</p></div>
<div id="navi"><p>navigation</p></div>

</body>

628 ：Name_Not_Found：2005/07/12(火) 01:37:36 ID:???

信者の場合、olを使うときは
list-styleをnoneにした上で、
各項目に数字を手で入れるらしいよ

629 ：Name_Not_Found：2005/07/12(火) 06:40:06 ID:???

そりゃデマだ

630 ：574：2005/07/12(火) 07:24:27 ID:???

>628
俺は、<ol>の場合消さないな。<ul>なら list-style: none;
で消した後、backgroundでドット画像でも入れる事もある。

631 ：Name_Not_Found：2005/07/12(火) 08:29:10 ID:???

>626-627
どもども。
タグとか適当にやった上、順番まで間違えちゃって…。
でも理解してくれてありがとう。

632 ：Name_Not_Found：2005/07/12(火) 08:49:16 ID:???

高さを100%指定したい場合、IEとFirefoxでは
表示が大きく異なってしまいます。

■HTMLでは
<div id="container">
<div id="area">
<div class="side"></div>
<div class="center"></div>
</div>
</div>

633 ：Name_Not_Found：2005/07/12(火) 08:50:37 ID:???

CSSでは下記のようにしています。
#container {
width: 760px;
height: 100%;
margin:10px;
background-color: #cccccc;
}
#area{
padding:10px;
}
.side{
width: 140px;
float: right;
height: 100%;
background-color: #999999;
}
.center{
width: 600px;
height: 100%;
float: left;
background-color: #e0e0e0;
}

Firefoxの場合はmarginをとっても、下にはみ出してしまいます。
どうすればいいでしょうか？

634 ：Name_Not_Found：2005/07/12(火) 10:27:06 ID:???

　厨よ～～

635 ：Name_Not_Found：2005/07/12(火) 11:42:26 ID:pPrU+6UT

ttp://www.cool-website.net/template/sample11/index.html
このような配置で画像を使ってリンクさせたいのですが、
CSSでもできるのでしょうか？
その場合positionで指定すればいいのでしょうか？
見当違いだったら申し訳ございません。

636 ：Name_Not_Found：2005/07/12(火) 11:44:05 ID:???

>>632　なぜＦＡＱを見ない？　>>8だ。

637 ：Name_Not_Found：2005/07/12(火) 11:47:42 ID:???

>>635
positionでもfloatでも好きにしなさい。
君には難しかったら、いっそ<map>にすればぁ？

638 ：Name_Not_Found：2005/07/12(火) 11:56:26 ID:pPrU+6UT

mapというのがわかりませんが
画像にID振ってpositionでやってみます。
ありがとうございました。

639 ：Name_Not_Found：2005/07/12(火) 12:01:19 ID:pPrU+6UT

map、今調べて初めて知りました。お恥ずかしい。
これでやります！637さんありがとう！

640 ：Name_Not_Found：2005/07/12(火) 15:09:31 ID:???

＞629
ホントだってば

641 ：Name_Not_Found：2005/07/12(火) 15:30:46 ID:???

>>628-629,640
olのマーカーにつく番号は「並び順」です。
なので、並び順以外の意味のある番号であれば<li>の中身として書くべき、
と考えることが出来ます。

642 ：Name_Not_Found：2005/07/12(火) 21:20:35 ID:???

ねえ、馬鹿でしょう？

643 ：574：2005/07/12(火) 21:37:35 ID:???

>並び順以外の意味のある番号
???????謎

644 ：574：2005/07/12(火) 21:45:57 ID:???

<ul>
<li>数学</li>
<li>英語</li>
<li>国語</li>
</ul>
<p>私は全て得意です</p>

<ol>
<li>数学</li>
<li>英語</li>
<li>国語</li>
</ol>
<p>私はこの順番で得意です</p>

645 ：641：2005/07/12(火) 21:52:47 ID:???

そもそもol要素を使ったときに「番号」がつくのはUA依存で、
並び順さえ示せればabc…だろうがイロハ…だろうがかまわない、
っつーのはわかるでしょ。で、
<ol>
<li>/* CSS・スタイルシート質問スレッド【44th】 */</li>
<li>Webサイト制作初心者用質問スレ Part 137</li>
　：
</ol>
<p>上記の１はCSSの質問などをするスレッドです。２は全般的な質問スレです。</p>

ってしてしまうと、必ずしも「１」「２」という参照がその通りになるわけではない。
そういう意味での、並び順ではない続く内容と相関するような記号的な意味での番号は
UAがLI要素のマーカとして付ける番号とは別物。

という考え方があるってコトです。

646 ：Name_Not_Found：2005/07/12(火) 21:56:30 ID:5x9NhFkR

なるほど・・

647 ：Name_Not_Found：2005/07/12(火) 21:57:42 ID:???

すまん、バカの俺にも分かるように説明してくれ。

その順番でリストアップしたのなら
＞１はCSSの質問　＞２は全般的な質問
という参照はその通りになるのではないのか？もしやdecimalのことを言っているのか？

それは違うだろう。一つ目がCSSの質問、二つめが全般的な質問という
意味はdecimalだろうがupper-alphaだろうが同じじゃないか。

648 ：641：2005/07/12(火) 21:59:15 ID:???

あと文書の章番号とかでも、序章、第１章、第２章…とかね。

649 ：574：2005/07/12(火) 21:59:46 ID:???

650 ：641：2005/07/12(火) 22:01:20 ID:???

書き込み失敗。

>>647
A. /* CSS・スタイルシート質問スレッド【44th】 */
B. Webサイト制作初心者用質問スレ Part 137

上記の１はCSSの質問などをするスレッドです。２は全般的な質問スレです。

ではおかしいでしょ？番目ってつけばいいんだけど。
あと、文書の章番号とかでも、序章、第１章、第２章…とかね。

651 ：574：2005/07/12(火) 22:02:26 ID:???

>>648
俺は<hn>で括ってるけど、それは…

<h1>第１章</h1>
<h2>モナーが(ry</h2>
<p>…………………</p>

<h1>第２章</h1>
<h2>……</h2>
<p>………………………………</p>

変か？

652 ：Name_Not_Found：2005/07/12(火) 22:15:32 ID:???

場合による

653 ：641：2005/07/12(火) 22:16:58 ID:???

>>651
えーと、リストの話だよね？文書の見出しのリスト＝目次になることが多いと思うけど、
序章　まえがき
　こんにちわ、わたしは…
第１章　インターネットについて
　インターネットとはうんぬんかんぬん…
第２章　WWWについて
　WWWとはティムたんがうんぬんかんぬん…
　：
っていう文書の場合、この見出しだけ抜き出してリストにするとき
<li>まえがき</li>
<li>インターネットについて</li>
<li>WWWについて</li>
ってすると、olの番号（順番）と章番号は一個ずつずれちゃうでしょ。だから
<li>序章　まえがき</li>
<li>第１章　インターネットについて</li>
<li>第２章　WWWについて</li>
ってすべき、つまり>>628が聞きかじってきた話、なわけです。

他にも本の巻数とかで3巻だけ諸般の事情で出版されなかったとか、
社員には通しのID番号を振ってきたけど辞めちゃったヤツがいる、とかね。
前にも書いたけどこの「（並び順）番号」ってUA依存だし、スタイルシートである程度
コントロールできたとしても、htmlとは関係もないものだし、ってことデス。

654 ：641：2005/07/12(火) 22:18:38 ID:???

章番号対見出しの表、ってのも当然ありだとおもいます念のため。

655 ：Name_Not_Found：2005/07/12(火) 22:24:59 ID:???

質問者に迷惑です。

議論はよそで。

656 ：Name_Not_Found：2005/07/12(火) 22:36:16 ID:???

質問：>>647
回答：>>650-
冗談ですごめんなさい。

次の質問どぞー

657 ：574：2005/07/12(火) 23:24:09 ID:???

>>653
なるほどね～。意味が分かったよ。
そういう所はCSSじゃ対応出来ていないから、そうなるといいね。
まぁ、第１章なんて見出し使った事無いがね。

658 ：Name_Not_Found：2005/07/13(水) 00:09:29 ID:???

馬鹿はいつまで経っても馬鹿だって本当だな。

659 ：574：2005/07/13(水) 00:27:42 ID:???

っつーか、良く考えたらCSSじゃ「第１章」なんて出来るわけねーだろうが！！
HTMLでも無理だろ！

660 ：Name_Not_Found：2005/07/13(水) 00:50:56 ID:???

馬鹿はいつまで経っても……
ハイ次の方、質問どうぞ。

661 ：Name_Not_Found：2005/07/13(水) 10:05:34 ID:???

574の言いたいことがよくわかんない

662 ：Name_Not_Found：2005/07/13(水) 10:41:59 ID:???

>>659

counter-increment

http://www.w3.org/TR/REC-CSS2/generate.html#counters
http://www.w3.org/TR/CSS21/generate.html#counters

663 ：Name_Not_Found：2005/07/13(水) 10:44:07 ID:???

>>636
Macで見てるんだけど、>>8の方法でも下にはみ出るよ。

664 ：Name_Not_Found：2005/07/13(水) 10:48:18 ID:???

>>574ずれてる。ずれてるよー。
>>657でのレスもいまいちかみ合ってないし。読解力がないのだろうなあ。

665 ：Name_Not_Found：2005/07/13(水) 11:57:13 ID:???

>>663
何がどうはみ出るんだか。言葉足らず。
それにMacIEなら初めからMacIEと言ってくれ。WinIEとは別物。

666 ：Name_Not_Found：2005/07/13(水) 12:04:26 ID:???

>>665
100％指定なのにスクロールバーが表示されること
MacIEに限らず、Safari、Netscape、Operaでも同じ。
>>8のサイトは色んなブラウザでちゃんと確認したのでしょうか？

667 ：Name_Not_Found：2005/07/13(水) 12:10:47 ID:???

>>666
あのな、>>632-633を見たら、floatさせとるやんか。
あほか。浮動要素の高さは親要素に包含されないっての。
これもＦＡＱだ。>>6見とけ。それ位、自分が確認せなあかんで。

668 ：Name_Not_Found：2005/07/13(水) 12:13:20 ID:???

>>666　そもそも>>8を見て、どう指定し直したのか。ソースを出して言ってくれや。

669 ：Name_Not_Found：2005/07/13(水) 12:16:02 ID:???

>>667
とりあえず、floatのことは別問題なんだよ。

まず、おまえはMacで>>8に載ってるCSSの例を確認することをおすすめする。

670 ：Name_Not_Found：2005/07/13(水) 12:17:35 ID:???

>>668
指定し直したわけじゃなくて、そのまま確認したら何も解決してなかっただけ。

671 ：Name_Not_Found：2005/07/13(水) 12:19:26 ID:???

あらあら、Macの人は、自分がマイナーだって自覚が無いのかね……？
この分だと基本もわかってないから、標準準拠モードとかも知らないのでは。

672 ：Name_Not_Found：2005/07/13(水) 12:20:35 ID:???

元の指定が間違ってるのに、直さなければ解決するわけがないが。>>670

673 ：Name_Not_Found：2005/07/13(水) 12:24:47 ID:???

>>671
じゃあ、Macに非対応のCSSでも作ってろよw

ちなみにオレは>>632-633ではありません。

674 ：Name_Not_Found：2005/07/13(水) 12:24:59 ID:???

<hr>を１pxの横線にしたいのですがどう記述したらよいのでしょうか？

675 ：Name_Not_Found：2005/07/13(水) 12:30:28 ID:???

>>674
hr要素へのスタイル指定
http://cssbug.at.infoseek.co.jp/misc/hr.html

676 ：Name_Not_Found：2005/07/13(水) 12:32:27 ID:???

>>673　
で、お前はheightの意味もまだわかってないのか？
borderやpaddingはheightやwidthに含まないんだぞ、お馬鹿さん。

677 ：Name_Not_Found：2005/07/13(水) 12:36:47 ID:???

>>673
基礎中の基礎。ＦＡＱの一番目なんだが。あんた正味、あほやね。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height

678 ：Name_Not_Found：2005/07/13(水) 12:40:46 ID:???

>>676
そんな常識なこと言われても困るんだが。
問題はborderやpadding指定が無くても高さが100%にならないこと。
Win環境では正式に表示されるようだから、お前さんは気にしなくてもいいよ。

679 ：Name_Not_Found：2005/07/13(水) 12:42:44 ID:???

>>678　どこ見てるんだ？　ちゃんとなるよ。確認してほしかったらソース出せ。

680 ：Name_Not_Found：2005/07/13(水) 12:47:43 ID:???

>>679
>>8でbodyにheight: 100%;指定してたソースだけど、これじゃないのかな？

http://www.mozilla.gr.jp/standards/webtips/examples/webtips0032-S2.html

681 ：Name_Not_Found：2005/07/13(水) 12:50:53 ID:???

>>680
だから、それに縦スクロールが出るのは、
見てわかりやすくするためborderを指定してあるからだろ。
あとはbody要素にデフォルトでmarginなりpaddingもあるから、それを0にすればいいだけ。

682 ：Name_Not_Found：2005/07/13(水) 12:54:37 ID:???

>>678は、自分の無知を棚に上げて他人を責めてはいかんな。

683 ：Name_Not_Found：2005/07/13(水) 13:02:31 ID:???

>>682
無知でもいいんだけど、スクロールバーがでるんだから仕方ない。
>>680の表示でスクロールバーがでるので正解ならば別に言うことはないんだけど。

684 ：Name_Not_Found：2005/07/13(水) 13:10:15 ID:???

>>683
だからさ、一体どこ見て言ってるんだよ。無知の上に説明能力も無いのか？
これで確認してみろ。スクロールが出るのかよ、ああン？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<style type="text/css"></style>
</head>
<body>
<div>高さ100％</div>
</body>
</html>

685 ：Name_Not_Found：2005/07/13(水) 13:14:02 ID:???

>>683　「別に言うことはない」なら黙っておけ。当事者の>>632でもないのに口出しするな。

686 ：Name_Not_Found：2005/07/13(水) 13:14:14 ID:???

　若いっていいなぁ・・・

687 ：Name_Not_Found：2005/07/13(水) 13:17:53 ID:???

>>684
なったなった！
ていうか、背景色を100％にするくらいはできるんだけどね。

>>685
スルーすれば？

688 ：Name_Not_Found：2005/07/13(水) 13:18:59 ID:???

>>678
>問題はborderやpadding指定が無くても高さが100%にならないこと。
680の例ならば、歴然とborder指定があるが。本当にこいつ、どこ見てたんだか。

689 ：Name_Not_Found：2005/07/13(水) 13:21:09 ID:???

>>687
で、結局お前は何を見てスクロールが出るとか言ってたんだ？
「背景色を100％にするくらいは」って、では一体なにをやりたいのか。
人に物を訊ねるなら、きちんと言葉で状況を説明しろや、ボクちゃん。

690 ：Name_Not_Found：2005/07/13(水) 13:22:59 ID:???

>>688
そこはミスった。忘れて下さい。

691 ：Name_Not_Found：2005/07/13(水) 13:24:27 ID:???

結局>>676が言った通り、heightにborderは含まれないってのも知らなかったんだな。>>690

692 ：Name_Not_Found：2005/07/13(水) 13:26:03 ID:???

>>689
何をしたいかじゃなくて、border指定をするとスクロールバーが出るの事が正解なのか、間違いなのか。
ということ。

693 ：Name_Not_Found：2005/07/13(水) 13:26:56 ID:???

>>692

676 ：Name_Not_Found：2005/07/13(水) 12:32:27 ID:???
>>673　
で、お前はheightの意味もまだわかってないのか？
borderやpaddingはheightやwidthに含まないんだぞ、お馬鹿さん。

677 ：Name_Not_Found：2005/07/13(水) 12:36:47 ID:???
>>673
基礎中の基礎。ＦＡＱの一番目なんだが。あんた正味、あほやね。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height

678 ：Name_Not_Found：2005/07/13(水) 12:40:46 ID:???
>>676
そんな常識なこと言われても困るんだが。
問題はborderやpadding指定が無くても高さが100%にならないこと。
Win環境では正式に表示されるようだから、お前さんは気にしなくてもいいよ。

694 ：Name_Not_Found：2005/07/13(水) 13:30:07 ID:???

>>678＝>>692＝阿呆。
box-sizing:border-box;でも使ってろ。

695 ：Name_Not_Found：2005/07/13(水) 13:59:41 ID:???

>>694
safariで対応してないことも覚えておくといい

696 ：Name_Not_Found：2005/07/13(水) 14:10:24 ID:???

ハア？　偉ぶって何を言ってるんだか。>>695
もともと独自拡張での先行実装に過ぎないだろ。対応もクソもあるかよ。

697 ：Name_Not_Found：2005/07/13(水) 14:16:07 ID:???

プライド高いですね

698 ：Name_Not_Found：2005/07/13(水) 14:20:46 ID:???

Macの人って、こんな663みたいな馬鹿ばっか？

699 ：Name_Not_Found：2005/07/13(水) 14:23:09 ID:???

別にMacしか使ってないわけじゃないから。

700 ：Name_Not_Found：2005/07/13(水) 14:28:29 ID:???

↑あ、また馬鹿が来た。

701 ：Name_Not_Found：2005/07/13(水) 14:38:03 ID:???

おおい馬鹿、borderを指定するとheightの外に加算されるってわかったのかぁ？

702 ：Name_Not_Found：2005/07/13(水) 14:47:25 ID:???

>>701
それは元々わかるけど、border指定してもheightの内側に加算させる方法もわかりました。
まぁ、ブラウザによってできないのもありますけど。
つまり、高さ100%のborderがあるボックスを表示させるのは、今のところやめた方がいいと思います。

703 ：Name_Not_Found：2005/07/13(水) 15:11:20 ID:???

>>675
ありがとうございます。hrつかうのやめます

704 ：Name_Not_Found：2005/07/13(水) 15:59:23 ID:???

>701
なんだって！？
300pxのボックス作るとするとこんな感じ？

div.test {
width:298px;
border:1px solid black;
}

705 ：Name_Not_Found：2005/07/13(水) 16:13:57 ID:???

div.test {
width: 300px;
}
div.test .frame {
border: 1px solid black;
}

<div class="test">
<div class="frame">
<p>('A｀)</p>
</div>
</div>

706 ：Name_Not_Found：2005/07/13(水) 21:28:50 ID:???

>>695
safariのソースにもついにとりこまれてしまいました。
次バージョンあたりで使えるようになってるでしょう。
もはやデファクトスタンダードのようです。winIE除く。

707 ：Name_Not_Found：2005/07/13(水) 22:25:23 ID:Na/UIMOg

WinIEを除くデファクトスタンダードなどあり得ない。

708 ：Name_Not_Found：2005/07/13(水) 22:37:16 ID:???

WinIEに合わせるためだけに後付けでこじつけて考えられたプロパティなのだから、
その元凶たるWinIEが実装する必要は無いわけで。
（実際しないでしょう。WinIEがbox-sizingを実装する事に何の意味も必要性も皆無なのだから。）
で、みんなでWinIEに合わせてborder-boxがデファクトスタンダード。

709 ：Name_Not_Found：2005/07/13(水) 22:42:50 ID:???

　おい。厨ども　質問はいつすればいいのかね？

710 ：厨：2005/07/13(水) 23:12:13 ID:???

じゃ、質問するよ。
positionで位置指定の時 px か %どっち使う？
絶対値か相対値(？)

711 ：Name_Not_Found：2005/07/14(木) 00:58:36 ID:???

>>687
null臭がする

712 ：Name_Not_Found：2005/07/14(木) 02:30:13 ID:???

>>702
「それは元々わかるけど」だと、馬鹿もいい加減にしろ。
理解してたのなら、ナゼ>>680のリンク先をスクロールが出るなどと騒いだんだよ。
子曰く、過ちて改めざる、是れを過ちと謂ふ。

713 ：Name_Not_Found：2005/07/14(木) 03:21:59 ID:???

null ってそういう奴だからな

714 ：Name_Not_Found：2005/07/14(木) 03:56:38 ID:???

ぬるっとスルー

715 ：Name_Not_Found：2005/07/14(木) 04:05:38 ID:???

あ～んぬるぬるするよぉ～

716 ：Name_Not_Found：2005/07/14(木) 04:21:27 ID:???

大丈夫　痛くしないからね。

717 ：Name_Not_Found：2005/07/14(木) 12:33:00 ID:???

>>706
記述は
-khtml-box-sizing:border-box;
になるのかね？

718 ：Name_Not_Found：2005/07/14(木) 13:29:45 ID:bVvMLeen

a:hover{color:#ffffff}と
a:hover{color:#000000}を
同じページ内の
<a href="aa.html>にはcolor:#ffffffを
<a href="bb.html>にはcolor:#000000を適用したいのですがどうすればできますか？
多分idかclassで指定するんだと思うんですけど使い方がイマイチわからなくて

719 ：Name_Not_Found：2005/07/14(木) 14:30:24 ID:???

>>718
a.foo:hover{ color: #ffffff; }
a.var:hover{ color: #000000; }

<a class="foo">ホバーで白</a>
<a class="var">ホバーで黒</a>

こんな感じで。

720 ：719：2005/07/14(木) 14:32:48 ID:???

ただ多くの場合は、もちろん場合にもよるんだけど、親要素のクラスやIDで
分けた方がわかりやすいかもしれません。

p.foo a:hover{ color: #ffffff; }
p.var a:hover{ color: #000000; }

<p class="foo"><a>ホバーで白</a></p>
<p class="var"><a>ホバーで黒</a></p>

721 ：Name_Not_Found：2005/07/14(木) 15:30:21 ID:???

>720
そんなやり方があったのか！

722 ：Name_Not_Found：2005/07/14(木) 15:40:10 ID:bVvMLeen

できました　どうもありがとうございました
普通に指定するだけでよかったのですね

申し訳ないんですけどもう一つお願いしますorz

a:hover{
background-color:#000000;
}

この場合リンクを指定したテキストのみ背景色が変わるようになりますが
それを行単位で背景が付くようになりませんか？
<p>や<div>でくくった時のように、リンクがある行の一行まるまる背景色を変えたいのですが…

723 ：Name_Not_Found：2005/07/14(木) 16:04:56 ID:???

ホヴァーしたときに行ごと背景付けたいってこと？
NNは対応してたけどIEはまだだとか、よく知らんぽい。

<a href="rink.htm">リンク</a>
でリンクにマウス持って行くと背景とboder付けたいな。

724 ：Name_Not_Found：2005/07/14(木) 16:05:49 ID:???

って…出来るじゃん！
すまんかった

725 ：719：2005/07/14(木) 17:10:38 ID:???

>>722
「一行の端まで」ってのは微妙な表現かも。
pやdivはブロックレベル要素といって、文字通りブロック（箱・ボックス）を形成します。
で、その箱の幅がデフォルトではauto（inheritかも）なので、親要素の幅イッパイまでに
なり、結果として「一行まるごと」に見えるのです。

aはインラインレベル要素だから端まで届かない訳ですが、だったらブロックにしてしまえば
よいのです。で、

つ a { display: block; }

726 ：Name_Not_Found：2005/07/14(木) 18:16:30 ID:BwQDI8xS

タグが間に入っていない一連の文字列について、
\nの改行コードで改行して表示する事って出来ますか？
それが出来ると掲示板等でHTMLフォームから入力された文章の改行コードを読み取って
<p></p>などをつける処理をしなくて済むのですが。

727 ：Name_Not_Found：2005/07/14(木) 18:25:24 ID:???

つ<pre></pre>

728 ：726：2005/07/14(木) 18:34:00 ID:???

>>727
<pre>は自動改行が無効になって、横にはみだしてしまうのがちょっと・・
他に何かありませんか？

729 ：Name_Not_Found：2005/07/14(木) 18:52:13 ID:???

preで工夫しながらやる

730 ：726：2005/07/14(木) 19:34:34 ID:???

preで工夫しながら出来ました。

731 ：Name_Not_Found：2005/07/14(木) 22:00:16 ID:???

>>717
うんにゃ。-khtml-つけないで
box-sizing。operaやmacIEと同じ。

732 ：Name_Not_Found：2005/07/14(木) 23:12:49 ID:???

width指定してやんないとだめじゃないかなぁ・・？

733 ：Name_Not_Found：2005/07/14(木) 23:13:58 ID:???

何がよ？　>>732

734 ：Name_Not_Found：2005/07/15(金) 00:09:24 ID:???

ハジメマシテ。困ってることがあるので、どなたか助言をくださいっ。
画像もすべてcssで配置（background:url(・・・) no-repeat・・・）したため、
クライアントさんから「プリントアウトすると画像が出ない！」と注意されてしまいました。
どうやって対応すべきでしょうか？htmlファイルで画像表示（<img src="・・・" ・・・>）
に作り替えるしかないですかね？でも、通常もhoverも一枚にまとめてるし、
JavaScriptでロールオーバーさせるなど、作り替えなきゃいけないところが大杉て…。
過去ログとか調べてる暇もないので、どなたかアドバイスをお願いしますっ。
　

735 ：Name_Not_Found：2005/07/15(金) 00:13:19 ID:???

> クライアントさんから「プリントアウトすると画像が出ない！」と注意されてしまいました。

そんなの無視だろ。背景にしてる画像にもよる。
情報として全く意味の無い(よーするにデザイン用の画像)は背景にしても良いとおもー。
そんなのプリントする人が、設定で「背景や配色も印刷する」を選択すれば言い話しだが。

それにインクの無駄じゃないか？

736 ：Name_Not_Found：2005/07/15(金) 00:13:42 ID:???

>>734
インターネットオプション→詳細設定→背景の色とイメージを印刷するにチェック

737 ：736：2005/07/15(金) 00:14:22 ID:???

かぶりんこ

738 ：Name_Not_Found：2005/07/15(金) 00:19:03 ID:???

734です。即レス助かりますっ。
なんか、「営業の人がトップページを印刷して宣伝しに行くのに、画像出ないなんて使えない。」
と言われてしまいました…。
とりあえず、736さんの対策を伝え、「サイトのプリントアウトについて」みたいな
ヘルプページをもうけるよう話してみようと思います。
なんだか全css化もいろいろ大変だなぁと思ってしまいました。
　

739 ：Name_Not_Found：2005/07/15(金) 00:38:30 ID:???

webscan.jpでキャプったのをプリントアウトしろって言え
その馬鹿営業に

740 ：Name_Not_Found：2005/07/15(金) 00:39:45 ID:???

そんな無茶な

741 ：Name_Not_Found：2005/07/15(金) 00:58:15 ID:???

>営業の人がトップページを印刷して宣伝しに行くのに、画像出ないなんて使えない。
あなたはその会社のWeb製作管理の人？

ま、それはどーでもいいとして。。
ワープロでしろよ。サイトを印刷していってどうすんの？

742 ：Name_Not_Found：2005/07/15(金) 01:00:57 ID:???

まぁそもそも
スレ違いなわけだが

743 ：Name_Not_Found：2005/07/15(金) 01:03:08 ID:???

そうね。

744 ：Name_Not_Found：2005/07/15(金) 10:54:46 ID:???

IE6の互換モードは、IE5やIE5.5とレンダリングと同じと考えてもよいでしょうか？
つまり、IE6互換モードで確認すれば、IE5や5.5で確認したものと考えてもよいですか？

745 ：Name_Not_Found：2005/07/15(金) 11:07:44 ID:pVFF9wW3

お助けください。バナーの画像とメニューボタンとの間に２ｐｘほどの余白
ができるのですが。どうやればくっつくかいいアドバイスはありませんか？
--ｃｓｓ--
/*バナー部分*/
#banner img {
border-bottom:solid 0px #777777;
}
/*メニュー部分*/
#navi {
background-color:#ffffff;
}
#navi ul {
margin:0px;
}
#navi li{
width:153px;
float:left;
border:solid 1px #9c9c9c;
font-size:12px;
text-align:center;
}
#navi a {
height:20px;
color:#006633;
background-image:url(<$MTBlogURL$>img/menu.gif);
background-repeat:no-repeat;
display:block;
text-decoration:none;
padding-top:5px;

}

746 ：Name_Not_Found：2005/07/15(金) 11:23:11 ID:???

>>745 >>31

747 ：Name_Not_Found：2005/07/15(金) 11:28:08 ID:???

>>744
駄目です。きちんと確認しましょう

748 ：Name_Not_Found：2005/07/15(金) 11:33:04 ID:D+49h3qO

質問です。IEやFireFoxで
<span style="width:100px">01234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567</span>
とやった時に、希望としては100ピクセル未満のところで折り返して
下に長いspanをレンダリングして欲しかったのですが、
上の例のように折り返すためのスペースなどがない場合には、
width指定を無視して右に長いspanをレンダリングしてしまいます。

希望通りに折り返してもらうためにはどのようにすればよいでしょうか？
助言よろしくお願いします

749 ：Name_Not_Found：2005/07/15(金) 11:35:55 ID:???

禿しくガイシュツ　過去ログ読まっしゃい。

750 ：Name_Not_Found：2005/07/15(金) 11:39:37 ID:???

>>749
44thもあるスレの過去ログをすべて読むのは辛いので、
せめて検索ワードだけでも教えてもらえませんか？

このスレ自体はspanで検索しましたが、見つかりませんでした

751 ：Name_Not_Found：2005/07/15(金) 11:46:08 ID:???

>>750
spanなんぞは関係ないことだ。このスレ見ただけでいくつもあるぞ。

>>39-42　と同じことだ。

752 ：Name_Not_Found：2005/07/15(金) 11:48:34 ID:???

どだい　<span style="width:100px">　が間違っているのよ

753 ：Name_Not_Found：2005/07/15(金) 11:53:29 ID:???

>>751
ありがとうございました。仕様なのであれば他の方法を考えてみます。

>>752
参考までに、どのような指定にするのが正しいのか教えてもらえませんか？

754 ：Name_Not_Found：2005/07/15(金) 11:56:29 ID:???

そのくらいの勉強、自分で出来ないのか？

　#ブロック要素とインライン要素の違いを理解しろ。

755 ：Name_Not_Found：2005/07/15(金) 12:07:06 ID:???

>>754
死ね

756 ：Name_Not_Found：2005/07/15(金) 12:43:53 ID:???

>>755
どうしようもないバーローだなあ

757 ：Name_Not_Found：2005/07/15(金) 13:34:04 ID:???

>>755
ｷﾀｺﾚ

758 ：757：2005/07/15(金) 13:35:30 ID:???

誤爆したｗｗｗｗ
しかもレス番号がドンピシャｗｗｗｗｗｗｗｗｗ
ﾃﾗﾓｳｼﾜｹﾅｽ

罪滅ぼしに >>755
ヒント：テンプレ嫁

759 ：Name_Not_Found：2005/07/16(土) 00:51:36 ID:???

ようするに答えられないバカばっかってことで納得した。

760 ：Name_Not_Found：2005/07/16(土) 01:20:33 ID:???

そんなこと書かれたって、釣られて答えなんか書くもんか！

つぎのしつもんどうぞー

761 ：初心者スレの721：2005/07/16(土) 04:03:22 ID:Jk1T+T/H

初心者スレでガン無視されてこちらに流れてきますた。
向こうに断りは入れてきたので、一部重複ご容赦。
--
おとといくらいからぼちぼち始めたレベルの初心者っす。
h1とかpとかulはなんとか色々いじってみた。で、今夜dlをいじっていて質問。
環境はOSXとSafari（とオフィスに着いてきたウィンドウズとIE6）とFireFoxっす。
MacのIEもあるけどｻﾜｯﾀｺﾄﾅｽ

dtとddを横に並べてみようと思って、スタイルシートで
dt { clear: left; float: left; width: 100px;}
dd { margin-left: 105px; }
みたいに（数字は適当）してみて、まあうまくいったんだけど、ddの中で毛一回dlを作ると、
一個目の dt の clear: left; が邪魔になる。で、調べたらfirstなんたら疑似要素を使え、
ってのをハケーンして試したんだけどﾀﾞﾒｽ
あと、dt dd dt { clear: none; }もなぜかﾀﾞﾒｽ
どうしたらよいの？

762 ：Name_Not_Found：2005/07/16(土) 05:31:07 ID:???

dtにclear:leftは必要なの？

763 ：初心者スレの721：2005/07/16(土) 07:15:40 ID:???

こんな時間にレスついたー！
こっちのスレの中の人はﾃﾗﾔｻｼｽ!!!

>>762
いろいろいじっていて、dtの幅を固定した場合、dtのボックスの高さがddのそれより
高くなることがあるじゃないすか。そうすっと次に来るdtも回り込んじゃうんですよ。
で、考えたのがdtにclear: clear;っす。

764 ：初心者スレの721：2005/07/16(土) 07:19:30 ID:???

あ、dtの幅を固定とかは必要条件があるわけじゃ無くて、単に勉強ながらいろいろ
いじっているだけなんで、出来ないなら出来ないでもいいっす。

あー、htmlっておもしろいもんだったんだなー。

765 ：Name_Not_Found：2005/07/16(土) 10:43:08 ID:???

>>761
>あと、dt dd dt { clear: none; }もなぜかﾀﾞﾒｽ
そら駄目に決まってる。dtの中はインライン要素のみ。ddなんざ入れられない。
http://www.ne.jp/asahi/minazuki/bakera/html/reference/list#dt
●土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
　正当(valid)なHTMLを心がけて下さい。validator（>>2）でチェックできます。

766 ：Name_Not_Found：2005/07/16(土) 10:50:08 ID:???

dd dt {clear:none;} だけでいいのにね。

767 ：初心者スレの721：2005/07/16(土) 12:29:35 ID:???

思いっきり書き方間違ってた…
直したら良くなったんだけどサハリが言うこと聞かず
でも調べてみたらこれはわかったので大丈夫です
どうもありがとう
わかんなくなったらまたおしえてください

768 ：Name_Not_Found：2005/07/16(土) 13:19:26 ID:???

>でも調べてみたらこれはわかったので大丈夫です
これでは報告にならぬ。何がどうしてどうやったのか、を記述すべし。

769 ：Name_Not_Found：2005/07/16(土) 14:17:25 ID:NOy17PAM

CSSファイルのインテンドにタブとか半角スペースを使うじゃん。
ふと疑問に思ったんだけど、あれってファイル容量に含まれるのかな？

770 ：Name_Not_Found：2005/07/16(土) 14:21:45 ID:???

>>769
こちらへドゾー
http://pc8.2ch.net/test/read.cgi/hp/1106209097/

771 ：Name_Not_Found：2005/07/16(土) 14:54:21 ID:???

<質問>
レイアウトは基本的にCSSでやってますが、表だけはどうにもならず
tableを使っています。
外部CSSに
body{
font-size : **px;
}
と指定してもtableの中身の文字の大きさは反映されません。
それ以外の文字の大きさは反映されます。
tableの中の文字大きさをCSSで指定するにはどうすれば良いので
しょうか？
</質問>

772 ：Name_Not_Found：2005/07/16(土) 15:27:57 ID:???

>>771　●OSやブラウザの種類とヴァージョンについては必ず明記してください。
http://cssbug.at.infoseek.co.jp/detail/winie/b023.html

773 ：Name_Not_Found：2005/07/16(土) 15:34:32 ID:???

そもそも、文字サイズをpx単位の絶対指定で固定すべきではない。>>771
cf. http://www.fromdfj.net/html/fontsize.html
　　http://pc.2ch.net/hp/kako/1004/10041/1004167821.html

774 ：Name_Not_Found：2005/07/16(土) 17:01:09 ID:???

>>773
大きなお世話

775 ：Name_Not_Found：2005/07/16(土) 17:12:34 ID:???

>733
激しく同意。最近のサイトは豆字のくせに
pxで指定してるからIEの拡大機能が使えない。俺はFirefoxに移ったが。

776 ：Name_Not_Found：2005/07/16(土) 18:30:01 ID:???

大きくされると崩れる

777 ：Name_Not_Found：2005/07/16(土) 18:33:00 ID:???

ヘタレはね。

778 ：Name_Not_Found：2005/07/16(土) 18:39:31 ID:???

見る側は文字を大きくする権利がある。崩れたっていいじゃまいか。

779 ：Name_Not_Found：2005/07/16(土) 19:41:36 ID:???

確かに固定して小さめにしたほうがかっこよくはなるが
目の悪い人にとっては大きくできないのはつらい。

780 ：Name_Not_Found：2005/07/16(土) 20:19:58 ID:???

小さい文字をカッコイイと思うのは、デザインの怠慢だよ
情報としての文字を使いこなせていないだけ。

とはいえ、制作者の勝手だと思う。
閲覧者は気に入らなければ他を探せばいいし、
他がなければ「（態度はでかいが）文字が小さいですね＾＾」ってメール送ればいい。

だから結論としては、スレ違いか？

781 ：Name_Not_Found：2005/07/16(土) 20:54:43 ID:???

>769
誘導されてるがこれだけは突っ込んでおく
×インテンド
○インデント
釣れておめでとう

782 ：Name_Not_Found：2005/07/16(土) 20:57:10 ID:???

俺は文字サイズ100～200％で制作してるけど、
文字サイズが小さいことのメリットもあるんじゃないの。
好きにやらせてあげなよ。所詮WEBページなんてチラシの裏だ。

783 ：Name_Not_Found：2005/07/17(日) 00:23:59 ID:???

学生向きのサイトだから文字サイズなんてどうでもいい

784 ：Name_Not_Found：2005/07/17(日) 00:55:21 ID:???

Fire Fox 使えと、トップページに書いておく。

785 ：771：2005/07/17(日) 01:44:50 ID:???

>>772
<レス>
ありがとうございます。
OSはWinXP ブラウザはIE6.0(Sleipnir)です。

あとfont-sizeをピクセル単位にしてるのは、
・表の中身が数字だけで小さい文字でも判別が容易であること
・文字を大きくした場合の表の崩れの弊害が大きいこと
を理由にしています。
他の部分は90%で指定しています。
やっぱりちょっと小さめの方が見栄えが良いですが、それは
見る人の意思を尊重して大きさを変更できるようにしています。
</レス>

786 ：Name_Not_Found：2005/07/17(日) 04:36:18 ID:???

<煽り>
<質問></質問>だの<レス></レス>だのってみりゃわかるのに
よほど他人が見てよくわからん文章を書いてたみたいだな。
</煽り>

787 ：Name_Not_Found：2005/07/17(日) 06:42:59 ID:???

オマエモナー

　　　　 ∧＿∧
　　　　（　´∀｀）
　　　　（　　　　）
　　　　｜｜　|
　　　　（_＿）＿）

788 ：Name_Not_Found：2005/07/17(日) 09:29:47 ID:???

リストを使って並べ替えした時にスペースが空きます。

■カテゴリ
　・AAA
　・BBB

これを

■カテゴリ
・AAA
・BBB

にするにはul（もしくはli）に、どういう記述をすればいいのでしょうか？

789 ：Name_Not_Found：2005/07/17(日) 09:32:34 ID:???

>>788
margin-left辺りをいじってみれ。

790 ：Name_Not_Found：2005/07/17(日) 09:32:51 ID:???

margin: 0;
padding: 0;

791 ：Name_Not_Found：2005/07/17(日) 10:38:43 ID:HF11zJ57

なんかウィンドウズアップデートしたら
スタイルシートをＩＥが中途半端に読み込まなくなりました。
おまいらはどうですか？

792 ：Name_Not_Found：2005/07/17(日) 11:11:36 ID:???

Windows使ってないので分かりません。
MS捨てろよ。いい加減。

793 ：Name_Not_Found：2005/07/17(日) 11:26:56 ID:???

以下糞レスが続きますがチャンネルはそのまま

794 ：Name_Not_Found：2005/07/17(日) 11:31:49 ID:???

うんがー。ちゃんねるを13chに変更。
http://www.13ch.net/

795 ：Name_Not_Found：2005/07/17(日) 13:46:55 ID:???

スタイルシート使ってWebデザインする場合、最低でもどのOS、ブラウザを考慮
しなきゃいけないのかな？
商用のサイトと個人サイトでは多少変わってくるとは思うけど。

796 ：Name_Not_Found：2005/07/17(日) 14:11:25 ID:???

ぜんぶ

797 ：Name_Not_Found：2005/07/17(日) 14:12:04 ID:???

どうせ自分しか見ないんだから、自分の使ってるOSとブラウザ

798 ：Name_Not_Found：2005/07/17(日) 14:34:03 ID:???

ボックス内のテーブルがセンタリングしないのですが、
どうやってセンタリングにしたらよいのでしょうか？

<div id="area">
<table>テーブルのソース</table>
</div>

#areaにmargin-right:auto; margin-left:auto;
っとしているのですが、、

799 ：Name_Not_Found：2005/07/17(日) 15:18:22 ID:???

>>798　tableのwidthは？

800 ：Name_Not_Found：2005/07/17(日) 15:22:16 ID:???

>>785
>・表の中身が数字だけで小さい文字でも判別が容易であること
うそつけ。ならなんで>>771でbody{font-size:**px;}なんて指定したんだ？
bodyは本文の文字指定だろ。table {font-size:～em;}でいいはずだぞ。
判別が容易かどうかは人それぞれだし。大きいサイズで固定されても迷惑だし。

801 ：Name_Not_Found：2005/07/17(日) 15:29:07 ID:7tnGSrkG

<div id="contents">
<div id="spec">
{省略}
</div>
<div id="text">
{省略}
</div>
</div>

#id{
background-color:#aaa;
width:100%;
}
#spec{
float:left;
width:50%;
}
#text{
width:50%;
}

としたときに、#spec の高さが #text よりも高いとき、背景色が #text の高さまでしか
表示されないのを回避するにはどうすれば良いんでしょうか？

802 ：Name_Not_Found：2005/07/17(日) 15:43:52 ID:???

>>798
ブラウザは？

>>801
#id
って何？

803 ：801：2005/07/17(日) 15:48:15 ID:???

>>802
ごめんなさい、#contents の間違いでした < #id指定

804 ：Name_Not_Found：2005/07/17(日) 15:49:14 ID:???

>>798
IEじゃそれじゃ真ん中に見えないポ。
text-align:centerでやってみれ。

805 ：798：2005/07/17(日) 15:51:37 ID:???

>>799
指定する・しないにしても左に寄ってしまいます
>>802-803
Firefoxです。IEなら大丈夫なのですが・・。
（IE用にtext-align:centerしてます

806 ：798：2005/07/17(日) 15:55:17 ID:???

自己レスです。。
*{
margin:0px;
padding:0px;
}

という設定を外したらセンタリング出来ました・・。
むやみやたらにこの設定はしない方が良いみたいですね・・。

807 ：Name_Not_Found：2005/07/17(日) 15:57:03 ID:???

>>798
囲ってるdivじゃなくてtableに直接margin:autoやってみたらどうよ？

808 ：Name_Not_Found：2005/07/17(日) 16:00:47 ID:???

>>806
条件後出しじゃ誰にも判らんよ。

　　　　次↓

809 ：Name_Not_Found：2005/07/17(日) 16:04:06 ID:???

>>801
ＦＡＱ既出。>>6の「浮動要素の高さもheightに含めさせる方法」など参照。
あと、●OSやブラウザの種類とヴァージョンについては必ず明記してください。

810 ：Name_Not_Found：2005/07/17(日) 16:06:47 ID:???

IEとFireFoxの描画が同じになる日を待ち望んでいる。

811 ：Name_Not_Found：2005/07/17(日) 16:11:12 ID:???

IE7っていつ出るの？　ＣＳＳ対応は改善されるの？

812 ：Name_Not_Found：2005/07/17(日) 16:26:42 ID:???

出してもXPのみ

813 ：Name_Not_Found：2005/07/17(日) 16:34:53 ID:???

IE君はどうして簡単に誤解してくれますか。
だから！そこそうじゃないって！おい、そんな認識するんじゃねえって！
とても手を焼きます

814 ：Name_Not_Found：2005/07/17(日) 17:10:27 ID:???

FAQも見たのですが、どうしてもわからないので質問します。

<div id="back">
<div class="left">
左の枠
</div>
<div class="right">
右の枠
</div>
</div>

として、.leftにfloatでleftを、.rightにfloatでrightを指定しています。
#backに背景画像（もしくは背景色）をしていしてるのですが、
なぜかIE6では背景が表示されて、Firefoxでは表示されません。
floatの設定を解除したら表示されます。これはどうしてでしょうか？

815 ：Name_Not_Found：2005/07/17(日) 17:16:23 ID:???

>>814
ＦＡＱ既出。>>6の「浮動要素の高さもheightに含めさせる方法」など参照。
>A4: まずclear忘れがないかをを確認してください。

http://www.mozilla.gr.jp/standards/webtips0021.html
>'height'が'auto'である場合，高さは，要素がブロックレベルの子供をもつ
>かどうかに依存する。［……］すなわち，浮動ボックス及び絶対位置決め
>ボックスは無視され，

816 ：Name_Not_Found：2005/07/17(日) 17:22:44 ID:???

>>815
一度読んだのですが、改めて読んだら意味が理解出来ました。
ありがとうございました。

817 ：Name_Not_Found：2005/07/17(日) 17:24:43 ID:???

FAQをよく讀んでから質問しませう。>>801・>>814

818 ：Name_Not_Found：2005/07/17(日) 17:33:44 ID:???

他にもっとわかりやすく説明したページがあればいいのかなあ？

819 ：Name_Not_Found：2005/07/17(日) 17:54:25 ID:???

IE7になったらバグ直りますように…

820 ：Name_Not_Found：2005/07/17(日) 18:11:12 ID:???

で、いつ出るんだか。
Microsoftは、IE7でCSS実装を改善するって言ってるの？

821 ：Name_Not_Found：2005/07/17(日) 18:13:46 ID:???

企業秘密だから分からない。ソース公開してくれますように…

822 ：Name_Not_Found：2005/07/17(日) 18:14:42 ID:???

IE7自体、IE離れに対する繋ぎ臭い

823 ：Name_Not_Found：2005/07/17(日) 18:19:16 ID:???

繋ぎも何も、別に売り上げに関係するほどのものでもないブラウザごとき
MSは気にもしてないだろう。
いくらFxユーザーが増えたって、MSにしてみればWindowsを使ってくれれば
それで問題ないわけだし。

824 ：Name_Not_Found：2005/07/17(日) 18:22:17 ID:???

IE7に関する追加情報が明らかに
http://slashdot.jp/articles/05/04/25/2135227.shtml

825 ：Name_Not_Found：2005/07/17(日) 18:22:27 ID:???

Firefoxのススメっていうサイト作れば、IEユーザも減るんじゃないかな？
IEなんて糞って事を…

826 ：Name_Not_Found：2005/07/17(日) 18:23:17 ID:???

>>825
もうWebに腐るほどあるがな

827 ：Name_Not_Found：2005/07/17(日) 18:26:06 ID:???

IE6のみで動作確認してるサイト管理者にはIE7は頭の痛いものかもしれんな。

828 ：Name_Not_Found：2005/07/17(日) 18:27:53 ID:???

俺的には、IE7が夏にでて、果して正常にコンテンツが表示されるか
心配だ。この夏は、大変なんですよ。

829 ：Name_Not_Found：2005/07/17(日) 18:29:58 ID:???

七月リリースとか言ってたはずなのにもう半ばすぎ。これは遅れると見た。
或いは、拙速で出してバグやセキュリティー・ホール続出とか。

830 ：Name_Not_Found：2005/07/17(日) 18:31:00 ID:???

IEソースくらいソース公開して、みんなで作ればいいのにね。
俺はゴメンだ。Mozillaの方に専念する。

831 ：Name_Not_Found：2005/07/17(日) 18:31:28 ID:???

↑あ、日本語おかしかった。。

832 ：Name_Not_Found：2005/07/17(日) 18:33:11 ID:???

http://hail2u.net/blog/webdesign/css_bug_1.html

833 ：Name_Not_Found：2005/07/17(日) 18:33:52 ID:???

まぁ仮にIEがまともになったとしてもスタンスが変わらなければIEに戻る人もおらんだろ

834 ：Name_Not_Found：2005/07/17(日) 18:35:55 ID:???

IEはタブブラウザになるらしいですよp

835 ：Name_Not_Found：2005/07/17(日) 18:36:11 ID:???

IE7でサイト表示崩れる→サイトの書き方がおかしいと気づかない→
IE7をクソブラウザ認定→そんなスレが2chに乱立

夏だから・・・ありそうだなぁ・・・。

836 ：Name_Not_Found：2005/07/17(日) 18:36:54 ID:???

>>800
うざー

837 ：Name_Not_Found：2005/07/17(日) 18:37:33 ID:???

>>832　で、その古い既出のバグがどうかしたのか。
>>834　ＣＳＳと関係ないねえ。

838 ：Name_Not_Found：2005/07/17(日) 18:39:39 ID:???

>837
だから、β版公開までにそのバグを何とかして欲しいって事。
まだまだ沢山あるけど。

839 ：Name_Not_Found：2005/07/17(日) 18:40:31 ID:???

たしかに、px固定はうざい。これもＩＥの要改善箇所か。

840 ：Name_Not_Found：2005/07/17(日) 18:41:13 ID:???

800はユーザスタイルシート用意するのも億劫なんだろ
それかアクセシビリティ＝正義だと思ってる

841 ：Name_Not_Found：2005/07/17(日) 18:44:50 ID:???

誰だって阿呆な指定をするサイトのためにユーザスタイルシート用意するのは面倒臭いし
アクセシビリティーを考慮するのは当然だな。
それはそれとして、
800が指摘した、表内のフォント指定ならなぜbodyをセレクタにしたかってのは正当だし。

842 ：Name_Not_Found：2005/07/17(日) 18:46:16 ID:???

打倒IE

843 ：Name_Not_Found：2005/07/17(日) 18:51:04 ID:???

>>838　何であのバグだけを、しかもあのページで以て挙げたのか、意味不明。

844 ：Name_Not_Found：2005/07/17(日) 18:55:21 ID:???

どーでもいい。

845 ：Name_Not_Found：2005/07/17(日) 19:08:29 ID:???

>>841
うざー

846 ：Name_Not_Found：2005/07/17(日) 19:34:07 ID:???

たしかに、IEのpx固定はうざい。

847 ：Name_Not_Found：2005/07/17(日) 19:49:06 ID:???

IEなんか使ってるからだ

848 ：Name_Not_Found：2005/07/17(日) 19:50:29 ID:???

>847
俺は使っていないから困んないが、悩むのはWeb作成者の方だろ。
IEのバグのために、えらいこっちゃ。

849 ：Name_Not_Found：2005/07/17(日) 19:55:50 ID:???

850 ：Name_Not_Found：2005/07/17(日) 20:10:34 ID:???

タグ間違ってると突っ込んだほうがいいのかどうか

851 ：Name_Not_Found：2005/07/17(日) 20:13:10 ID:???

852 ：Name_Not_Found：2005/07/17(日) 20:15:02 ID:???

ふんにゃか。ふんにゃか。

853 ：Name_Not_Found：2005/07/17(日) 20:18:36 ID:???

釣りだろ。

854 ：Name_Not_Found：2005/07/17(日) 20:24:21 ID:???

皆さんに質問ですが、CSSレイアウトにするときに
ヘッダーやフッターなどベースとなるCSSを決めて
あとはそのページごとに1つのcssを作成するという感じですか？

例えば
トップページなら、top.cssを追加して
サイトマップなら、sitemap.cssを追加して

と言うような感じでhtml+cssとしていく方が効率が良いのでしょうか？

855 ：Name_Not_Found：2005/07/17(日) 20:31:53 ID:???

スタイルはそのページもいっしょ。

856 ：Name_Not_Found：2005/07/17(日) 21:40:47 ID:???

>>820
「CSSなんていう良く分からないしろもの」に対して
わざわざブラウザ制作側が配慮なんざぁしませんよ。

というのが過去スレにあったように思う。

857 ：Name_Not_Found：2005/07/17(日) 22:13:28 ID:PLMvfZZR

すみません、質問です。

ttp://onlinecasinolife.com/renewal/poker.html
で左のメニューと同じように中央の本文の下線も消したいのですが、どうやっても消えてくれません。

CSSの本文の部分は、
.main
{margin-top:0;margin-left:auto;margin-right:auto;margin-bottom:0;
position:absolute;left:174px;top:117px;width:468px; text-align:left;font-size:0.75em;padding:0.4em;
letter-spacing:1.5px;line-height:1.5;text-decoration:none}

p.main a:link{color:#0000ff}
p.main a:visited{color:#c0c0c0}
p.main a:hover{color:#ffcc66}
p.main a:active{color:#fcc28a}

です。何がいけないのでしょうか？

858 ：Name_Not_Found：2005/07/17(日) 22:33:17 ID:???

>>857
リンクの下線を消したいならtext-decoration:noneはA要素に

個人的にはリンクの下線は残しておいてほしいですが・・

859 ：Name_Not_Found：2005/07/17(日) 22:34:30 ID:???

text-decoration:none
↓
text-decoration:none;

p.main a:link{color:#0000ff}
p.main a:visited{color:#c0c0c0}
p.main a:hover{color:#ffcc66}
p.main a:active{color:#fcc28a}
↓
p.main a:link{color:#0000ff;}
p.main a:visited{color:#c0c0c0;}
p.main a:hover{color:#ffcc66;}
p.main a:active{color:#fcc28a;}

セミコロン忘れるなよ。

860 ：Name_Not_Found：2005/07/17(日) 22:36:02 ID:???

>>859ですが。
リンクの下線は消さない方がいいと推奨されています。
消すとどれがリンクか分からなくなるので、頼む消すな!!

861 ：857：2005/07/17(日) 22:43:56 ID:PLMvfZZR

>>858
>>859
ありがとうございます。さっきスタイルシートを直してもらったとおりに修正したのですが、
やっぱり下線が消えません。HTMLの方に問題があるのでしょうか？

>>860
消した方がすっきりするので・・。消したいです。

862 ：859：2005/07/17(日) 22:53:51 ID:???

よし、じゃ俺がそのサイト逝って本格的に調べるとするか。
質問はリンクの下線を消したいんだよね？

863 ：857：2005/07/17(日) 22:55:54 ID:PLMvfZZR

>>862
そうですね、左のメニューのリンクと同じような効果を中央の本文にも付けたいんです。
スタイルシートの部分は必要な所を貼り付けますので、いつでも言って下さい。

864 ：Name_Not_Found：2005/07/17(日) 22:56:24 ID:???

p.main a { text-decotarion: none;}

乙

865 ：857：2005/07/17(日) 22:58:00 ID:???

>>864
何故乙？間違ってるという事でしょうか？

866 ：Name_Not_Found：2005/07/17(日) 22:58:05 ID:???

だから858にAにとあるっしょ？
p.main a:link{color:#0000ff;text-decoration:none;}
p.main a:visited{color:#c0c0c0;text-decoration:none;}
p.main a:hover{color:#ffcc66;text-decoration:none;}
p.main a:active{color:#fcc28a;text-decoration:none;}
これでも消えなかったらHTMLがおかしいか他にどこかでCSSが指定されてるとか。

あと、すっきりするのはあなただけですよ。
メニューのようなわかりやすい所ならともかく、
本文中の下線無しリンクはただの色付きテキストと見分けがつかず
ほとんどの人はクリックしないという実験報告もあります。

867 ：859：2005/07/17(日) 22:58:20 ID:???

ねぇ、今思ったんだけど。。
CSSで面倒だから、

<p class="menu">
<a href="http://www.onlinecasinolife.com/top.html">ホーム</a><br></p>
<p class="menu2">
<a href="http://www.onlinecasinolife.com/intro.html">はじめに</a><br></p>
<p class="menu3">

じゃなくて…
<ul>
<li><a href="../top.html">ホーム</a></li>
<li><a href="../intro.html">はじめに</a></li>

にしてくれた方が助かる。

868 ：859：2005/07/17(日) 22:59:22 ID:???

間違えた。
<ul>
<li><a href="../top.html">ホーム</a></li>
<li><a href="../intro.html">はじめに</a></li>
</ul>

869 ：Name_Not_Found：2005/07/17(日) 23:03:41 ID:???

870 ：Name_Not_Found：2005/07/17(日) 23:04:34 ID:???

誤爆

871 ：859：2005/07/17(日) 23:04:59 ID:???

ちょ待ってよ。中央にあるリンクのアンダーラインを消したいんだよね？
>左のメニューと同じように中央の本文の下線も消したいのですが
左のメニューのリンクにも下線はあるよ。

俺のブラウザがおかしいすか？

872 ：859：2005/07/17(日) 23:05:26 ID:???

>>869
とるなーーーーー

873 ：857：2005/07/17(日) 23:06:22 ID:???

>>866
それをやってみたんですが、やっぱり消えなかったので本文の
下線はそのままにしておきます。ありがとうございました。
HTMLがおかしいのかも・・。

>>867
まだ初心者なのでulとかliがよく分からないのですが、
これも要素を指定すればmenu2とかと同じように使えるのですか？

874 ：Name_Not_Found：2005/07/17(日) 23:07:20 ID:???

なんでとるななの？
あったらmozillaじゃ見えないんだよジョゲ！

875 ：Name_Not_Found：2005/07/17(日) 23:07:50 ID:???

すみませんハゲの間違いです

876 ：859：2005/07/17(日) 23:08:31 ID:???

まてまて、HTML自体おかしいぞ。俺が修正してやるから時間くれ。
後は自分でCSS修正しろ。CSSやる前にHTMLがしっかりしていないと思い通りに
デザイン出来ないのもあたりまえ。

<h1><title>ポーカールーム</title></h1>

これはヤバイだろ。

877 ：857：2005/07/17(日) 23:08:35 ID:???

>>869
それはダメ。

>>871
IEですか？うちはIEですけど、メニューと過去ログは下線が消えていて、
本文のルール、ベーシックストラテジーとかの部分が下線ついてます。

878 ：Name_Not_Found：2005/07/17(日) 23:10:40 ID:???

859はおかしいって
セミコロンわすれるなとか、<style>とるなとか
おまえがHTML組んだらどうなんだよｗ

879 ：857：2005/07/17(日) 23:12:00 ID:???

>>876
ありがとうございます。CSS導入したのはつい最近なので、タグの意味もちょっとしか分かりません。
h1は取った方が良いんですか？

880 ：859：2005/07/17(日) 23:14:07 ID:???

適当だし、W3Cの仕様書通りじゃないが…まずは、、、

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">

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

<title>ポーカールーム</title>
<META NAME="ROBOTS" CONTENT="NOARCHIVE">
<META name="description" content="オンラインカジノ総合サイト。体験談、日記、攻略法など">
<META name="keywords" content="オンラインカジノライフ,例のページ,ネットカジノ,オンラインカジノ,ポーカールーム">
</head>

<body>
<div id="header">
<h1>OnlineCasinoLife</h1>

<p>オンラインカジノライフは、カジノの最新情報をお届けしています。</p>
</div>

<dl>
<dt>累計：</dt>
<dd><img src="http://sv75.lolipop.jp/cnt/accnt.php?cnt_id=414925&ac_id=LA21045688&mode=total"></dd>
<dt>今日</dt>
<dd><img src="http://sv75.lolipop.jp/cnt/accnt.php?cnt_id=414925&ac_id=LA21045688&mode=today"></dd>
<dt>昨日：
<dd><img src="http://sv75.lolipop.jp/cnt/accnt.php?cnt_id=414925&ac_id=LA21045688&mode=yesterday"></dd>
</dl>

881 ：859：2005/07/17(日) 23:15:30 ID:???

>>878
すみませんね、信者なんで。。

882 ：857：2005/07/17(日) 23:20:32 ID:???

881までは直しました。

883 ：859：2005/07/17(日) 23:22:39 ID:???

>>882
ま、そのうち出来たらアップするよ。
すぐ出来る。本当はHTMLから教えてあげたいところだが…
余裕無いので、作っちゃいます。

884 ：859：2005/07/17(日) 23:23:37 ID:???

あ、ごめん。
<dt>昨日：
ここを
<dt>昨日：</dt>
にしといて。

885 ：Name_Not_Found：2005/07/17(日) 23:24:04 ID:???

div.main a { text-decoration: none;}

886 ：857：2005/07/17(日) 23:25:02 ID:???

>>883
ありがとうございます。
>>868のliを使うと、文字の横に黒丸とかがもれなく付いてきませんか？

887 ：Name_Not_Found：2005/07/17(日) 23:30:34 ID:???

cssで消すんだよ。
let'sお勉強

888 ：859：2005/07/17(日) 23:32:05 ID:???

>>886
>文字の横に黒丸とかがもれなく付いてきませんか？

そーいうのは、CSSを使ってなんとかなる。Webページを作成する時は
見ためを忘れること。初心者に多いが、同時進行で進める人が多い。

ちなみに黒丸は、
list-style: none;
で消せるから焦らずゆっくりね。

889 ：Name_Not_Found：2005/07/17(日) 23:33:20 ID:???

859と857はケコーンしなさい。

890 ：Name_Not_Found：2005/07/17(日) 23:41:38 ID:???

>>859
あんまり自分のやり方を人に押し付けるのはよくないと思われ
CSSスレなんだからマターリいこうや

891 ：857：2005/07/17(日) 23:45:33 ID:???

>>885
ありがとう！やってみたら下線が消えました。
文字色も適応された模様。

まだliで組みなおして崩れまくりです・・

892 ：Name_Not_Found：2005/07/17(日) 23:49:31 ID:???

>>881
信者なら正しいことをしてください

893 ：859：2005/07/17(日) 23:49:59 ID:???

>891
崩れて当り前。俺がまだ完全版を公開していないだろ？
CSSも未完成だし。またーりしようよ。

で、<img>にはalt属性やらなにやらって細かい事あるけど、その辺は
後でゆっくり教えるよ。
とにかく、もう少し完成。適当にアップローダ探しといて!

894 ：859：2005/07/17(日) 23:50:49 ID:???

>>892
えー、そこまで時間かけられないよ。
それに俺のサイトじゃないだろ。。
後で教えればいいんだよ。

895 ：Name_Not_Found：2005/07/17(日) 23:52:45 ID:???

>>894
根本から違うんだって。
CSSファイルの中には<style>はいらない、というか
つけてはいけないし、セミコロンだって、意味は
「複数のプロパティを区切る」ものだから
最後のプロパティには必要ないんだよ
HTMLがちょっといい加減かどうかはどうでもいい

896 ：857：2005/07/17(日) 23:54:18 ID:???

>>893
助かります。ありがとうございます。

http://up.isp.2ch.net/upload/c=01owarai/index.cgi
あたりのアップローダーで良いでしょうか？

897 ：859：2005/07/18(月) 00:00:45 ID:???

>>895
> CSSファイルの中には<style>はいらない
ｽﾏｿ…

CSSファイル内にあるとは気が付かなかった。
てっきりHTMLにあるのだと…ｽﾏｿ

>複数のプロパティを区切る
こりゃぁ一本取られました。その通りです。申し訳ない。

> HTMLがちょっといい加減かどうかはどうでもいい
あのままだと、CSSも長くなるしファイルサイズも大きくなる。
それに苦労しちゃうじゃん？

>>896
おk

898 ：859：2005/07/18(月) 00:08:23 ID:???

857氏
tp://onlinecasinolife.com/renewal/design.css
の、
<style type="text/css">と</style>は消してくれ。

>896
そのアップローダHTMLはダメか。他探して来る。

899 ：Name_Not_Found：2005/07/18(月) 00:12:04 ID:???

何故ｚｉｐでまとめない？

900 ：859：2005/07/18(月) 00:14:05 ID:???

zipかlzh開ける？>>857

901 ：857：2005/07/18(月) 00:14:54 ID:???

>>900
おｋです。両方開けます。

902 ：859：2005/07/18(月) 00:27:51 ID:???

まだ完成してない。急いで作ったので、文法エラーが出てる。
今日の朝、出来たら直してみるよ。
だから、まだアップすんなよ。

あと、誰かHTMLに詳しい人いたら<table>とか<img>とかがおかしいから
直してくれ。流石にディスプレイに座りっぱなしで疲れた。
CSSはこれからするから、焦らずに。

http://up.isp.2ch.net/up/ad86fe42b954.zip

勝手にXHTMLにしてしもーた。不都合があるなら直すよ。
それでは、おやすみ。ﾉｼ

903 ：Name_Not_Found：2005/07/18(月) 00:36:05 ID:???

臭い

904 ：859：2005/07/18(月) 00:37:17 ID:???

あと、まだまだ白黒でデザインのカケラも無いが
これからスタイルシートでデザインしていくから安心しろ。
このスレはCSSがメインだからね。

ちなみに、メニューへのリンクは音声ブラウザに配慮した
もので、CSSで非表示に出来る。

では今度こそﾉｼ

905 ：859：2005/07/18(月) 00:39:39 ID:???

>>903
大丈夫、グロじゃないから。

906 ：857：2005/07/18(月) 01:02:59 ID:???

>>904
本当にありがとうございます。
xhtmlは慣れていないので、htmlでお願いします。

907 ：Name_Not_Found：2005/07/18(月) 01:08:05 ID:bOBe9U7q

>>902
ダウンロードできないのはなぜ?

908 ：859：2005/07/18(月) 01:22:09 ID:???

おはよう。無料お試し期間でサーバ借りました。
１０日間だけです。ﾔﾊﾞ。

http://html-css867.accela.jp/
http://html-css867.accela.jp/dl.zip

909 ：859：2005/07/18(月) 01:23:46 ID:???

>>908
に書いた通りここに一時アップしました。これでアップローダの心配無し。
１０日立つと削除されちゃうので、早めに作業を終らせましょー。うん。
ではﾉｼ

910 ：Name_Not_Found：2005/07/18(月) 01:31:25 ID:???

>>908
なんだこれ？

ただ本文の下線が消したかっただけの>>857タンがちょっと可哀想になってきた気がするのは俺だけ?

911 ：859：2005/07/18(月) 01:33:26 ID:???

>910
最初がひどかったんだよ。
<h1><title>タイトル</title></h1>
と、メニューに全て<p>にclassをつけてたから直してあげた。
これじゃあ、あとあと大変だろ。

912 ：857：2005/07/18(月) 01:40:06 ID:???

>>911
感謝です。
htmlはこういうのになるというのは分かったんですが、cssはこれからですよね？
zipの中身の画像ファイルは開けませんでした。

913 ：Name_Not_Found：2005/07/18(月) 01:41:20 ID:???

自分で直さなきゃ身にならない。自分で直せない奴はどのみちものにならない。

914 ：859：2005/07/18(月) 01:43:45 ID:???

>913
でも、ここはCSS質問スレッドなんだよねぇ～。
ここは匿名の掲示板だからもちろん >>857ﾀﾝだけを鍛える訳にはいかないんだよ。

俺も忙しいし。

>>912
え？画像は入れていないんだけど。ま、間違えて入ってたらｺﾞﾒｽ

915 ：Name_Not_Found：2005/07/18(月) 01:46:31 ID:???

>正当(valid)なHTMLを心がけて下さい。validator（>>2）でチェックできます。
で、済む話だろ？　過保護は本人のためにもならん。

916 ：857：2005/07/18(月) 01:48:36 ID:???

>>914
私が間違えてました・・。
入ってたのはhtmlだけですね。

917 ：Name_Not_Found：2005/07/18(月) 01:50:23 ID:???

何だこのスレ

918 ：859：2005/07/18(月) 01:50:46 ID:???

>915
俺って>>857タンにとって余計なお世話をしちゃったかな？
でも後々の事考えるとやっぱり。楽な方法でやってもらいたい。

919 ：Name_Not_Found：2005/07/18(月) 01:53:09 ID:???

インライン・スタイルシートは止めろ。――と、ひと言で済むものを。あとは検索させろ。

920 ：Name_Not_Found：2005/07/18(月) 02:13:53 ID:???

次スレッドのための改訂案、三つ。

>>6
>A4: まずclear忘れがないかをを確認してください。
→ A4: まずclear忘れがないかを確認してください。

>>8
Ｑ11とＱ12の順番を逆にすべし。
「いままでHTMLでやってた××を……」は最後が相応しい。

>>11・>>16-20を組み込むかどうか。

921 ：857：2005/07/18(月) 02:22:57 ID:???

そうですよね、自力で解決できないと身に付かないですね・・。
859さん、組み直しまでしていただいてありがとうございました。
また分からない事があったらここに来ます。

922 ：859：2005/07/18(月) 02:31:55 ID:???

せっかくいいとこまで行ったのに。

http://html-css867.accela.jp/
なるべく>857タンのと変化が激しくないようにしといた。
勉強することだな。これつかって勉強してごらん。またいつでも聞きにきなよ。

http://html-css867.accela.jp/design.css

923 ：859：2005/07/18(月) 02:39:59 ID:???

最後に…
ttp://www.ne.jp/asahi/minazuki/bakera/html/reference/reference
ttp://www.ne.jp/asahi/minazuki/bakera/html/css/reference
使え!

924 ：859：2005/07/18(月) 02:55:18 ID:???

俺はデザインセンスないが、今回はシンプルにしてやったぞ。
ここから先は自分でやるんだ。サイトみて。
ここでも教えてやるよ。背景色変更するにはどうすればいいかとか。

がんがれ！！>>857

925 ：Name_Not_Found：2005/07/18(月) 07:50:56 ID:???

今さら感が強すぎるが
W3C信者にサイトを正しい記述に直して貰うスレ3
ttp://pc8.2ch.net/test/read.cgi/hp/1061741473/
こういうスレッドがあってアップローダも用意されているわけだが

＃「信者」という言葉の是非はともかく

926 ：Name_Not_Found：2005/07/18(月) 08:54:27 ID:???

　ここは初心者が初心者に教えるスレだよな？

927 ：Name_Not_Found：2005/07/18(月) 08:57:17 ID:???

たぶん

928 ：Name_Not_Found：2005/07/18(月) 09:53:54 ID:???

トラブル解決、助けて欲しい、ソース書き換えて、までCSSに関する質問をおまちしております。

929 ：Name_Not_Found：2005/07/18(月) 10:18:51 ID:???

それでまいくろそふとさんはCSSをよく知ってるのですか
IE7が心配で心配で今日もCSSできません