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

このエントリーをはてなブックマークに追加
1S.A Studio ◆Sastuvj1Pg
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/1119682328/l50
2S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:13:17 ID:???
【関聯スレッド】
CSS/DHTMLバグ辞典スレッド 第4版
 http://pc8.2ch.net/test/read.cgi/hp/1078463560/l50
代替スタイルシートに萌え〜
 http://pc8.2ch.net/test/read.cgi/hp/991400015/l50
独自拡張、草案段階のCSSについて語れ
 http://pc8.2ch.net/test/read.cgi/hp/1019912046/l50
* CSS[適用="2ch"]{ イケてるスタイルを:"作れ"}
 http://pc8.2ch.net/test/read.cgi/hp/1038678267/l50
CSSでイケてるデザインサイト 26
http://pc8.2ch.net/test/read.cgi/hp/1120837682/l50

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

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

3S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:14:26 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
4S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:15:34 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
5S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:18:13 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
6S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:19:37 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
7S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:20:32 ID:???
【FAQ】

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
8S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:21:04 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
9S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:21:37 ID:???
【FAQ】
Q10: リンクを新しいウィンドウで開かせるにはどうしたら?
A10: CSSではできません。target属性かJavaScript?でやって下さい。別窓が開くと迷惑に感じる人もありますからなるべくしない、がW3Cの方針です。

Q11: いままでHTMLでやってた××をCSSでやるにはどうすればいい?
A11: 下記をご覧あれ。テーブル・レイアウトは段組のFAQ(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
10S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:22:17 ID:???
【参考】
 IEの position:absolute; のバグを利用した擬似フレーム

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

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

1.標準モードにする
2.body {height:100%; overflow:auto;}
3.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
11S.A Studio ◆Sastuvj1Pg :2005/07/21(木) 15:23:22 ID:???
新テンプレートの>>6は「改行多すぎです」で拒否されるので2つに分割しました。
12教えて下さい:2005/07/21(木) 16:16:07 ID:???
iモード専用(携帯コンテンツ)を作成予定なのですが
CSS等は携帯電話からみても適用されるのでしょうか?
教えて下さい
13Name_Not_Found:2005/07/21(木) 16:51:08 ID:???
>>12
携帯に依る
詳しくは

携帯端末用のWeb制作6
http://pc8.2ch.net/test/read.cgi/hp/1116430358/
14教えて下さい:2005/07/21(木) 17:56:03 ID:???
>>13さん
れすありがとうございます。
そちらのスレで読み直してきます
助かりました!
15Name_Not_Found:2005/07/21(木) 18:36:28 ID:IY3MHYNA
すみません質問です。

a:link{color:lime; text-decoration:none}
a:visit{color:green; text-decoration:none}
a:hover{color:green; text-decoration:underline}
a:active{color:green; text-decoration:underline}

IE6だと思い通りに表示されるのですが、NN7だと a:visit の部分が無視されて、
NNのデフォルトの色(紫)・アンダーライン付きで表示されてしまいます。
どこが間違ってるんでしょうか?
16Name_Not_Found:2005/07/21(木) 18:44:12 ID:???
それは仕様なので仕方ないです。
スタイルシートは IE専門と思ったほうがいいと思います。
17Name_Not_Found:2005/07/21(木) 18:46:16 ID:???
× a:visit
○ a:visited
1815:2005/07/21(木) 18:56:09 ID:IY3MHYNA
>>17
うわ、記述が間違ってたんだ。
直したら、NNでも思い通りの表示になりました。ありがとうございました!
19Name_Not_Found:2005/07/21(木) 19:31:28 ID:V0R8izfh
16は黙ってロムれ
20Name_Not_Found:2005/07/21(木) 19:45:01 ID:???

  夏だねぇ・・・
21Name_Not_Found:2005/07/21(木) 22:00:20 ID:???
質問です。
<select>で、マウスオーバーしてるoptionだけ
背景色を指定するのってできないんでしょうか。
どうしてもデフォルト色が優先されてしまいます。

<select style="background-color:〜">だと、全option部品に色がついちゃうし、
個別のoptionで
onMouseOver="this.style.backgroundColor='〜'"と
onMouseOut="this.style.backgroundColor='#FFFFFF'"
させたりしても、どうあがいてもデフォルト色が優先されてしまうんです。

これって仕様なんでしょうかね。

動確環境は、WinXPのIE6とFireFoxです。

もうJavaScriptとCSSで疑似select部品を作るしかないのかなorz
22Name_Not_Found:2005/07/21(木) 22:01:55 ID:???
わたしの持ってる本には

NN4はCSSが全然だめ。6以降で改善されたが、IEと表示が違うことが多く、
まだまだ実用に堪えない。開発陣には、がんばってもらいたい。

とかいてありますが?
23Name_Not_Found:2005/07/21(木) 22:20:59 ID:???
>>22
日進月歩
24Name_Not_Found:2005/07/21(木) 22:43:51 ID:???
いつの本だよ。
25Name_Not_Found:2005/07/21(木) 23:23:34 ID:???
まだ1年と少し前ですよ。
NN7になっても、IEと同じに表示できない問題点がつらつらと書いてあります。
26Name_Not_Found:2005/07/21(木) 23:26:09 ID:???
それはその本の著者が無知なだけの気が……
多分その「問題点」とやらの9割はIE側に問題があるんだろうな……
27Name_Not_Found:2005/07/21(木) 23:31:44 ID:???
geckooooooooooo
28Name_Not_Found:2005/07/22(金) 00:15:54 ID:???
IE側の問題というのがよくわかりませんね。
MSOfficeに対するOpenOfficeOrgみたいなものですから、
NN側がIE互換になるように努力すべき問題であって、IE側がどうしようと関係ない気が。
29Name_Not_Found:2005/07/22(金) 00:17:05 ID:???
http://css.maxdesign.com.au/index.htm
http://www.stunicholls.myby.co.uk/layouts/index.html みたいな
CSSの利用サンプル又はテンプレートがたくさん置いてあるサイトを教えてください。
30Name_Not_Found:2005/07/22(金) 00:38:05 ID:???
>>1
改訂案はわざと無視したの?

957 :Name_Not_Found:2005/07/19(火) 14:13:01 ID:???
再掲
次スレッドのための改訂案、三つ。

>>6
>A4: まずclear忘れがないかをを確認してください。
→ A4: まずclear忘れがないかを確認してください。

>>8
Q11とQ12の順番を逆にすべし。
「いままでHTMLでやってた××を……」は最後が相応しい。

>>11>>16-20を組み込むかどうか。
31Name_Not_Found:2005/07/22(金) 01:00:02 ID:???
>>30
気付かなかっただけじゃないのかとマジレス
32Name_Not_Found:2005/07/22(金) 01:35:14 ID:???
>>28にマヂレス死体のですが止めときます
33Name_Not_Found:2005/07/22(金) 01:55:42 ID:???
とりあえず>>25のいってる本のタイトルと著者名は知りたい。
34Name_Not_Found:2005/07/22(金) 02:21:53 ID:???
釣りだろ?
ありえない・・・
35Name_Not_Found:2005/07/22(金) 12:31:50 ID:???
なんか CSS の仕様は IE が決めてると思っている奴がいるな…
36Name_Not_Found:2005/07/22(金) 16:23:32 ID:???
>>28
p { float:left; margin-left:10px; }
と書いて左に20pxのマージンができるのはIEだけ!
37Name_Not_Found:2005/07/22(金) 16:32:45 ID:???
IE茸
38Name_Not_Found:2005/07/22(金) 19:47:43 ID:375zrUoL
<div>
<p><img></p>
<table>
</table>
</div>

p{
width:200px;
float:left;
}

table{
width:100%;
}

とやると当然ですが、<table>がめいっぱい広がってフロートすらされないのですが
<table>のwidthを 100% - 200px にするのには、どうすれば良いのでしょうか?
39Name_Not_Found:2005/07/22(金) 19:55:30 ID:???
margin-left
4038:2005/07/22(金) 20:09:51 ID:???
>>39
レスありがとうございます。
table{
width:100%;
margin-left:200px;
}
とやると、200pxぶんはみ出てしまうと思うのですが…。
41Name_Not_Found:2005/07/22(金) 20:33:00 ID:???
>>40
こういう書き方は良くないのかもしれないけど……。
table { display: block; margin-left: 200px }
42ラブ天使:2005/07/22(金) 20:44:31 ID:pCKOcktu
///////
    ///////____________
    ///////  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄| ̄ ̄
   ///////              (~) チリンチリン
   ///////              ノ,,
  ///////     ∧_∧         / ̄ ̄ ̄ ̄ ̄ ̄
  ///////     ( ´∀`)( 厨 ) )) <  夏だなあ〜
 ///////      (つ へへ つ      \______
///////   //△ ヽλ  ) ) 旦
//////  l ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄l
/////    ̄| .| ̄ ̄ ̄ ̄ ̄ ̄ ̄| .| ̄
////     ^^^          ^^^
43Name_Not_Found:2005/07/22(金) 20:48:29 ID:???
>>40-41

<html>
<head>
<style>
p{
width:200px;
float:left;
}
table{
width:100%;
}
</style>
</head>
<body>
<div>
<p><img></p>
<div style="float:right;"><table border="1"><tr><td>table</td><td>table</td></tr></table></div>
</div>
</body>
</html>

IE6以外でどうなるのかしらないけど
44Name_Not_Found:2005/07/22(金) 21:20:27 ID:???
>>28
否、IEがW3Cのガイドラインに従うべき(ry
45S.A Studio ◆Sastuvj1Pg :2005/07/22(金) 21:21:49 ID:???
>>30
スマソ。そこまで見てなかったorz
4638:2005/07/22(金) 21:33:49 ID:???
>>41
<table>を block にしてもはみ出てしまいました。

>>43
やはり、<div>を一個入れてあげるしかないっぽいですね。
ありがとうございました。
47Name_Not_Found:2005/07/22(金) 21:35:33 ID:???
基地外相手にマジレスが多いね。
48Name_Not_Found:2005/07/23(土) 00:44:52 ID:???
無料ホームページスペースを利用してるのですが。
<body>
<div>
コンテンツ
</div>
<cssの広告>
</body>

といた感じに、body閉じ前にcssで記述された広告が入るようになっています。
ここで、NetscapeとFirefoxでみると広告が最上部に表示されてしまいます。
IEではコンテンツが終わった、最下部に表示されるのですが、ネスケと火狐
で正常にさせる事って出来ますか?
49Name_Not_Found:2005/07/23(土) 00:47:18 ID:???
んあ?

ここってネタスレだっけか?
50Name_Not_Found:2005/07/23(土) 00:53:37 ID:???
>>46
ちなみにだがwidth:auto
51Name_Not_Found:2005/07/23(土) 09:43:31 ID:???
<dl>
<dt></dt>
<dd></dd>
</dl>

のdd,dl,dtそれぞれにmargin:0:padding:0;を指定しているんですが、
ddとdtがファイヤーフォックスだと左揃えになりません、
(ddがインデントされたカタチになる)
これをぴったりあわせる方法をご存知のかたがいたらおしえてください
やっぱハックするしかないのでしょうか?
52Name_Not_Found:2005/07/23(土) 10:00:52 ID:???
>>48
ソースを詳しく書きたまえ
53Name_Not_Found:2005/07/23(土) 11:28:40 ID:???
>>48
無料HPを借りている所にお問い合わせください
54Name_Not_Found:2005/07/23(土) 13:16:06 ID:???
>>51 FireFoxでもなるよ。ヘンな指定してないか? CSSソース出して。
55Name_Not_Found:2005/07/23(土) 14:55:52 ID:???
>>54
ありがとうございます、
;が全角になってましたorz
直したら出来ました
5648:2005/07/23(土) 16:19:53 ID:???
>>52
>>53
申し訳ない。自己解決しますた

57Name_Not_Found:2005/07/23(土) 23:42:25 ID:???
朝日comブックの書籍売上ランキング、それまでは3〜4日間隔くらいで
最新のベストセラー状況を発表していたのに、
なぜか突然、12日間以上、更新が止まったままです。
http://book.asahi.com/ranking/

  ァ  ∧_∧ ァ,、
 ,、'` ( ´∀`) ,、'`
  '`  ( ⊃ ⊂)  '`
     ∧_∧ ミ ギャーッハッハッハッ!
 o/⌒(. ;´∀`)つ
  と_)__つノ  ☆ バンバン

アマゾンランキング
http://www.amazon.co.jp/exec/obidos/tg/topsellers/topsellers/-/books/
楽天 ランキング
http://books.rakuten.co.jp/RBOOKS/best.html
http://books.rakuten.co.jp/RBOOKS/best_w.html
Jbooks ランキング
http://www.jbook.co.jp/p/p.aspx/b_rank_sub_50/
58Name_Not_Found:2005/07/23(土) 23:57:49 ID:???
body {
border: 8px solid #000000;
}

のように指定した場合、Firefoxなどでは上手くページ全体を囲うborderを出す事が出来るのですが、
IEの場合のみ表示の仕方が変わり、ウィンドウの内枠に沿ってborderが表示されてしまいます。
(スクロールバーもborderの内側に表示される)

これをIEの場合でも他と同じく表示されるようにするにはどうすればよいですか?
59Name_Not_Found:2005/07/24(日) 00:33:08 ID:???
60Name_Not_Found:2005/07/24(日) 09:51:56 ID:???
文字のサイズを、個人のブラウザの設定に左右されないようにしたいんだけどどうしたらいいですか?
61Name_Not_Found:2005/07/24(日) 11:13:33 ID:???
>>60
emやexではなくpxで指定する。
62Name_Not_Found:2005/07/24(日) 12:15:30 ID:???
ここで61アンカーでクマのAA↓
63Name_Not_Found:2005/07/24(日) 17:12:42 ID:GHtOMLvM
クマー
64Name_Not_Found:2005/07/24(日) 18:47:28 ID:???
position:absolute で
right,left autoしてもセンタリングされないんだね。
margin-right,margin-leftでもされない。
どうしたら、センタリングされますか?
65ラブ天使:2005/07/24(日) 18:54:12 ID:+a13nFAd
| ̄ ̄ ̄ ̄ ̄ ̄ ̄|
 >>64                             |   ギ子様が  |
 自分で考えろタコ                  ,._         |  余裕ブリブリ  |
             _,..----―' 、   ̄ ̄ヽー- 、 |   8ゲトブーン  |
             ヽ ̄7 , , \  、   「 ̄ 7 |_______|
              ヽ/ /_ /ハヽl ヽ、\ V ./      | |
               i il/ ∧   ∧ \ヽ .V         | |
 ___________| ii i        | il |       | |
/                l il |、  (_人_)  | li | ̄ ̄ ̄ ̄ ̄ヽ
ヽ___________ヽN `  _  /リiレ______丿
               |          /           i_i
               |          /
               |         /
               |         /
                /   \    |
                !     ヽ  丿
                入      ヽ
              /  \     )
            /   /丶   /
           /   /  /   /
    ───  |   /   |   丿
    ───  |  /     |  /
    ───  レ       レ
66Name_Not_Found:2005/07/24(日) 19:15:24 ID:???
>>64
position:absolute の意味判ってるか?
67Name_Not_Found:2005/07/24(日) 20:09:17 ID:???
漏れの金ポジはabsoluteですが何か?
6821:2005/07/24(日) 20:17:30 ID:???
どなたか分かりませんか?
>>21
69Name_Not_Found:2005/07/24(日) 20:31:50 ID:V04PtVB/
body {
border: 5px solid #000000;
margin: 0 10%;
}

などのようにしてbody要素にボーダーを引き、左右に余白を開けたとします。
この時、この余白部分に色を付ける事は可能でしょうか?
また、そうするためにはどのようにしたらよいでしょうか?
701/2:2005/07/24(日) 21:08:15 ID:???
以下ソースの3つあるうちの上二つのdtの高さが
windowsIE6.0でだけ思い通りにうまくいきません
標準モードでやってます

アドバイスください
(html)
<form id="login" action="" method="POST">
<dl>
<dt class="t14"><img src="images/0.gif" width="60" height="12" alt="ID" class="h12"></dt>
<dd class="frm"><input type="text" name="mail" value="" class="w170" tabindex="100" accesskey="M"></dd>
<dt class="t14"><img src="images/2.gif" width="60" height="12" alt="パスワード" class="h12"></dt>
<dd class="frm"><input type="password" name="passwd" value="パスワード" class="w170" tabindex="101" accesskey="P"></dd>
<dt><input type="image" name="submit" src="images/1.gif" value="ログイン" alt="ログイン" tabindex="102" accesskey="L" id="bttn"></dt>
<dd id="pw"><A HREF="hoge.html">※トイアワセ</a></dd>
</dl>
</form>
712/2:2005/07/24(日) 21:15:17 ID:???
コピペし忘れたのですが、上のソースは、以下のようにformの上をdivでかこっています
<div><form id="login" action="" method="POST">中略</form></div>


ーーーースタイルシートはります
(css)
div{
width:730px;
height:413px;
position:relative;
background-image:url(../images/bg.jpg)}


#login{
position:absolute;
top:69px;
left:471px;
display:block;
background-image:url(../images/bg2.gif);
background-repeat:no-repeat;
width:210px;
height:178px;
margin:0;
padding:0;
}

続く
723/3:2005/07/24(日) 21:16:19 ID:???

#login dl{margin:23px 0 0 19px;padding:0;width:172px}
#login dl dd{margin:0;padding:0;}
#login dl dt{margin:0;line-height:0px;border:1px solid silver;padding:0;}

#bttn{padding:5px 0 5px 0;height:34px;}

#pw{
text-align:right;
font-size:12px;
line-height:14px;
}
.h12{padding:0 0 2px 0;margin:0;vertical-align;bottom;line-height:0px;border:1px solid black;}
.t14{height:14px}

.w170{
width:170px;
border:1px solid silver;
margin:0 0 6px 0;
height:20px;
font-size:12px;
padding:0;
line-height:0px;
}

.frm{height:26px;
vertical-align:top}
73Name_Not_Found:2005/07/24(日) 21:18:24 ID:???
分母が増えた
7472:2005/07/24(日) 21:26:25 ID:???
2回で終わらせたかったんですが
改行多すぎますとでてしまったので分母を増やしましたorz
ゴメソ
75Name_Not_Found:2005/07/25(月) 09:31:06 ID:???
>>69  おいらこれ好きなんだよな

paddingつかってbody {  に背景色指定汁
76Name_Not_Found:2005/07/25(月) 12:08:12 ID:???
>>60
文字の大きさを固定しても、ディスプレイや OS によって
表示が異なるのは知ってる?
たぶん「小さい文字でオサレさん」をやりたいんだろうけど
そういう独りよがりなページは読んでもらえない。
77Name_Not_Found:2005/07/25(月) 12:17:34 ID:???
>>21
どっちかというとjavascriptスレ向きだけど、optionでイベント取得できたっけ?
selectでイベント取得して、selectedIndexから・・・
まぁ、スレ違い。
78Name_Not_Found:2005/07/25(月) 17:04:25 ID:5XFQimT/
拡張子が.cgiや.phpで表示されるものを.html内でスタイルシートを用いて読み込む方法はありますか?

例えば(下の図)中央の●の部分のテーブルに「ある結果を表示させる.cgiまたは.php」を表示させるにはどのようにしたらよいでしょうか

@@@@@@@@@@
@@@@@@@@@@
@@●●●●●●@@
@@●●●●●●@@
@@●●●●●●@@
@@@@@@@@@@
@@@@@@@@@@
79Name_Not_Found:2005/07/25(月) 17:21:30 ID:???
>>78
質問の内容からして、ぜんぜん理解してないみたいだけど、
やりたいことができるのはSSIかも。
どの道、今は使いこなせるレベルではないと思われ。
80Name_Not_Found:2005/07/25(月) 17:56:30 ID:???
はげどう
81ラブ天使:2005/07/25(月) 18:26:57 ID:OmtHSKW9
>>80
ウルせえ!!!!!!!!!!!!!
ちんちん切ったろか!!!!!!!!!
うるせえ!!!
ちんちん切ったろか!!!!!!!!!!
うるせえ!!!!!!!!
ちんちん切ったろか!!!!!!!!!!!!!!!!!!!!!!ウルせえ!!!!!!!!!!!!!
ちんちん切ったろか!!!!!!!!!
うるせえ!!!
ちんちん切ったろか!!!!!!!!!!
うるせえ!!!!!!!!
ちんちん切ったろか!!!!!!!!!!!!!!!!!!!!!!
ウルせえ!!!!!!!!!!!!!
ちんちん切ったろか!!!!!!!!!
うるせえ!!!
ちんちん切ったろか!!!!!!!!!!
82Name_Not_Found:2005/07/26(火) 20:51:42 ID:???
81のカキコ読んでたらセックルしたくなってきた
83Name_Not_Found:2005/07/26(火) 22:03:00 ID:???
したことないだけだろ
84Name_Not_Found:2005/07/26(火) 22:49:13 ID:???
すんません。教えてください。

<div id="contentA">
<h1>hogehoge</h1>
<p>hogehogehogehogehogehogehogehogehoge</p>
</div>
<div id="contentB">
<h1>foofoofoofoofoofoofo</h1>
<p>fofofofofoooooooooooofofofofofofof</p>
</div>

を、左右に並べて配置するときのCSSって、

#contentA{
width:62%;
float:left;
position:absolute;
left:0;
}
#contentB{
width:38%;
margin-left:62%;
}

でOKだとおもわれるのですが、左右に並んだ形で表示されません。
どこを直せばよいでしょうか。

いろいろ見てみましたが、pxでの指定の例ばかりで、%による指定の例がありませんでしたので
ご質問申し上げます。
85Name_Not_Found:2005/07/26(火) 23:05:35 ID:???
>>84
position の使い方と、absolute がどういう意味かをもう一度確認してみよう。

あとそのやり方だと、MSIEにおいて並ぶブロックの間に埋められない隙間が発生します。
よって、合計が100%を超えてしまい結果として並びません。Bの方を、
margin-left:0;
float:left;

とすれば解決できるかもしれません。
86Name_Not_Found:2005/07/26(火) 23:10:16 ID:???
>>84
position の使い方と、absolute がどういう意味かをもう一度確認してみよう。

あとそのやり方だと、MSIEにおいて並ぶブロックの間に埋められない隙間が発生します。
よって、合計が100%を超えてしまい結果として並びません。Bの方を、
margin-left:0;
float:left;

とすれば解決できるかもしれません。
87Name_Not_Found:2005/07/26(火) 23:19:12 ID:???
>>84
position の使い方と、absolute がどういう意味かをもう一度確認してみよう。

あとそのやり方だと、MSIEにおいて並ぶブロックの間に埋められない隙間が発生します。
よって、合計が100%を超えてしまい結果として並びません。Bの方を、
margin-left:0;
float:left;

とすれば解決できるかもしれません。
88Name_Not_Found:2005/07/27(水) 05:55:33 ID:???
すんません。教えてください。

<div id="contentA">
<h1>hogehoge</h1>
<p>hogehogehogehogehogehogehogehogehoge</p>
</div>
<div id="contentB">
<h1>foofoofoofoofoofoofo</h1>
<p>fofofofofoooooooooooofofofofofofof</p>
</div>

を、左右に並べて配置するときのCSSって、

#contentA{
width:62%;
float:left;
position:absolute;
left:0;
}
#contentB{
width:38%;
margin-left:62%;
}

でOKだとおもわれるのですが、左右に並んだ形で表示されません。
どこを直せばよいでしょうか。

いろいろ見てみましたが、pxでの指定の例ばかりで、%による指定の例がありませんでしたので
ご質問申し上げます。
89Name_Not_Found:2005/07/27(水) 10:16:09 ID:???
http://www1.skz.or.jp/~kusumi/klee/
のサイトのように左右のmarginに色をつけたいのですが、
メインコンテンツをdivでくくって
div.hoge{backaground-color:white;
margin-left:3%;
margin-right:3%;}
body{backgroud-color:black;}
としても、marginについた色が上下にまわりこんでしまいます。
どうすればいいでしょうか?
90Name_Not_Found:2005/07/27(水) 10:27:14 ID:???
>>89
いまいちわかんないけど、
bodyのマージンとかをなんとかしる。
あと、bodyの背景画像のrepeat-yをうまく使うって方法も有る。
91Name_Not_Found:2005/07/27(水) 11:24:31 ID:???
質問いたします。
右側にサイドバーがあるレイアウトの画面を作成しようと思っております。
IEでは全体の背景である白地部分がブラウザの画面下にくっ付いているのですが、
Firefoxで見ると、画面下の白地部分にわずかに隙間ができてしまっています。
CSSの「.back」の「border-width: 0px 5px 0px 5px;」を「border-width: none 5px none 5px;」
にすると白地背景部分はブラウザ画面にくっ付くのですが、
今度はサイドバーの下部分が浮いてしまいます(IE,Firefox共に)。

テーブルレイアウトですが、どなたかご教授下さいませ。

-つづく-
92Name_Not_Found:2005/07/27(水) 11:27:03 ID:???
-上のつづき-

#HTMLのソース
<BODY>
<TABLE width="500" height="100%" cellpadding="0" cellspacing="0" class="back">
<TBODY>
 <TR>
<TD height="100%" align="left">
<TABLE width="800" height="100%" cellpadding="0" cellspacing="0" class="main">
<TBODY>
 <TR>
<TD height="100%" width="580" valign="top"></TD>
<TD height="100%" width="220" class="sidebar" valign="top"></TD>
 </TR>
</TBODY>
</TABLE>
</TD>
 </TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

-つづく-
}
93Name_Not_Found:2005/07/27(水) 11:27:56 ID:???
-上のつづき-

#CSSのソース
BODY {
    margin: 0px 0px 0px 0px;
    text-align: center;
    background-color: #000000;
}

.back {
    margin: 0px auto 0px auto;
    border-width: 0px 5px 0px 5px;
    border-style: solid;
    border-color: #ffffff;
    background-color: #FFFFFF;
}

.main {
    margin: 5px 0px 0px 0px;
}

.sidebar {
    background-color : #FF0000;
}


以上です。
長々と申し訳ないです。
94Name_Not_Found:2005/07/27(水) 15:15:02 ID:???
質問です。
タイトルを表示させる時に、
<div class="form0" id="position0">
<h1><span>タイトル</span></h1>
</div>

(css)
div{

border-color:#dcdcdc;
border-style:solid;
border-width:thin;
padding:20px;
overflow:auto;
position:absolute
}
h1{
font:italic bold 400%/400% cursive;
}
としているのですが、<h>を使うとどうしても回りのスペースが大きくなり、
ボックスを強制的に大きくしてしまうので他のボックスに干渉して困っています。
もう<h>をつかわずに、<p>をつかってフォント指定したほうがいいのでしょうか。
95Name_Not_Found:2005/07/27(水) 15:55:42 ID:???
>>94
クマさんはいま夏休みで知床に行っています。
96Name_Not_Found:2005/07/27(水) 21:44:44 ID:???
>>94
<h1 class="param">タイトル</h1>

h1 {
border: thin solid #dcdcdc;
padding: 20px;
overflow: auto;
position: absolute;
font: italic bold 400%/400% cursive;
}

これではいかんのかと。
97Name_Not_Found:2005/07/27(水) 21:47:59 ID:???
>>96
多分>>94はh1のデフォルトのマージンのことを言っているのでは?
あと、彼の記述をそのまま持ってきたからなんだろうけど、
position: absolute; はいらんよね。
98Name_Not_Found:2005/07/27(水) 21:56:08 ID:???
>>94
<h1>タイトル</h1>

h1 {
margin: 0;
padding: 0;
}

divは多分いらない。
9994ではないけど:2005/07/27(水) 22:07:36 ID:???
>>98
ウワーありがとう!これでHタグが使えるわ

常々、なるべくW3Cに準じてhtml構築したいなと思ってるんだけど、
マージンがブラウザや前後のタグによって表示されたりされなかったりと
扱い辛い印象だったので敬遠してた。
100Name_Not_Found:2005/07/27(水) 22:25:30 ID:???
とりあえず、CSSに

* {
margin: 0; padding: 0;
font-size: 100%; font-weight: normal; font-style: norma;
}

を追加してみろ、と。
プロパティの継承とか一々考えずにスタイル設定できるから、かなり作業が楽になるぞ。
10199:2005/07/27(水) 22:37:38 ID:???
そっかぁ。なるほどんなるほど
マージンかぁ、小一時間マージン調整してみる

なるほどねー。目からうろこ
ページ内リンクでジャンプした時、見だしがギチギチになってしまうのを嫌って
↓こんな風にしてたけど

<br><a name=ここ> </a><br>
<span class="h">みだし</span><br>



<h1 class="h"><a name=ここ>みだし</a></h>

にしてcss上下のマージンとってあげれば<br>も要らないね。スッキリ
なんで今まで気がつかなかったのかorz
102Name_Not_Found:2005/07/28(木) 01:35:51 ID:???
しかしよう <h1><span>タイトル</span></h1>
こんな書き方を >>94はどこで覚えたんだろうか?
103Name_Not_Found:2005/07/28(木) 11:30:44 ID:khp90DRr
すみません、すごく初歩的な質問なのですが、
昨日からどうしてもできないので、良かったら教えて下さい。
問題は、外部スタイルシートの呼び出しです

まず、テキストエディタに
h1 {color:blue;background:yellow}
p {color:red;font-size:1.5em}
と書き、ファイル名をabc.cssと変えます。

次に、HTML Documentに、
<html><head><title>タイトル</title>
<link rel="stylesheet" href="abc.css" type="text/css">
</head><body>
本文
</body></html>
と書きます。
説明では、abc.cssに書かれた指定が、
少なくとも背景が黄色になるのですが、何も起こりません。
入門サイトはいくつか回りましたが、その都度似たような説明があり、
似たような事をやり、結果、何も起こらない事態になってます。
指示通り書いてるつもりなのですが・・どこがおかしいのでしょうか?
104Name_Not_Found:2005/07/28(木) 11:32:48 ID:???
>>103
>どこがおかしいのでしょうか?
CSSのコード。
105Name_Not_Found:2005/07/28(木) 11:33:59 ID:???
>>103
×background:yallow
○background-color:yallow
106Name_Not_Found:2005/07/28(木) 11:34:51 ID:???
うは、自己レス
×yallow
○yellow
107Name_Not_Found:2005/07/28(木) 11:38:31 ID:???
>>104
ありがとうございます。コードですか。
もし良かったら、何を付け足すと反映されるか、
教えていただけないでしょうか?
CSSの方に問題があるのが分かっただけでも、
本当にありがたいのですが・・
108103:2005/07/28(木) 11:40:42 ID:???
>>105>>106
どうもありがとうございます、早速やってみます。
109Name_Not_Found:2005/07/28(木) 11:42:10 ID:ee2stUqA
>>103
>少なくとも背景が黄色になるのですが、何も起こりません。
何もとはスタイルが何も効いていないの?どれか一部ではなく?
それならば、cssfileが読み込めてない可能性が一番高いよ

あとbackground:yellow;は別に問題ないよ。
110Name_Not_Found:2005/07/28(木) 11:45:37 ID:???
本文をp要素でマークアップしていないのが問題と見た。

<p>本文</p>

ってやってみな。
111Name_Not_Found:2005/07/28(木) 11:55:46 ID:???
>>106
×うは、自己レス
 ×yallow
 ○yellow

○うほっ、自己レス
 ×yallow
 ○yellow
112Name_Not_Found:2005/07/28(木) 12:13:36 ID:???
h1 {color:blue;background:yellow}
p {color:red;font-size:1.5em}

のそれぞれの最後に ; を足して、

h1 {color:blue;background:yellow;}
p {color:red;font-size:1.5em;}
113Name_Not_Found:2005/07/28(木) 12:23:27 ID:???
↑的外れ
114Name_Not_Found:2005/07/28(木) 12:26:10 ID:???
>>109
レスありがとうございます。すみません、一部の間違えです。
 <p>本文</p> <h1>レベル1</h1>
を加えたところ「レベル1」の文字が黒いまま、大きくなりました。
でも何故か、他には変化しませんでした。
>>110
申し訳ありません、その通りでした。
昨日はちゃんと作ったんですけど・・
ただ<p>本文</p>は変化が現れないので、
CSSの読み込みがまずいみたいです。
>>112
ありがとうございます、早速試してみます。

全く読み込めていない訳では無いのが分かったので、
少し前進できました。ありがとうございます。
115Name_Not_Found:2005/07/28(木) 12:38:21 ID:???
>>114
><p>本文</p> <h1>レベル1</h1>
>を加えたところ「レベル1」の文字が黒いまま、大きくなりました。
?。h1タグは普通に文字が黒いまま、大きくなるんだよ?CSS適用されてないのでは?

俺はまったく読み込めて無いだけだと思う。
CSSが103の通りだったら100%CSSの記述に間違いないから
116Name_Not_Found:2005/07/28(木) 12:39:54 ID:???
>114
それは読み込まれていないかもしれない。
abc.cssに、

body { background-color: #ff0000; }

って書いてみて。
それでページ全体の背景色が"赤"になるんならいいんだけど。
117Name_Not_Found:2005/07/28(木) 12:46:24 ID:???
外部ファイルじゃなくて、普通に書いて変化があるかどうかから確かめたほうが。
ブラウザの設定いじってスタイルの一部効果を切ってるとかないよね?
118Name_Not_Found:2005/07/28(木) 13:12:51 ID:KooLkwUL
<div id="A">
</div>
<div id="B">
</div>
<div id="C">
</div>

 −−−−−−−
| A |  B  |
|−−|     |
| C |     |
|   |     |
|−−|     |
    |     |
    |−−−|
ずれてると思いますが、こんな感じに段組したいのですが、うまくいきません。
どうすでば良いでしょうか?
119118:2005/07/28(木) 13:15:21 ID:???
ごめんなさい。普通に出来ました。マージンを指定していたのが駄目だった orz
120Name_Not_Found:2005/07/28(木) 13:50:31 ID:???
z-indexって単純にHTMLをレイヤー化するって考えて良いんでしょうか?
ある画像を前面に持っていきたいのですが、他のブロックと被っているところで背景色など指定するとどうしても見えなくなってしまいます。
121Name_Not_Found:2005/07/28(木) 15:17:39 ID:???
>>120
>他のブロックと被っているところで背景色など指定するとどうしても見えなくなってしまいます。
あたりまえじゃん。
122Name_Not_Found:2005/07/28(木) 15:39:33 ID:???
>>121

 ___/
___/
___/

つまりこんな感じに重なっているわけではないという事ですか?
123Name_Not_Found:2005/07/28(木) 15:44:27 ID:???
124Name_Not_Found:2005/07/28(木) 15:50:33 ID:???
<div id="a"><div id="c"><div id="b">
</div></div></div>

#a{position:relative; z-index:3;}
#b{position:relative; z-index:2;}
#c{position:relative; z-index:1;}

こうすれば↓みたいになるってことじゃないんですか?

______________/ ←div#a
____________/ ←div#b
__________/ ←div#c
125Name_Not_Found:2005/07/28(木) 16:43:37 ID:???
質問の仕方が中途半端なんだよ
だからなんだっつーのよ?
126Name_Not_Found:2005/07/28(木) 16:57:21 ID:???
これでdiv#bに背景を指定して、div#cにも背景を指定するとdiv#bが前面にあるわけだから優先されるんですよね?
127Name_Not_Found:2005/07/28(木) 17:02:07 ID:???
は?CSS使わんでも124の通りだったら#bが前面にくるよ?
>>126
ちゃんとソースかきゃいーんだよ
128Name_Not_Found:2005/07/28(木) 17:04:21 ID:???
>>103
> まず、テキストエディタに
> h1 {color:blue;background:yellow}
> p {color:red;font-size:1.5em}
> と書き、ファイル名をabc.cssと変えます。

ファイルの拡張子を表示する設定にしていないで上の作業をすると
ファイルの種類は変わらず「テキストドキュメント」
ファイル名は「abc.css.txt」になると思う。

ファイルの拡張子を表示するには
http://support.microsoft.com/default.aspx?scid=kb;ja;882195
129Name_Not_Found:2005/07/28(木) 17:56:42 ID:???
>>124
よく考えたらならねーよ

cssをどうしようが、

______________/ ←div#b
____________/ ←div#c
__________/ ←div#a

だな
130Name_Not_Found:2005/07/28(木) 17:59:40 ID:???
ちがうちがう

今の無し
131Name_Not_Found:2005/07/28(木) 19:32:53 ID:???
>>122
お前、バカだろ?
132Name_Not_Found:2005/07/28(木) 23:00:33 ID:???
うん
13389:2005/07/28(木) 23:06:22 ID:???
ダメダ・・・
bodyのmarginをいじってもだめだった・・・
背景画像を使うしかないんですかね?
134Name_Not_Found:2005/07/28(木) 23:13:00 ID:???
>>133
body { margin:0; padding:0; }
div { margin: 0 3%; }
を追加しても駄目か。
135Name_Not_Found:2005/07/28(木) 23:26:23 ID:???
>134
できました。
ありがとうございました。
136Name_Not_Found:2005/07/29(金) 00:40:02 ID:???
>>89が2日間悩んでいた事を、5分で解決した>>134に拍手を
137Name_Not_Found:2005/07/29(金) 09:17:06 ID:0W3dGzRk
下のようなテーブルがあります。
<img>のサイズはバラバラで<table>の
場合はちゃんとマトリクス表示されます。

<table border="0">
<tr><td><img></td><td> </td></tr>
<tr><td><img></td><td> </td></tr>
</table>

------------------------------------------------------------
下記のCSSで書いたものは各行を"row"で囲んで
ブロックになっているけど、"right"が上に送り込まれてしまいます。
どうすればtableレイアウトのようにマトリクス表示が
できますでしょうか。

.matrix{
width:100%;
}
.left{
float:left;
margin:40%;
};
.right{
margin:40%;
margin-left;40%
};

<div class="matrix">
<div class="row"><div class="left"><img></div><div class="right"> </div></div>
<div class="row"><div class="left"><img></div><div class="right"> </div></div>
</div>
138Name_Not_Found:2005/07/29(金) 09:30:33 ID:???
久々にdiv厨
「表」として表現すべき内容であれば「表」としてマークアップすればいいんだよな今の
厨はなんでもdivに置き換えればいいと思っているから困る。

突っ込みどころがいろいろあるので困る。
139Name_Not_Found:2005/07/29(金) 09:32:32 ID:???
とりあえず

ヒント: clear
140Name_Not_Found:2005/07/29(金) 09:59:44 ID:0W3dGzRk
表でなくて、表のように形成されている
文章なんですよ。

.row{clear:left;}してみましたけど、だめみたいです
141Name_Not_Found:2005/07/29(金) 10:13:53 ID:Rjq+EINt
.matrix{width:100%;}
.row{clear:left}
.left{float:left}
.right{float: left;}
はい。最低限。
君のmargin指定が意味判らん
142Name_Not_Found:2005/07/29(金) 11:04:33 ID:???
すみません、CSSを初めて使ってみたのですが、
一部分どうしても不具合が出てしまいます

<div>で横幅を指定したスペースにテーブルを
置いているんですが、テーブルのwidthを100%に
しても、何故か右にスペースが余ります。

これの真ん中の部分です
http://www.my-worldmap.com/index.html

ちょっとした隙間なんですが、どうしても
気になってしまいます・・・・
143Name_Not_Found:2005/07/29(金) 12:05:27 ID:vKjPPgb+
どうか教えてください。floatで配置しているのですが、文字組が崩れる
症状が起こりました。float指定しているボックスのheightを2000pxまで
に指定するとキレイに整列します。原因はfloatのボックスにあると思われる
がどうしたら解決できるかわかりません。
誰か助けて!
144Name_Not_Found:2005/07/29(金) 12:34:01 ID:???
>>143
ソースを(問題点だけを抽出して簡潔に)。
145Name_Not_Found:2005/07/29(金) 13:33:45 ID:vKjPPgb+
>>144
すみませんでした。
#extra-col{
float:left;
width:170px;
/*height:2000px;*/
}
#main-col1{
margin:0px 190px;
}
/*contents.css用css*/
#main-col2{
float:left
padding:0px 190px;
}
これでよいですか?
146103:2005/07/29(金) 13:45:35 ID:???
>>115 >>116 >>117
レスありがとうございます。
>>h1タグは普通に文字が黒いまま、大きくなるんだよ?
すみません、赤くなって大きくなるんだと思ってました。
>>CSSが103の通りだったら100%CSSの記述に間違いないから
ここが悩みです。一つの入門サイトなら何かの間違えとも
思えますが、三つ以上回って同じ結果なので、
サイトの説明に根本的な問題があると思えなくなりました。
>>body { background-color: #ff0000; }
赤くなりません。きっと正しい事を書かれていると思うのですが、
結果を出せずごめんなさい。
>>外部ファイルじゃなくて
『スタイルシートで区切り線を太くしてみよう』
という作業を一昨日やって、そちらは正常に表れました。
>>ブラウザの設定
ありがとうございます。考えてみると外部ファイルを
使って作ったのは、漫画喫茶でやっている時ばかりなので、
そうかも知れません。早速家のPCで試してみます。
147103:2005/07/29(金) 13:47:50 ID:???
サイトの説明に問題が無い以上、110さんに指摘してもらったような、
アホみたいなミスを僕がしている予感がどんどんしてきて、
何か、怖くなってきました。
なので質問は一旦中止して、当分基本的な事ばかりやろうと思います。
ただ、知識のある方から『100%CSSの記述に間違いない』
と言ってもらえたのは、本当に助かります。
他の皆さんも、初歩的な質問なのにちゃんと
付き合って下さって、とても感謝しています。
ありがとうございました。

それと、返信が遅くなってすみません。
148Name_Not_Found:2005/07/29(金) 13:48:54 ID:???
情報の小出し乙。
149143:2005/07/29(金) 15:05:26 ID:vKjPPgb+
対処しました。
ボックスを入れ子にすることで、ある程度文字組の崩れを
防ぐことができました。
お騒がせしてすみません。
150Name_Not_Found:2005/07/29(金) 15:15:56 ID:???
>>145
なあ、俺らはキミのサイトのことなーんにも知らなんだよ。
なのにそれだけ見せられてもわからんて。
151142:2005/07/29(金) 16:12:08 ID:???
どなたか >>142 の原因分からないでしょうか?
CSSのタグで必要な部分を教えてもらえれば
書き込みます
152Name_Not_Found:2005/07/29(金) 16:25:56 ID:???
>151
サイト見えない。
空白って・・・まさか、BODYのmargin指定忘れとか言わないよね?
153Name_Not_Found:2005/07/29(金) 16:32:46 ID:Rjq+EINt
>>142,151アドレス
http://www.my-worldmap.com/index.htm
だったぞ↑
まずHTMLソースがおかしすぎ。まずいらない<center>タグがある。さらにそれとじてない。
あとtable内td一個だけでさらにh1タグ一個だけってありえん。tableイラン。もう少しcss勉強しなおせ。
154Name_Not_Found:2005/07/29(金) 16:59:14 ID:Rjq+EINt
↑いやー俺の文意味わかんね。
h1タグのためだけににtableを使ってるのが意味が判らないといいたかった。
h1を入れ子にしてるtableタグをとって下記のCSSを適用させてみて。
h1{
 font-size : large;
 color : #000000;
 text-decoration : bold;
 padding : 3px 1em;
margin : 0;
 border: 1px solid #999;
background-color: #c0c0c0;
}
これで求めてる結果になるはず
155142:2005/07/29(金) 17:27:48 ID:???
>>154
ありがとうございます。
返事遅くなってすみません。

ごめんなさい、CSSはまだまだ勉強中です・・・。

今やってみたんですが、タグがすっきりして感動しました。
しかし相変わらず右側に隙間ができてしまいます。 orz
156142:2005/07/29(金) 17:28:44 ID:???
↑補足
http://www.my-worldmap.com/test.html
>>154 さんの方法を試しました
157Name_Not_Found:2005/07/30(土) 02:26:33 ID:???
XML にて <content:encoded> ... </content:encoded> の部分の表示を、
CSS で消したいのですが、以下の様に指定しても上手くできません。

content:encoded{ display: none; }

どうしたら良いか、誰か教えて頂けないでしょうか。
158Name_Not_Found:2005/07/30(土) 03:43:42 ID:???
>>157
CSS 3 のセレクタに対応していれば | 区切りで選択できる。
使用する前に @namespace で名前空間 URI を指示する。
名前空間 URI は XML 文書の xmlns で指定したものと一致させる。

例えば、XML が
<content:encoded xmlns:content="http://localhost/"> ... </content:encoded>
の場合、CSS は
@namespace content url("http://localhost/");
content|encoded { display: none; }
159Name_Not_Found:2005/07/30(土) 06:18:20 ID:LmdMAvNK
ブラウザのウィンドウ上下いっぱいにボックスを作りたいのですが、うまくいきません。。。

cssに以下を記述して

body {
margin: 0px;
background-color: #000;
}

#box{
display: block;
width:800px;
height: 100%;
background-color: #FFF;
margin: 0px;}
}

htmlには以下を書いているのですが、

<body>
<div align="center">
 <div id="box">
  てすと
 </div>
</div>
</body>

height: 100%;が全然効果ありません。直値(100pxとか)を入れるとその高さになるのですが、
ブラウザの上にはぴったりついているけど、下はスカスカなボックスができます。
パーセンテージにするとボックスが現れなくなります。。。
どうすれば上下に100%の大きさのボックスを作れますか?
宜しくお願いいたします!!m(_ _)m
160Name_Not_Found:2005/07/30(土) 06:27:30 ID:jNY7TT7J
【環境】Win98SE、ブラウザIE6.0
【質問】
1ページ内に複数のテキストエリアがあり、それぞれのデザイン(スクロールバーの色)を
違うものにしたい場合、どのように記述すれば良いですか?
FAQ、まとめサイト、グーグルなどで検索してみたのですが見つかりませんでした。
どうぞよろしくお願いします。
161159:2005/07/30(土) 06:41:35 ID:LmdMAvNK
親要素が無かったです。
自己解決しましたすんませんorz
162Name_Not_Found:2005/07/30(土) 07:46:49 ID:???
>>159
html, body, div {
margin: 0;
padding: 0;
height: 100%;
}
body {
background-color: #000;
}
div {
background-color: #fff;
}
163Name_Not_Found:2005/07/30(土) 10:17:22 ID:???
ブラウザで表示させる画像をプリント時に別の画像になるようにしたいのですが、
何か良い方法はありますか?
164163:2005/07/30(土) 10:17:58 ID:???
すみません。ブラウザはIE6でお願いします。
165Name_Not_Found:2005/07/30(土) 10:58:57 ID:???
<link rel="stylesheet" href="./print.css" type="text/css" media="print" />
166Name_Not_Found:2005/07/30(土) 11:45:44 ID:???
>>165
レス有難うございます。
具体的にどう書けばいいのでしょうか?
または参考になるページをよろしくです。
167Name_Not_Found:2005/07/30(土) 11:49:37 ID:???
自分で調べる気はないのか?
168Name_Not_Found:2005/07/30(土) 12:14:43 ID:???
>>166
CSS media
でぐぐれ。
169Name_Not_Found:2005/07/30(土) 12:18:55 ID:???
参考になるページ >>2 とか >>3 とか >>4 とか。よりどりみどりですな!
170Name_Not_Found:2005/07/30(土) 12:36:08 ID:???
<div id="content">
<div id="block1" class="section"><div id="block3"><span>□</span></div></div>
<div id="block2" class="section">□</div>
</div>

.section {
float: right;
width: 50%;
}
#block1,
#block3 {
position: relative;
}
#block3 span {
position: absolute;
top: 0;
left: 0;
}
#block2 {
float: left;
width: auto;
}
このような状況なんですが、こうするとblock1とblock2が並んで表示されるようになるのですが、IEでは何故だかblock1の幅が明らかにblock2より大きくなってしまいます。何ででしょうか?
171170:2005/07/30(土) 12:36:50 ID:SO3cMO48
と、質問するときはageでしたね。すみません。
172157:2005/07/30(土) 13:17:03 ID:???
>>158
CSS3 が必要になるんですか orz
使いたい環境では現状無理そうですが、とても参考になりました。
ありがとうございました。
173Name_Not_Found:2005/07/30(土) 13:26:04 ID:???
>>170
IE6.0(標準/互換)および、IE5.01で見たが、明らかな幅の違いとやらは確認できず。
というか、ブロックボックス生成されとんのかいな、それ。

単純に"□"の表示位置ということで言えば、Firefox 1.0.6 や Opera 8.01 の
場合と同等の表示結果が得られる。

当方 Windows Me。後だしでMacIEでしたとかいわれても困る。
174170:2005/07/30(土) 13:30:22 ID:SO3cMO48
WinIEだけど、なんでだろう
ちなみに□の部分は実際には文章とかが入ります。
block3には他にも結構長めのパラグラフとか、block2はリスト系がズラっと。

これ関係ありますかね?他に関係ありそうなことは特に無いと思うんだけど・・・contentもfont-sizeとかだけだし
175170:2005/07/30(土) 22:06:04 ID:SO3cMO48
普通に* html #block1 { height: 1%; }で解決しました。
なんかスレストまがいなことやってすみませんですた。
176Name_Not_Found:2005/07/30(土) 23:11:58 ID:eLgbg9Ru
<object>タグを使って、iframeの代わりにHTMLファイルを読み込ませているのですが
WindowsIE6の環境だと、CSSでスクロールバーを消すことが出来ません。

ifram(実際にはobjectだけど)ということを視覚的に認識できないようにスタイルを変更
するにはどうすればいいのでしょうか?

試してみたスタイル
object{
overflow:hidden;
border:0;
margin:0;
padding:0;
}
177Name_Not_Found:2005/07/30(土) 23:44:05 ID:???
>>176
子の HTML (object に読み込まれる側) の CSS で、
html {
overflow: hidden;
}
としたらどうですか?
178176:2005/07/30(土) 23:54:15 ID:???
>>177
読み込まれる側のBODYに overflow:hidden; を指定すると消えました!
ありがとうございます!感謝っ!!
179Name_Not_Found:2005/07/31(日) 06:45:29 ID:???
>>159みて思い出したけど

body {
margig: 0px 0px 0px 0px;
}

ってOperaじゃ反映されないんだよね
180Name_Not_Found:2005/07/31(日) 06:56:59 ID:???
Operaだとbody要素のマージンが最初から0だからな。
181Name_Not_Found:2005/07/31(日) 07:15:08 ID:???
んなこたーない
182Name_Not_Found:2005/07/31(日) 08:52:40 ID:???
margig
183Name_Not_Found:2005/07/31(日) 09:27:55 ID:???
paddingだから。marginは最初から0よ。
184Name_Not_Found:2005/07/31(日) 09:28:07 ID:???
ヽ(`Д´)ノ
185179:2005/07/31(日) 09:32:38 ID:???
>>183(179?)
・・・ほんとだ!↓で行けた

body {
margin: px px px px;
padding: 0px 0px 0px 0px;
}

このスレ見てると思わぬところで勉強なりますわ
>Operaだとbody要素のマージンが最初から0だからな。
こんなことどこのリファレンスにも書いてなかった
186Name_Not_Found:2005/07/31(日) 09:34:24 ID:???
X margin: px
O margin: 0px
187Name_Not_Found:2005/07/31(日) 10:00:39 ID:???
Operaは何かいろんなところで挙動が気持ち悪いから無視している。
Javascriptの解釈も滅茶苦茶だし。
188Name_Not_Found:2005/07/31(日) 13:33:33 ID:???
>>185
それなら
body {margin: 0; padding: 0;}
で済むのに。
189Name_Not_Found:2005/07/31(日) 14:08:41 ID:???
>>188
そうですね。
自分仕様のテンプレそのまま乗せちゃったんで見苦しくてすまそ(上下左右個別に指定することが多い)

全てのbody余白を無効にしたい人は>>188さんのやつでOKです
190Name_Not_Found:2005/07/31(日) 15:07:01 ID:???
いま、段組レイアウトを作成中なんですが、
見事にはまりました。 いくら考えても自力では原因が解らない
現象がありまして、ご質問申し上げます。

コードを書こうかとおもいましたが、長すぎるため、作業中の自己サイトを
晒します。 (作業中のために各ボックスにわかり易い色をつけてあります)

http://tokiwa.kuronowish.com/blosxom.cgi
これのCSSが
http://tokiwa.kuronowish.com/styles/style-sites.css
なんですが

ごらんのように、上部と下部に意図していないスペースが出ています。
(IE6, NN7.1 FireFox で確認)

これの原因がわかりません。

自己サイトを晒しての質問という形で、恐縮ではございますが
どなたか、ご教示願えませんでしょうか?

何卒よろしくお願い申し上げます。
191Name_Not_Found:2005/07/31(日) 15:13:13 ID:???
body {
margin:1% 5% 1% 5%;
↑これは何なの?
192Name_Not_Found:2005/07/31(日) 15:21:20 ID:???
きっとどっかのテンプレを、プロパティの意味もわからないままいじってるんだろう。
すぐ上にあるbodyのmargin,paddingについてのやりとりも思いっきり無視してるし。
193Name_Not_Found:2005/07/31(日) 15:23:32 ID:???
body {
margin:0 5% 0 5%;
↑こうすりゃいけるんじゃね。
194Name_Not_Found:2005/07/31(日) 15:23:55 ID:???
まいったなぁ・・・
195Name_Not_Found:2005/07/31(日) 15:27:53 ID:???
>>190
h1 {
margin: 0;
padding: 0.5em;
}
でいいんじゃないか?
196190:2005/07/31(日) 15:44:23 ID:???
>191
bodyと、<div id="page">の間に top left bottom rightの順で
marginをあけようとしてたのですが、書き方間違ってるのでしょうか。

>193
だめでした。。。。改善されません。元のままです

>195
頂戴したご提案を元に
#baner h1 {
margin: 0;
padding: 0.5em;
}

と追加したところ、解決いたしました。

しかし、なぜこのような挙動になるのでしょう。
後学のためお聞かせ願えれば幸いです。



197Name_Not_Found:2005/07/31(日) 15:46:40 ID:???
0 5%
って書き方でもいいってことじゃないの?
198Name_Not_Found:2005/07/31(日) 16:18:07 ID:???
子供だと思って舐めんなよヽ(`Д´)ノ
199Name_Not_Found:2005/07/31(日) 16:20:31 ID:???
齧ってあげる!!
200Name_Not_Found:2005/07/31(日) 16:25:29 ID:???
かじってあげる!!
201Name_Not_Found:2005/07/31(日) 16:33:44 ID:???
孕ませてあげる!!
202Name_Not_Found:2005/07/31(日) 16:35:11 ID:???
>>196
margin と padding の違いを理解してないんじゃないかい?
CSSのリファレンスに解説が載ってたと思うよ。
203Name_Not_Found:2005/07/31(日) 16:35:25 ID:???
はらませてあげる!!
204Name_Not_Found:2005/07/31(日) 17:09:30 ID:???
ぼくの童貞あげる!!
205Name_Not_Found:2005/07/31(日) 18:18:55 ID:???
お断りします
206Name_Not_Found:2005/07/31(日) 18:22:45 ID:???
おぺらじゃなくても反映されないと思うが
207Name_Not_Found:2005/07/31(日) 18:51:20 ID:???
       ヽ|/
     / ̄ ̄ ̄`ヽ、
    /         ヽ
   /  \,, ,,/    |
   | (●) (●)|||  |
   |  / ̄⌒ ̄ヽ U.|   ・・・・・・・・ゴクリ。
   |  | .l~ ̄~ヽ |   |
   |U ヽ  ̄~ ̄ ノ   |
   |    ̄ ̄ ̄    |
208Name_Not_Found:2005/07/31(日) 19:39:26 ID:IRA+IhTA
<div id="section">

<div id="box1">
テキスト
</div>

<div id="box2">
テキスト
</div>

</div>

#section{
border:1px solid #000000;
}
#box1{
margin-left:210px;
}
#box2{
position:absolute;
top:0;
left:0;
width:200px;
}

とやっときに、#box2が左側に、#box1が右側に段組されるのですが、#box2の高さが
#box1よりも大きかった場合、#sectionのボーダーからはみ出てしまいます。
これを解消する良い方法ありますか?
209Name_Not_Found:2005/07/31(日) 20:13:12 ID:MZhMIOSS
<div id="branding"><!-- branding -->
<h1><a href="<%url>" accesskey="0" title="<%blog_name>"><%blog_name></a></h1>
<p><%introduction></p>
</div><!-- /branding -->

上記のようなbranding属性とH1で囲まれた部分のリンク色を変更するにはどのような記述をすれ
ばいいですか?
210Name_Not_Found:2005/07/31(日) 20:26:36 ID:uzi2AQPd
ご教授ください、スタイルシートを使って画像のギャラリーを作りたいと思っております。

テーブルタグで画像のサムネイルを表示して下段にファイル名を記載し、それを並べていきたいと思っているのですが、
横型スクロールバーを表示させず、ウインドウのサイズで横に並ぶ数を変化させる事は可能でしょうか・・・。

この場合、display:inlineでよろしいのでしょうか・・・よろしくおねがいします。

ttp://u.skr.jp/128/files/13137.png
言葉じゃうまく伝えれないので図にしてみました・・・。
211Name_Not_Found:2005/07/31(日) 20:36:16 ID:???
>>209
すまん branding属性ってなに?
212Name_Not_Found:2005/07/31(日) 20:41:13 ID:???
>>210
並べたい数だけ<td></td>でいいのでは? ってcssじゃないってか?

もちっと基礎を勉強しようぜ。
213Name_Not_Found:2005/07/31(日) 20:43:26 ID:MZhMIOSS
>>211
属性というかIDの事です
brandingは適当に付けた名前です
214Name_Not_Found:2005/07/31(日) 20:45:40 ID:???
勝手に自分語で説明されてもおじさんには解らないんだよ。
215Name_Not_Found:2005/07/31(日) 20:48:20 ID:???
>>209
a に class でも振ってやるよろし
216Name_Not_Found:2005/07/31(日) 20:50:02 ID:???
>>210

<table>
<tr><td><img src="..." alt="..."></td></tr>
<tr><td>ファイル名</td></tr>
</table>

を画像の数だけ書いて、float:left で並べればそれっぽくはなると思う。
が、マークアップとしては table よりは dl のほうが適切かと。
217Name_Not_Found:2005/07/31(日) 20:54:07 ID:???
>>209
属性というのはこの場合 "id" がそれ。 "branding" は id属性の値。
悪いことはいわんから、基礎から勉強やり直してきてください。
218Name_Not_Found:2005/07/31(日) 20:58:22 ID:gV1+tGdd
>>215
classを使わないと無理ですか?

#branding h1 a:link {color: #ffffff;text-decoration: none}
a#branding:link {color: #ffffff;text-decoration: none}
とかやってるんですけど色がリンク色が変わらないんです。
219196:2005/07/31(日) 21:04:39 ID:???
各位
いろいろありがとうございます。

>202
margin=ボックス要素外側の余白
padding=ボックス要素内側の余白
だと思ってました。

で、修正前は、bodyに、marginを設定しておったわけです。

いまだに、なぜ、>196で解決できたかなぞなのです。

ひょっとして、bodyで設定したmarginが、以降のボックス要素でも
引き継がれてるからなのでしょうか?
220210:2005/07/31(日) 21:16:09 ID:uzi2AQPd
>>212
ごめんなさい・・・基礎を固めて出直してきます・・・

>>216
それっぽいのができました!
感動であります!そして最後にclear:floatすればいいわけですね!
ありがとうございました!
221Name_Not_Found:2005/07/31(日) 21:19:21 ID:???
かくして、サムネイル1個のテーブルがずらっと並ぶのでした。
222Name_Not_Found:2005/07/31(日) 21:21:32 ID:???
>スタイルシートを使って画像のギャラリーを作りたい

>かくして、サムネイル1個のテーブルがずらっと並ぶのでした。

   なんと言ったらいいのでしうか? おせーて
223Name_Not_Found:2005/07/31(日) 21:35:40 ID:???
う〜ん
ページ全体とは別に、<div id=test>の中の href属性を持つアンカータグだけ
別のフォント装飾したいときって、
#baner a:link{
color: #FFFFFF;
text-decoration: none;
border-bottom: none;
}
#baner a:visited{
color: #FFFFFF;
text-decoration: none;
border-bottom: none;
}
#baner a:hover{
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px dotted white;
}
#baner a:active{
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px dotted white;
}
としてると、IEでは結果どおりですんですが、
NNやFirefoxでは出ません。 
どうやって回避すりゃいいんでしょうか?
224210:2005/07/31(日) 21:52:13 ID:uzi2AQPd
すみません、さっき質問した者です。

あの・・・一部「段組」にしたい要素が横に並ばない箇所があるんですけど・・・解決策はないでしょうか・・・IE6です・・・mozillaは大丈夫みたいなんですが・・・
225Name_Not_Found:2005/07/31(日) 21:58:29 ID:???
>>223
Firefoxでは予想どうりになりますが?
226Name_Not_Found:2005/07/31(日) 23:50:11 ID:???
どなたか >>208 に答えて頂けないでしょうか orz
227Name_Not_Found:2005/08/01(月) 00:10:35 ID:???
>>7
228Name_Not_Found:2005/08/01(月) 00:48:10 ID:???
>>208
float使えば

>>209
#branding h1 a

>>210
いいんじゃない?
あ、>>216

>>223
てすとなのかばねあなのか?
229208:2005/08/01(月) 03:08:56 ID:???
>>228
フロートを使っても、左側を固定・右側をリキッドというのが出来なくて困っています
230Name_Not_Found:2005/08/01(月) 03:18:09 ID:???
ん?
box1をfloat:rightでできないのか?
231Name_Not_Found:2005/08/01(月) 12:08:34 ID:???
IEって、
font-size: xx-small 
をちゃんと表示できないの?
232Name_Not_Found:2005/08/01(月) 12:22:11 ID:???
他のブラウザより大きく表示(一定のpxに対して)させるらしい
その意味では「ちゃんと表示させてない」と言えなくもないかな
233Name_Not_Found:2005/08/01(月) 12:27:02 ID:???
うーん。 どうみても、IEの xx-small は、「他のより大きく見せる」ではなくて
xx-smallが効いてないように見えるんだがな。
試しに<h1>を、small x-small xx-small にしてみると大きさは
xx-small>>small>>>>>x-small って感じなんだけどな。
234232:2005/08/01(月) 12:35:28 ID:???
>>233
あーそういうことか。いまIEとOperaで試してみたけど
確かにx-smallとxx-smallどちらも殆どかわらんね。特にOperaでは両者の差は全くなかった
235Name_Not_Found:2005/08/01(月) 12:37:27 ID:???
「確かに」っておかしいか
うちでは
x-small=xx-smallだった
236231:2005/08/01(月) 13:01:23 ID:???
自己解決。

small x-small xx-smallって、NN系でしかだめみたい。
相対的に指定したいときは、smaller larger もしくは、%指定してやると、IEでも意図どおり。

勉強になった。&お騒がせしてすいません
237Name_Not_Found:2005/08/01(月) 13:05:22 ID:???
238Name_Not_Found:2005/08/01(月) 16:12:22 ID:???
>>237
そこのページの一番下の
>Windowsで、大きいサイズで綺麗なものは、19ptあるいは25pxの指定の時のようです。
には腹が立った。
239Name_Not_Found:2005/08/01(月) 21:49:44 ID:???
ちっこいフォントはやめてくれ……
240Name_Not_Found:2005/08/01(月) 22:31:20 ID:???
デカ過ぎる本文もやめてくれ・・・○| ̄|_ =3 ブッ
241Name_Not_Found:2005/08/01(月) 22:40:09 ID:???
行間0もきっついぞ
242Name_Not_Found:2005/08/01(月) 22:42:16 ID:tueAzkzj
CSSとかいうやつでFLASHが作れるって聞いてここにきたんですけど教えてください
243Name_Not_Found:2005/08/01(月) 22:50:17 ID:4smAjv3b
バカチョン・クソチョンを支援・擁護する放送を行っているNHKの受信料を支払う気は全くありません。
244名無し:2005/08/01(月) 23:27:52 ID:6hW7/UUw
CSSでFLASHは作れません。
CSSじゃなくJavaでは?
245Name_Not_Found:2005/08/01(月) 23:42:08 ID:???
.FLASH {
width:100%;
}
246Name_Not_Found:2005/08/01(月) 23:54:14 ID:tueAzkzj
>>245
スマソ、ワロタ
247Name_Not_Found:2005/08/02(火) 11:39:23 ID:???
boxの中を縦に分けたいのですが、どうすればよいのでしょうか?
現在は
.box{
margin: 0px;
padding: 0px 3px 3px 3px;
border:1px solid;
}
の中にboxをもう一つ作ろうとしているのですが、
横にしか分けることができません。
すごく基本的な事がわかっていないと思うんですが
右も左もわからないのでどなたかお力添えをよろしくお願いします。
248Name_Not_Found:2005/08/02(火) 11:59:20 ID:???
>>247
「基本的な事がわかっていない」というのなら >>3-4 でどうぞ。
249Name_Not_Found:2005/08/02(火) 12:46:24 ID:???
意味がわからん
箱の中に、半分の大きさの箱を入れたいなら、
.box .box2 {
width:50%;
}
でいいんじゃないか?
てきとーだが
250Name_Not_Found:2005/08/02(火) 13:18:02 ID:bg3rXC9b
レスどうも、247です。
質問の意味がわけわからなくて申し訳ないですm(_ _)m
横にboxを2つ3つと並べたいのですが、それがうまくできません。

どうしたらキレイにbox内部を分けることができるのでしょうか?
251Name_Not_Found:2005/08/02(火) 13:22:53 ID:???
>>250
わからないなら、これつかえ。

http://www.inknoise.com/experimental/layoutomatic.php
252Name_Not_Found:2005/08/02(火) 13:23:48 ID:???
CSS自動生成機。使え!
253Name_Not_Found:2005/08/02(火) 13:38:42 ID:bg3rXC9b
>>251
>>252
即レスどうもありがとうございます。
使ってやってみます。
254Name_Not_Found:2005/08/02(火) 14:52:33 ID:???
1
255143:2005/08/02(火) 15:10:22 ID:60szMTZ/
しつもん。メニューボタンの文字が上にずれてしまってます。
真ん中に寄せたいのですが、どうすれば。
/*メニューボタン部分*/
#navi {margin-right:15px;height:50px;}
#navi ul{margin:5px;}
#navi li{width:130px;float:right;font-size:12px;text-align:center;}
#navi a {height:40px;color:#006633;background-image:url(img/bottun.gif);
background-repeat:no-repeat;display:block;text-decoration:none;
margin-top:10px;padding:-top:5px;}
#navi a:hover {color:#ebe7e1;background-image:url(img/bottun-over.gif);background-repeat:no-repeat;
}
256Name_Not_Found:2005/08/02(火) 15:31:04 ID:???
バーチカルアラインの問題じゃなかろうかね。
257Name_Not_Found:2005/08/02(火) 15:36:01 ID:???
>>255
それのどこにボタンが有るん?
258143:2005/08/02(火) 16:02:41 ID:60szMTZ/
>>257
<div id="navi">
<ul>
<li><a href="***">○○○</a></li>
</ul>
</div>
※ムーバブルのタグも使っているため内容を簡単にしました。
ヘッダの下に横並びするために今のソースになってます。
259Name_Not_Found:2005/08/02(火) 16:13:45 ID:???
lineheight
260143:2005/08/02(火) 16:44:28 ID:60szMTZ/
う〜 うまくいかん。せっかく教えてもらってるのに〜
むう、時間があまりない。17:00になったらパソコンから
離れるヅラ。
261Name_Not_Found:2005/08/02(火) 18:36:52 ID:???
みなさん 宜しくお願いしますm(__)m
サイトをモニターの中央に表示させたい場合はどのようにすれば宜しいのでしょうかm(__)m
262Name_Not_Found:2005/08/02(火) 18:46:27 ID:???
>>261
例。
#box {
  position:absolute;
  width:800px;
  height:600px;
  top:50%;
  left:50%;
  margin-left:-400px;
  margin-top:-300px;
}
263Name_Not_Found:2005/08/02(火) 19:30:55 ID:???
>>261
スレ違いなので、詳しくはJavaScriptスレで聞いてほしいんだけど。

モニタの解像度が縦横のpxで拾えるので、
そこからウィンドウの縦横の大きさを引いて2で割る。
その位置にウィンドウ自体を移動させる。
264Name_Not_Found:2005/08/02(火) 20:32:40 ID:OsVy/1yY
質問です。
画像と文字で
<img src='http://xxxxx.gif' align='left' alt='xxx'>
<br>hogehoge〜〜〜〜<br>
hogeghoge~~~~~<br>
hogehoge~~~~~~<br>

とやって、画像の横にテキストを表示させてますけど

この部分全体(画像とテキスト)をこのままの状態でセンタリングするにはどうしたらいいでしょうか?

よろしくお願いします。

265Name_Not_Found:2005/08/02(火) 21:17:52 ID:???
>>264
<p>画像と文字</p>

p {
width: 適当px;
margin: 適当px auto 適当px auto;
}

とか。
266265:2005/08/02(火) 21:19:07 ID:???
あ、どうせなら、img要素のalignはなしにして、
p {
width: 適当px;
margin: 適当px auto 適当px auto;
}

p img {
float: left;
}

の方が良かったかも。よしなに。
267Name_Not_Found:2005/08/02(火) 21:20:36 ID:???
P {margin:auto}

<P>
<img src='http://xxxxx.gif' align='left' alt='xxx'>
<br>hogehoge〜〜〜〜<br>
hogeghoge~~~~~<br>
hogehoge~~~~~~
</P>
268Name_Not_Found:2005/08/02(火) 22:25:08 ID:UMEsU1bH
スタイルシートを組むときIE、MOZILLA、どちらを優先して作ればよろしいでしょうか。
269264:2005/08/02(火) 22:41:08 ID:???
>>265 >>266 >>267
最初>>267のやり方でやったのですがなぜか左寄せのままでセンタリングにならなかったので
>>266のやり方でやってみたところできました。
みなさん、ありがとうございました。
270Name_Not_Found:2005/08/03(水) 00:04:37 ID:???
>>268
君が好きな方を想定したらええ。でもまぁ、UAを固定して考えるぐらいだったらUAごとにCSSを振り替えてやった方がええかもな。
271Name_Not_Found:2005/08/03(水) 08:14:11 ID:???
んなことできるんだ
272Name_Not_Found:2005/08/03(水) 08:21:25 ID:???
262 有難うございます

263 そうですか そっちにも行ってみます
273Name_Not_Found:2005/08/03(水) 08:48:10 ID:mEP/rU6h
>>2を読んでみたのですが、、、サパーリ。。
質問します。

今までFirefoxで動作確認してきたのですが、IEで表示すると
多少ずれていました。
こちらはIEを見捨てられないのでなんとかしてこのズレを直したいです。
どうすればよいでしょうか?
274Name_Not_Found:2005/08/03(水) 09:03:47 ID:???
>>273
>>3の一番下。テンプレぐらい目を通せ。
275Name_Not_Found:2005/08/03(水) 09:14:45 ID:mEP/rU6h
>274
読んでましたが・。。。
276Name_Not_Found:2005/08/03(水) 09:22:42 ID:???
あ〜言えば こ〜言う
277Name_Not_Found:2005/08/03(水) 10:11:37 ID:???
>>275
ずれると言われてもなぁ・・

極端なこと言えばブラウザによって「ずれ」が全く無い方が不思議だし
漠然としすぎててわからんのよ
ソース貼ってみれば
278Name_Not_Found:2005/08/03(水) 11:22:23 ID:mEP/rU6h
<ul>
  <li>メニュー</li>
   <ul>
    <li><a href="./index.html">ホーム</a></li>
    <li><a href="***.html">ページ2</a></li>
        ………
   </ul>
</ul>
279Name_Not_Found:2005/08/03(水) 11:28:10 ID:mEP/rU6h
これで、CSSの方で

#navigation ul li{
   background: transparent url(img/bg.gif) top left no-repeat;
}

したのですが、Firefoxでは「メニュー」という題名の背景と下のメニューリスト(四角い枠で囲まれている)
が揃っているのですが、IEだと、下のメニューリストが右にずれています。

IE専用のスタイルシートを読み込ますでFAですか?
280Name_Not_Found:2005/08/03(水) 11:46:55 ID:???
そもそもHTMLがinvalidじゃん
281Name_Not_Found:2005/08/03(水) 11:59:06 ID:mEP/rU6h
そうだよね。。。
282Name_Not_Found:2005/08/03(水) 12:12:46 ID:???
なんで「メニュー」っつーのまで<li>に入れてるんだかわからん。
見出し付けりゃいいじゃん。
283Name_Not_Found:2005/08/03(水) 12:15:50 ID:mEP/rU6h
確かに・・・・・・・・・・・・・・orz
284Name_Not_Found:2005/08/03(水) 14:36:23 ID:???





四つのリーグ表を

□□
□□

ってしたくて、それぞれのリーグ表をdiv要素でくくってrelativeでポジション指定したんですが、
もともとリーグ表のあった部分にスペースが開いてしまい困っています。
ページ自体がちょっと縦長なのでrelativeで位置指定したほうがいいかなと思ったんですが
absoluteのほうがいいのでしょうか。その使い分けも教えていただけると幸いです。
285Name_Not_Found:2005/08/03(水) 14:48:20 ID:???
floatではあかんの?
286Name_Not_Found:2005/08/03(水) 16:46:54 ID:???
表はtableを使ってください。
287Name_Not_Found:2005/08/03(水) 17:07:17 ID:???
>>285
こういう場合はfloat使うのが普通なんですか。
なにぶんかたよった知識なもので・・・。

>>286
一応表自体はtableで作ってます。

おふた方どうもです。
floatを調べてわからなかったらまたきます。
288Name_Not_Found:2005/08/03(水) 17:13:56 ID:mEP/rU6h
つ position
289Name_Not_Found:2005/08/03(水) 17:14:20 ID:???
ゴメス、あげちゃった。
290Name_Not_Found:2005/08/03(水) 17:15:04 ID:???
ひとつの表に4つというのは思い浮かばないのだろうか???
291Name_Not_Found:2005/08/03(水) 17:58:43 ID:???
IEで、display:block のバグってありますか?
292Name_Not_Found:2005/08/03(水) 20:57:39 ID:???
http://www13.plala.or.jp/airh/
このサイトのように、fliat:rightする内容を
ソースの一番下に書いて本文の一番左上に表示させるにはどうすればいいのでしょうか?
293Name_Not_Found:2005/08/03(水) 21:28:23 ID:???
エビfliat
294Name_Not_Found:2005/08/03(水) 22:13:29 ID:???
すみません、質問させてください。
段組ではないのですが、下のようなレイアウトで
高さをディスプレイに合わせて自動的に調節するように
できないでしょうか。文字量が足りなくても、多くても、
下マージン0になるようにしたいのですが…。

親要素{height:100%;}
div{height:100%;}

で試してみましたがNNなどでは途中でDIV要素が切れてしまい
うまくいきませんでした。
overflowや画像を使用すればできないこともないのですが、
もう少し他にうまい方法はないかと探しています。
分かる方いらっしゃいましたらぜひともご教示ください。
よろしくお願いします。


| ̄ ̄| ̄ ̄ ̄ ̄| ̄ ̄|
|   |      |   |
|   |      |   | 
|背景| DIV   |背景|  常に上下余白0
|   | 要素  |   |  DIV要素と背景の背景色が異なる
|   |      |   | 
|   |      |   | 
  ̄ ̄  ̄ ̄ ̄ ̄  ̄ ̄ 

295Name_Not_Found:2005/08/03(水) 22:23:14 ID:???
height: auto
296Name_Not_Found:2005/08/03(水) 22:28:40 ID:???
>295
height: autoだと、文字量が足りなかった場合、
下のようになってしまうんです…。


| ̄ ̄| ̄ ̄ ̄ ̄| ̄ ̄| 
|   | DIV   |   |  
|   | 要素  |   |  
|背景|      |背景|  
|   | ̄ ̄ ̄ ̄|   |  
|   | 余白  |   | 
|   |      |   |  
  ̄ ̄  ̄ ̄ ̄ ̄  ̄ ̄  


297Name_Not_Found:2005/08/03(水) 22:35:09 ID:???
weight
298Name_Not_Found:2005/08/03(水) 22:40:46 ID:???
>>294
だいたいそれに合うような背景画像を作るもんだ。
残念ながら今のCSSに「段組」のためのものはないからやむを得ない。
299295:2005/08/03(水) 22:40:59 ID:???
すまん、何が言いたいかワカンネ。それにAAがズレた。
Windowsに切替えるノシ
300Name_Not_Found:2005/08/03(水) 22:46:47 ID:???
だったらmarginすべてautoにしてしまえw
301Name_Not_Found:2005/08/03(水) 22:56:45 ID:???
>298
現状でCSSのみでの表現は不可能ということですね。
う〜ん、残念ですが、画像か何かで手を打ちます。


>299
こちらこそ説明下手で申し訳ないです。
HTMLで組んだ場合、下のソースをIE表示したように
したかったんです。

<body bgcolor="#000000">
<center>
<table bgcolor="#ffffff" width="600" height="100%">
    <tr height="100%">
        <td height="100%">
        テキスト
        </td>
    </tr>
</table>
</center>
</body>


お二方ともご意見をくださいまして、本当にありがとうございました。
302Name_Not_Found:2005/08/03(水) 23:09:11 ID:3I0TjXIz
IE6でカーソルをドラッグして文字を範囲選択するとチカチカしたり関係無いところまで選択されてしまったりする不具合があります。
原因がよく分からないのですが、floatとposition:relativeを多様しているからでしょうか?
このような不具合にあったことがある人いらっしゃいませんか?
303Name_Not_Found:2005/08/03(水) 23:40:56 ID:???
正常です
304Name_Not_Found:2005/08/03(水) 23:53:34 ID:???
CSS で文字をボックス内の縦のセンターに配置するにはどのように
するのでしょうか?
現在はpaddingで中央にくるように調整してます。
305Name_Not_Found:2005/08/04(木) 00:00:37 ID:???
top:50% ???
306302:2005/08/04(木) 00:15:21 ID:V7LBNRsx
これで正常なんですか?
307Name_Not_Found:2005/08/04(木) 00:17:15 ID:???
>>306
IE がうんこなだけ
ソースのせいじゃない

という意味でそれで正常
308Name_Not_Found:2005/08/04(木) 00:17:18 ID:???
例えば200px×200pxのボックス内にテキストを配置した場合、その
テキストが縦の中央にくるような意味なんですが
横はtext-align: center;でセンターにそろうのに
縦のセンターぞろえの指定がわかりません・・・
vertical-align: middle;ではそろわないので・・
他に指定方法があるのでしょうか?
309Name_Not_Found:2005/08/04(木) 01:00:12 ID:???
<200x200のボックス>
<div class=content>テキスト</div>
</200x200のボックス>

div.content {position: absolute; top:50%;}

とか?
310Name_Not_Found:2005/08/04(木) 01:01:27 ID:???
ああでも複数行なら無理だね・・・
311Name_Not_Found:2005/08/04(木) 04:17:19 ID:+x1Wm/E1
こんばんわ、
優先度の高いインラインスタイルでA:hoverを設定したいので↓
<a href="http://www.w3.org/"
style="{color: #900}
:link {background: #ff0}
:visited {background: #fff}
:hover {outline: thin red solid}
:active {background: #00f}">■■■</a>
↑としたのですが全く反応しません。
どのように修正したら良いか教えてください。

あと、インラインスタイルで擬似クラスの書き方とかサンプル有で説明してるサイトなどあれば教えてください。お願いします
312Name_Not_Found:2005/08/04(木) 07:22:39 ID:???
>>308
その手の質問は何度も繰り返されてるから過去ログ嫁。
313Name_Not_Found:2005/08/04(木) 08:06:43 ID:???
>>311
釣れますか?
314311:2005/08/04(木) 11:39:12 ID:???
313>>
釣りのつもりはないのですが...むしろ2ちゃん板は初めて(だったと思う)書込みですし。
...ageてしまったので逆に釣られたのかな?それとも出来ない事なのでしょうか??

サイトによってインラインスタイルは{}使わない。となってたり 使う。となってたり
煮詰まってます。44以前の過去スレ見ようともしましたが『ビューア(通称●)なしでは読めません。』と... orz


315Name_Not_Found:2005/08/04(木) 12:15:57 ID:???
>>314
そもそもstyle属性が使用から消えてしまったぐらいなので、
style要素を使うか、別のファイルに書いてlink要素でインクルードしましょう.
316315:2005/08/04(木) 12:17:50 ID:???
×:使用
○:仕様
317Name_Not_Found:2005/08/04(木) 12:54:00 ID:???
>>311
どこでそんな書き方覚えたんだ?
釣り? と言われても仕方がないだろう

ここ行ってみっちり勉強してきなさい。

  スタイルシート1 - スタイル設定の方法
http://www.kanzaki.com/docs/html/htminfo17.html
318Name_Not_Found:2005/08/04(木) 13:44:24 ID:???
はいはいわろすわろす
319Name_Not_Found:2005/08/04(木) 14:04:03 ID:???
>>318
使い方おかしい。
320311=314:2005/08/04(木) 14:12:32 ID:???
>>317
ありがとうございます。見てきます
>どこでそんな書き方覚えたんだ?
>釣り? と言われても仕方がないだろう
ぅ・ぅ・・・まったく合ってないですか... orz
311はココ↓のサイトからです。

擬似クラスを使って、動的な状態のそれぞれについて、 ソースアンカーにプロパティを
設定する。
http://www.toyfish.net/docs/WD-css-style-attr-20010305.ja.html

タグやCSSは「キッチリ書かれてるもの見て改造した方が覚えるの早いよ」と
教わったのと、文章理解力にはイマイチ自信なくてサンプルに頼る傾向強いので。
321Name_Not_Found:2005/08/04(木) 14:15:38 ID:???
>>311
お前の最大の失態は、外部CSSと、HTMLに直接書くのとを混同してることだ。
322Name_Not_Found:2005/08/04(木) 14:20:15 ID:EHMy1R/J
>>320
これか
>要素に加え、'::first-letter' 擬似要素を使って要素の 1 文字目にもプロパティを 設定する。
>この場合は大括弧 ({...}) が必要になる点に注意してください。

<p style="{color: #090; line-height: 1.2}
  ::first-letter {color: #900}">...</p>
323Name_Not_Found:2005/08/04(木) 14:48:08 ID:???
>>320
ワーキングドラフトは草案なので、一部の先行実装をのぞいて、そのまま使うのは
まだ見送った方がいいです。
勧告レベルでも未実装・誤実装が多いのが現状。
324Name_Not_Found:2005/08/04(木) 20:04:21 ID:???
>>320

!important

これでおっけ
325Name_Not_Found:2005/08/04(木) 21:06:09 ID:???
>>320
w3cって横の連携が無いっていうけど本当だな。
そのWDではいろんなxml応用言語がstyle属性をサポートする事を勧める
とか言っておいて、
かたや、XHTMLからは消してるしな。
SVGなんかはcssを採用した事自体が間違いだったとか言い出す始末。
326Name_Not_Found:2005/08/05(金) 10:50:02 ID:???
<div id="block1">
<h1>hogehoge</h1>
<div id="block2"><div id="block3">
<div id="main"></div>
<div id="sub"></div>
</div></div>
</div>

#block1 { position:relative; margin:0 auto;
327326:2005/08/05(金) 10:59:32 ID:gcXc9dJx
ごめん、途中で投稿しちゃった
それと質問なんでage
CSSの部分から続き

#block1 { position:relative; margin:0 auto;}
h1 { height:100px position:relative; }
#block2 { float:right; width:100%; margin:0 0 0 -200px; }
#block3 { position:relative; margin:0 0 0 200px; }
#main { margin:0; padding:0; }
#sub {float:left; position:relative; z-index:1; }
* html #block2, * html #block3, * html #sub { height:1%; }

こんな感じなんだけど、IE6で見ると#block2以下の要素が全てはみ出してh1に被ってしまう。
ウィンドウのサイズを少しでも変えるとすぐ直って、それからは全画面に表示にしても大丈夫なんだけど、
更新したり新しくページを開いたりすると必ずこうなる。

他には特に問題になりそうなところ無いんだけど、誰か原因わかりますか?
328326:2005/08/05(金) 11:00:36 ID:gcXc9dJx
一箇所間違いがあった
追加で、#sub { width: 180px; }
329Name_Not_Found:2005/08/05(金) 11:06:53 ID:???
>>326
position: relativeの祟りだ。
330Name_Not_Found:2005/08/05(金) 11:20:05 ID:???
なんでもいいけど float:right; width:100%; には笑った。
331326:2005/08/05(金) 11:39:19 ID:gcXc9dJx
やっぱposition:relative;のせいか(´・ω・`)
でもこれ外したらIEで酷いことになるし・・・

いったい全体どうなってんだかワケワカメ
332Name_Not_Found:2005/08/05(金) 12:06:33 ID:???
つかひどいCSSだから、ちょっと勉強しなおした方がよいかと。
333326:2005/08/05(金) 12:28:24 ID:gcXc9dJx
どの辺りが酷いの?
334332じゃないけど:2005/08/05(金) 12:43:42 ID:???
326が省いた部分も含めて全体見てからじゃないと断定はできないけど、
「なんでこんな指定してんの?」って思う部分が多々ある。
それこそ330の言うあたりとかも。
335326:2005/08/05(金) 13:39:27 ID:gcXc9dJx
ああ、>>326のソース自体が間違ってるやorz

<div id="block1">
<h1>hogehoge</h1>
<div id="block2"><div id="block3">
<div id="main"></div>
</div></div>
<div id="sub"></div>
</div>

実際はこんな感じですた
それとなんとか問題は解決したぽ
またposition:relative;でw
336Name_Not_Found:2005/08/05(金) 13:48:22 ID:???
好きにしとけ
337Name_Not_Found:2005/08/05(金) 13:54:04 ID:???
むしろdiv厨?
338Name_Not_Found:2005/08/05(金) 13:59:27 ID:???
div厨の定義ってなんだ?
339Name_Not_Found:2005/08/05(金) 14:00:35 ID:???
>>338
5タグ中、2タグがdivならdiv厨
340Name_Not_Found:2005/08/05(金) 16:15:02 ID:???
<div id="main">
<h1>コンテンツ1</h1>
<p>コンテンツ1の本文</p>
</div>

<div id="navi">
<ul>
<li>コンテンツ1(以外は製作中です)</li>
</ul>
</div>



おしい。あと一つでおれもdiv厨になれた。
341Name_Not_Found:2005/08/05(金) 16:33:30 ID:???
span使うか・・・・・
342Name_Not_Found:2005/08/05(金) 16:37:46 ID:???
<div id="body">
<div id="header"><div id="title"></div></div>
<div id="main"><div id="contents"></div></div>
<div id="navi"><div id="menu"></div></div>
<div id="footer"><div id="copyright"></div></div>
</div>
343Name_Not_Found:2005/08/05(金) 17:18:01 ID:???
<dl></dl>はまじでオススメかと思う。
344Name_Not_Found:2005/08/05(金) 18:26:57 ID:???
こんなかんじのCSSの文を書いてあるサイトありませんか?
http://nijibox.ohflip.com/futabafiles/001/src/sa27651.jpg
345Name_Not_Found:2005/08/05(金) 19:07:43 ID:???
>>344
上から順にやっていけばそんなに難しくないよ、そのレイアウトなら。
結構入門つか練習向きだからやってみれ。
346Name_Not_Found:2005/08/05(金) 19:11:12 ID:???
>>345
そうですか。
では、勉強してみます。。。ども。
347Name_Not_Found:2005/08/05(金) 19:19:05 ID:???
1ページに<div>100個使ってる僕はヘタレですか?

昔は気にしてたんだけどね、どうでもいいやって感じになりました

お前ら!もったいぶらず使えよ
348Name_Not_Found:2005/08/05(金) 20:47:52 ID:???
流石に100個はどうかと思う。
使い方によるのかもしれんが。
349Name_Not_Found:2005/08/05(金) 21:42:08 ID:???
divとaとimgにcssだけあれば、あと何もいらないも〜ん。
ただしいhtmlとかバカじゃねーのって感じ?
350Name_Not_Found:2005/08/05(金) 21:43:20 ID:???
>>347
もったいぶってるんじゃなくて、普通に使う必要がないから
使ってないだけだが。
<div></div>なんかページに1,2組あれば十分立派なレイアウトが出来る。
351Name_Not_Found:2005/08/05(金) 22:17:35 ID:???
釣り乙
352Name_Not_Found:2005/08/05(金) 23:08:16 ID:???
レイアウトはdivなんか一組も必要ない
ちゃんと見られるデザイン組むならdivは必須だが
353Name_Not_Found:2005/08/05(金) 23:37:18 ID:???
>>352
日本人ならちゃんと意味の解る言葉をしゃべって下さい。
ボビーじゃあるまいし
354Name_Not_Found:2005/08/06(土) 02:53:09 ID:???
ttp://watermark.seesaa.net/article/5658619.html

ここの最後の数字を得ることができる文法はどんなものがありますか?
よろしくおねがいします。
355Name_Not_Found:2005/08/06(土) 06:13:30 ID:???
>>354
意味不明。
ふんいき的にはCSSとは関係なさげ。
とりあえず日本語の勉強からやり直しを推奨。
356Name_Not_Found:2005/08/06(土) 13:59:59 ID:???
>>355
言葉が不自由ですみません。
seesaaブログ何ですが、「ttp://watermark.seesaa.net/article/5658619.html
最後のhtml前の数字を導きだすことができるコマンドはありませんか?
お願いします。
357Name_Not_Found:2005/08/06(土) 15:41:41 ID:???
CSSにはコマンドなど有りません。

スレ違いでしょ?
358Name_Not_Found:2005/08/06(土) 16:14:09 ID:???
>>357
そうですか。他の所で奇異的舞うs
ありがとうございました。
359Name_Not_Found:2005/08/06(土) 16:47:12 ID:???
奇異的マウス
360Name_Not_Found:2005/08/06(土) 19:07:38 ID:???
ここは外国からの方が多いインターネットですね。
361Name_Not_Found:2005/08/06(土) 19:53:59 ID:???
html,body{
height: 100%;
text-align: center;
}
#wrapper{
width: 705px;
height: 100%;
margin: 0 auto;
text-align: left;
background-color: #FFFFFF;
}


画面下端まで背景色の白色が続くようにしたいと思い、
テンプレの「height: n%;の正しい仕様」を読んで上記のように記述したのですが
firefoxで観覧した場合、あくまでもウィンドウサイズの大きさが100%の基準になってしまい
背景色が途中で切れてしまいます。

これらの症状を回避する方法を教えていただけないでしょうか。
362Name_Not_Found:2005/08/06(土) 20:53:54 ID:???
>>294,298
363Name_Not_Found:2005/08/07(日) 12:14:23 ID:???
質問

divで(ry
364Name_Not_Found:2005/08/07(日) 15:03:31 ID:/3magT4W
見出しを利用すると、その見出しの上下によくわからない余白ができるのですが、
どうしたらその余白を消せますか?
普通の文を書くとページの上ぴったりにくっつくのですけど、見出しになると
にょきっと間が開いてしまうのです
365Name_Not_Found:2005/08/07(日) 15:10:54 ID:???
>>364
h*<margin: *;>
366364:2005/08/07(日) 15:23:53 ID:???
>>365
単純な一行で…
ありがとうございました!!
367Name_Not_Found:2005/08/07(日) 16:33:54 ID:???
背景を前面に持ってくるにはどうしたらいいんでしょうか?
368Name_Not_Found:2005/08/07(日) 16:43:19 ID:???
すみません>>361分かる方いないでしょうか
369Name_Not_Found:2005/08/07(日) 16:50:23 ID:???
>>368
* {
  margin:0;
  padding:0;
}
370Name_Not_Found:2005/08/07(日) 19:01:57 ID:???
>>368
だからこれ >>362
371367:2005/08/07(日) 22:19:43 ID:???
ムリなんでしょうか?
372Name_Not_Found:2005/08/07(日) 22:31:42 ID:???
>>371
質問の意味がイマイチよくわかりません
373Name_Not_Found:2005/08/07(日) 22:55:07 ID:???
背景を前面って

どこの背景を 何より前に置きたいのか
それを言ってくれ

374Name_Not_Found:2005/08/07(日) 23:01:58 ID:???
言葉足らずですみません。
ブログで右サイドバーや左サイドバーに画像がかぶっている奴がありました。
それを作りたいと思った私は、背景に絵を描いて、あと見えなくなってしまう部分を透明に
したら作りたいようなブログができると考えました。
考え方が間違っているのでしょうか?前見たブログを少し探してみます。
375Name_Not_Found:2005/08/07(日) 23:03:14 ID:???
>>367
Z座標の事かしら
376Name_Not_Found:2005/08/07(日) 23:13:30 ID:???
背景は背面にあるから背景と言うんです
377Name_Not_Found:2005/08/07(日) 23:13:54 ID:???
ブラウザはNetscape4.8です
378367:2005/08/07(日) 23:19:13 ID:???
>>376
そうですね。なんといったらいいんでしょうか?

>>375
http://joshuaink.com/のサイトのようにしたいです
こんなにかっこよく作れる力も何も無いですが、ただこのサイトみたいに
かぶらせる仕方を教えて欲しいです。

>>377
IE7だったと思います。
379Name_Not_Found:2005/08/07(日) 23:41:59 ID:???
>>378
こういうのやるには、本当に透過PNGを使ってセル画のように重ねるか、透過っぽく見える画像をつくって固定配置する方法があります。
どっちにしろ使う画像自体が大きいので、実用性も低くて自己満足程度にしかなりませんが、どうしてもやりたいのなら本を買うなりググるなり、テンプレにあるサイトを見るなりしてください。
380Name_Not_Found:2005/08/07(日) 23:47:37 ID:???
そうですか。ありがとうございましか。
381Name_Not_Found:2005/08/07(日) 23:49:35 ID:???
>>367
ここのは別に背景が記事部分に被さっているわけではなく、
そう見えるように記事部分の背景を作っているだけかと。
ホレ。ttp://joshuaink.com/flowers_candy/main_content.png
382Name_Not_Found:2005/08/08(月) 04:20:29 ID:???
>>345
アレからやってみたのですが…
よければアレにあった解説サイトをお願いします。
383Name_Not_Found:2005/08/08(月) 07:11:39 ID:???
>>377
いい加減、最近のブラウザ使った方がいいと思う。
384Name_Not_Found:2005/08/08(月) 09:34:32 ID:VDTgentT
UAごとに振り分けられるらしいんですが、詳しく解説してるWebサイトご存じでしたら、お教えくださいorz
385Name_Not_Found:2005/08/08(月) 10:23:22 ID:???
ありません
386Name_Not_Found:2005/08/08(月) 11:09:34 ID:???
>>382
黄・緑・青のブロックをdivでひとまとめにするとわかりやすいかも。
387Name_Not_Found:2005/08/08(月) 11:25:32 ID:VDTgentT
>>385
そこをどうかおねがいしますorz
388Name_Not_Found:2005/08/08(月) 13:04:24 ID:???
画像をインラインで並べたいと思っています。
ソースを下記のようにしたのですが、画像と画像の間にスペースが
空いてしまいます。どうしたらいいでしょうか?(どのブラウザでもなります)
■HTML
<div id="navi"><ul>
<li><img src="test.gif" width"50"height"50"></li>
<li><img src="test.gif" width"50"height"50"></li>
</ul>
</div>

■CSS
div#navi {
padding: 0px;
margin: 0px;
text-align: left;
}
div#navi ul{
margin: 0px;
padding: 0px;
}
div#navi li {
list-style-type: none;
display: inline;
}
389Name_Not_Found:2005/08/08(月) 13:08:32 ID:???
#navi li {
list-style-type: none;
display: inline;
margin:0;
padding:0;
}

じゃないかな。
試してないからわからないけどね。
390Name_Not_Found:2005/08/08(月) 13:38:58 ID:???
>>388
<ul
><li>なかみ</li
><li>なかみ</li
></ul>

隙間の犯人は改行コード。
391Name_Not_Found:2005/08/08(月) 13:39:43 ID:???
犯人って言い方はおかしかった。
実体、のほうがしっくり。
392Name_Not_Found:2005/08/08(月) 14:33:47 ID:???
img のmarginも0にしてカットしないと。
393Name_Not_Found:2005/08/08(月) 15:03:20 ID:???
>>386
またやってみます。ども。
394Name_Not_Found:2005/08/08(月) 17:50:57 ID:CoMCVpkI
position: absolute;にて要素を重ねました。
z-indexをそれぞれの要素に指定してみても、まったく反映されません。
どうすればいいのか教えてください。

 DIV 1
 DIV 2

という順番で記述しました。現状、DIV 1 の上にDIV 2が覆い被さって、1を隠しています。
これを、2の上に1が重なるようにしたいです。

1にz-index: 2; として、2には、z-index: 1; を指定してみましたが反映されませんでした。
(使い方があってるのかも不安です)

おねがいします
395Name_Not_Found:2005/08/08(月) 18:01:56 ID:???
ここの過去ログみたいんですが人大杉で見れないみたいです
専用ブラウザでも見る方法がわかりません・・・
どうしたらいいのんでしょう
396Name_Not_Found:2005/08/08(月) 18:29:57 ID:???
リンクの下線を破線に指定しているのですが画像にリンクを張った時にも、画像の下に破線が表示されてしまいます。画像のみ下線を解除するにはどのような方法があるのでしょうか?

a:link {
text-decoration: none;
color:#FF9200;
border-style: dashed;
border-width: 1px;
border-color:#FF9200;
border-top: none;
border-left: none;
border-right: none;
}
a:visited {
text-decoration: none;
color:#DBB6AA;
border-style: dashed;
border-width: 1px;
border-color:#FF9200;
border-top: none;
border-left: none;
border-right: none;
}
a:hover {
text-decoration: none;
color:#DB6D00;
border-style: dashed;
border-width: 1px;
border-color:#FF9200;
border-top: none;
border-left: none;
border-right: none;
}
397Name_Not_Found:2005/08/08(月) 18:55:34 ID:VDTgentT
img{ border: none}

??
398396:2005/08/08(月) 21:27:38 ID:???
>>397
ええと、私へのレスでしょうか。
そのタグを挿入してみたのだけれども、うまくいきません…
>>8の一番下の方法もダメでした…
399Name_Not_Found:2005/08/08(月) 21:41:51 ID:???
>>398
現行のUAではCSS2の絞り込みに対応してないから、
imgにさらに別の親要素(div とか pとか)で別のクラスを指定して、
p.**** a:link...
とかで指定するとかどうだろう?

h2 ほにゃらら h2
p
ほげほげ
p class="****"
a 画像 /a
/p
ほにゃほにゃ
/p
こんな感じ。
400396:2005/08/08(月) 22:18:18 ID:???
>>399
ススススイマセン…せっかくご教授くださっているのに
おっしゃっているのことがあまりよく理解できず…お恥ずかしい。

ですが、クラス指定ということをすればいいのだな、ということは分かったので下のように記述を追加して

P.クラス名 a:link{
border-style: none;
}
P.クラス名 a:visited{
border-style: none;
}
P.クラス名 a:hover{
border-style: none;
}

クラス指定を入れたPで画像を囲んで解決しました。
ありがとうございます、助かりました!
401Name_Not_Found:2005/08/09(火) 01:14:08 ID:MhLyXefI
すみません。質問です。
CSSでリンクを貼った箇所のスタイルが読み込まれなくなりました。
CSSのソースは
.text{font-size:14; font-werght:bold; line-heght:14px;}
でHTMLの方では
<td nowrap class=".text"><font color="#1b3670">
<storng>hoge</strong></font></a></td>
引継で他の人が作ったCSSなんです。
会社がウィンドウズXPでIEのヴァージョンは多分6だと思います。
で、今日家のMacでCSS書いてちゃんと表示されました。
以下CSSのソース。
<style type="text/css">
.navigation a:link{
font-size:24px;
color:"#1b3670";
}
</style>
HTMLのソース
<td class="navigation">
<a href="a.html">てすと</a></td>
これだとちゃんと表示されたんです。あとDream Weaverを使ってて表示が
おかしくなったんですが関係ありますか?どなたか分かる方レス下さい。
402Name_Not_Found:2005/08/09(火) 01:17:58 ID:MhLyXefI
すみません。ソースに間違いがありました。
<td nowrap class=".text"><a href="hoge.html>
<font color="#1b3670">
<storng>hoge</strong></font></a></td> です。
403Name_Not_Found:2005/08/09(火) 01:21:41 ID:???
>>401,402
言っている意味がさっぱりわかりません。
そのソースだとCSSを使う意味が全くないし。
404Name_Not_Found:2005/08/09(火) 01:48:04 ID:MhLyXefI
あっ、すみません。
要は前の人が作ったCSSを適用した部分にリンクを貼ったら
スタイルが壊れてしまったって事です。
だけど家で実験してみたら上手くいったんです。
わかりにくいですか?すみません。
405Name_Not_Found:2005/08/09(火) 02:13:50 ID:???
>>404
要は元のお寒いソースをあんたが手直ししたってことでしょ?
下ので方向性はあってるから、そのままa:linkとa:visitedとa:hoverとa:active
を指定してやれば済むのでは?
.navigation a:link {...}
.navigation a:visited {...}
.navigation a:hover {...}
.navigation a:active {...}
navigationの前にtdつけてもいいしさ。
td.navigation
まさかa:visitedを指定せずに訪問済みリンクを見て、
崩れてるとか騒いでるんじゃないよね?
406Name_Not_Found:2005/08/09(火) 02:47:53 ID:???
>まさかa:visitedを指定せずに訪問済みリンクを見て、
崩れてるとか騒いでるんじゃないよね?

あっ、違いますw 参考になりました。どうもありがとうございます。
407Name_Not_Found:2005/08/09(火) 11:30:58 ID:lfPMP2Yr
ブラウザごとに違う解釈を解消できるように
>>100 のように指定し、
それぞれのプロパティのマージンやパディングを指定したいのです。

ブラウザの持つデフォルトの値の一覧をどこかで見たような気がするのですが
「ブラウザ」「デフォルト」「初期値」「値」「マージン」「CSS」等で検索しても
見つかりません。

ご存知のかたいらっしゃいませんでしょうか?
408Name_Not_Found:2005/08/09(火) 12:18:27 ID:???
> ブラウザの持つデフォルトの値
ってのがよく分らんけど。
ttp://www5e.biglobe.ne.jp/~access_r/hp/css/css_property_table.html
ttp://www.stylesheet-stylebook.com/wiki/index.php?CSS%C1%E1%B8%AB%C9%BD
こんなの?
409Name_Not_Found:2005/08/09(火) 13:13:29 ID:???
410408:2005/08/09(火) 14:00:12 ID:???
>409
あぁ、そっか。
自分、暑さでボケてた。 スマソ

部屋にクーラー欲しい... orz
411Name_Not_Found:2005/08/10(水) 09:23:01 ID:???
右側にサイドバーがあるレイアウトの画面を作成しようと思っております。
IEでは全体の背景である白地部分がブラウザの画面下にくっ付いているのですが、
Firefoxで見ると、画面下の白地部分にわずかに隙間ができてしまっています。
CSSの「.back」の「border-width: 0px 5px 0px 5px;」を「border-width: none 5px none 5px;」
にすると白地背景部分はブラウザ画面にくっ付くのですが、
今度はサイドバーの下部分が浮いてしまいます(IE,Firefox共に)。

テーブルレイアウトですが、どなたかご教授下さいませ。

-つづく-
412411:2005/08/10(水) 09:23:47 ID:???
-上のつづき-

#HTMLのソース
<BODY>
<TABLE width="500" height="100%" cellpadding="0" cellspacing="0" class="back">
<TBODY>
 <TR>
<TD height="100%" align="left">
<TABLE width="800" height="100%" cellpadding="0" cellspacing="0" class="main">
<TBODY>
 <TR>
<TD height="100%" width="580" valign="top"></TD>
<TD height="100%" width="220" class="sidebar" valign="top"></TD>
 </TR>
</TBODY>
</TABLE>
</TD>
 </TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

-つづく-
413411:2005/08/10(水) 09:26:27 ID:???
-上のつづき-

#CSSのソース
BODY {
    margin: 0px 0px 0px 0px;
    text-align: center;
    background-color: #000000;
}

.back {
    margin: 0px auto 0px auto;
    border-width: 0px 5px 0px 5px;
    border-style: solid;
    border-color: #ffffff;
    background-color: #FFFFFF;
}

.main {
    margin: 5px 0px 0px 0px;
}

.sidebar {
    background-color : #FF0000;
}


以上です。
ご教授下さい。
414Name_Not_Found:2005/08/10(水) 09:47:16 ID:???
>>411
何で書いたらこんなソースになるんだろ?

TABLEにデフォでmargin付いてるの知っているよな?

widthもおかしいぞ
415Name_Not_Found:2005/08/10(水) 10:50:19 ID:dgu1HmJx
>>414
すいません。
widthの指定おかしかったです。
416Name_Not_Found:2005/08/10(水) 11:00:19 ID:???
table {margin:0} とやったらどうなる?

オーサリング何使ってるの?
417411:2005/08/10(水) 11:28:49 ID:???
>>416

オーサリングは使ってなく、エディタに書いてブラウザで確認して・・・
って方法で作成しております・・・。
418407:2005/08/10(水) 12:14:27 ID:???
>>409
あー、これ! これです!
>>100のようにしたあとp要素やらul要素やらをどうしたもんかと悩んでました。

>>408さん共々、ありがとうございました。

419Name_Not_Found:2005/08/10(水) 12:35:14 ID:???

もうずっと人大杉
420408:2005/08/10(水) 14:05:27 ID:???
>>418
ん?あれ?

>>100 はデフォルトのスタイルシートを殺してるんだから
>>407
> ブラウザの持つデフォルトの値の一覧
よりかは…って説明するつもりだたよ orz
二重にボケてたよ orz
暑さで脳ミソ溶けてきたよ...orz
421Name_Not_Found:2005/08/10(水) 18:17:44 ID:iF7Nwlvu
Cellspacing="0" Cellpadding="0"

は、スタイルシートで表記できないのでしょうか?
422Name_Not_Found:2005/08/10(水) 18:30:08 ID:???
HTMLスレで以下の質問をしました。
http://pc8.2ch.net/test/read.cgi/hp/1122350593/950
http://pc8.2ch.net/test/read.cgi/hp/1122350593/952

でもCSSスレで説明してくれるとのことで、誘導されてきました。
423Name_Not_Found:2005/08/10(水) 18:33:13 ID:???
>>421
td th {
padding:0px;
margin:0px;
}
424Name_Not_Found:2005/08/10(水) 18:34:19 ID:???
>>422
いらっしゃい。
次からはリンクじゃなくて内容を写そうな。
質問者に余計な手間をかけちゃいけないから。

.hoge {
margin-left: auto;
margin-right: auto;
}

<div class="hoge">
いろいろ。pとリストとか
</div>

で、要素がセンタリングされるが中身はセンタリングされない。
こういう事をしたかったの?
425Name_Not_Found:2005/08/10(水) 18:41:31 ID:???
>>424
すみません。これからはちゃんと本文を写します。

その通りのソースにしてみたんですが、要素自体も
左揃えになってしまいました・・・・
426Name_Not_Found:2005/08/10(水) 18:44:18 ID:???
>>425
悪いが全く意味が解らん。
もう一度最初から具体的に何をしたいのか教えてくれ。
427Name_Not_Found:2005/08/10(水) 18:47:00 ID:???
このスレの人でマルチカラムやってる人は
CSSでやってる?それともTABLE?
CSSでやるとネスケで観ると形崩れるようだけど・・
428Name_Not_Found:2005/08/10(水) 18:49:28 ID:???
>>427
太古の遺産にはスルーさせればいいじゃん。
いくつか方法あるし。
そもそもおまいわざわざCSSのスレにきてなに言ってんだ?
429Name_Not_Found:2005/08/10(水) 18:53:57 ID:???
>>426
えっと、まずbody
<h1>〜</h1>
<p>〜</p>
<div class="menu1">〜</div>
<div class="menu2">〜</div>
という構成で作ったのですが
<div align="center">
<h1>〜</h1>
<p>〜</p>
<div class="menu1">〜</div>
<div class="menu2">〜</div>
</div>
にすると、pの中身に改行があるので、文字数の少ないところは
                     ○○○○○○○○○○○○
                          ○○○○○○
(○=文字列)
になってしまいます。
これを、
                     ○○○○○○○○○○○○
                     ○○○○○○
のように、p自体は中央、pの中では左揃えにしたいです。
430427:2005/08/10(水) 18:56:32 ID:???
何言ってんだ って、俺そんな変な事聞いたと思ってないけど
431Name_Not_Found:2005/08/10(水) 18:57:07 ID:???
overflow:auto でスクロールボックスを表示すると
マウスのスクロールホイール(?)が無効になってしまうのですが、なぜですか?
432Name_Not_Found:2005/08/10(水) 18:59:44 ID:???
<div align="center">
まずこれがいくない。

.hoge {
text-align: left;
margin-left: auto;
margin-right: auto;
}

<div class="hoge">
いろいろ。pとリストとか
</div>

ちなみに外部スタイルシートとか分かってる?
基本が出来てないようだからスレの>>2-10あたり見て勉強した方がいいよ。
433Name_Not_Found:2005/08/10(水) 19:00:59 ID:???
>>431
たしかにそうなる場合が多いね
だけど文句はブラウザに
434Name_Not_Found:2005/08/10(水) 19:02:44 ID:???
div の中で、テキストとimgを テキストは左そろえ、img は右そろえで表示したいんだが、簡便な方法を教えてくださいな。

|テキスト        絵|

みたいな感じ。
435Name_Not_Found:2005/08/10(水) 19:06:02 ID:???
>>434

div img {
float: right;
}
436Name_Not_Found:2005/08/10(水) 19:10:39 ID:???
>>432
分かりました。
勉強してきます。
437Name_Not_Found:2005/08/10(水) 19:17:24 ID:???
>>435
|テキスト     |
|          絵|

こんな感じになります。何故に?
438Name_Not_Found:2005/08/10(水) 19:19:16 ID:???
<img>
<p>
439Name_Not_Found:2005/08/10(水) 19:31:35 ID:???
>>437
だったら同時にpを左寄せ
440Name_Not_Found:2005/08/10(水) 19:32:34 ID:???
>>437
div img {float: right;}
div p {float: left;}
441Name_Not_Found:2005/08/10(水) 20:28:23 ID:???
>>432
調べてきたら原因が分かりました。
お手数おかけしました。
442Name_Not_Found:2005/08/10(水) 20:28:33 ID:???
>>423
適当な事書いてんじゃねーよ
セルにマージンなど無い。
table{border-spacing:0;}
td,th{padding:0;}
443Name_Not_Found:2005/08/10(水) 20:33:48 ID:???
>>430
cssスレにいる人がテーブルでレイアウト組むわけないと思うよ
444Name_Not_Found:2005/08/10(水) 20:50:44 ID:???
>>442
marginはApplies to: all elementsですよ。
実装が対応できてないだけでしょう。
自分の無知を棚に上げて恥ずかしい人ですね全く。
442の1行目をそっくりそのまま返します。
445Name_Not_Found:2005/08/10(水) 21:06:20 ID:???
>>444
Internal table elementsはdo not have marginsですよ。
あなたが知らないだけでしょう。
自分の無知を棚に上げて恥ずかしい人ですね全く。
442の2行目をそっくりそのまま返します。
(442の1行目って「>>423」ですよね?)

ついでにCSS 2.1では
Applies to: all elements except elements with table display types other than table and inline-table
446Name_Not_Found:2005/08/10(水) 21:16:36 ID:???
とりあえず落ち着けよ。
質問者>421の要望にこたえているのは、442で正解。
447Name_Not_Found:2005/08/10(水) 21:20:59 ID:OU/H8eWh
UAごとにスタイルシートを適用したいと思うんですが、方法がわかりません、ご教授ください。

私の組んだCSSにはIEとMozillaでの表示に食い違いがありますので、それを解消したいためです。

ヨロシクお願いします。
448Name_Not_Found:2005/08/10(水) 21:29:24 ID:???
>>447
ttp://www.dithered.com/css_filters/index.html
こういうサイトみるとか、テンプレ読むとか、ググるとか。
449Name_Not_Found:2005/08/10(水) 21:34:18 ID:OU/H8eWh
>>448
サンクス!!


おいらが英語わかんないからって、わざとそんなの出してきたな!!
おまい大好き!!

ほこりかぶった英和辞書開いてくる ;;ノシ
450Name_Not_Found:2005/08/10(水) 21:41:57 ID:???
>>447
日本語ならバグ辞典みれ
ここのテンプレにあるから
451Name_Not_Found:2005/08/11(木) 00:34:38 ID:ie8c9KWS
CSSで、リンクテキストを画像に差し替えています。
WindowsIEだとマウスオーバーしたときに、一瞬フラッシュのように白くなってしま
います。これを回避する方法ってないのでしょうか?

ローカルで試すと全く問題ないのですが、サーバにアップするとこういった現象が
出ます。色々なサーバを試してみたりしましたが、ローカルサーバ以外では全て
同じでした。

p{
display:block;
text-indent:-9999px;
}
a{
display:block;
width:50px;
height:50px;
background-image:url("test.gif");
background-repeat:no-repeat;
background-position:0px 0px;
}
a:hover{
background-position:0px -50px;
}


<p><a href="">リンク</a></p>

背景画像は、通常用とロールオーバー用の2つのイメージが連結してあります。
GIF・JPG・PNGと色々な形式で試してみましたが、どれも同じでした。
画像ファイルサイズは500バイト程度です。
452Name_Not_Found:2005/08/11(木) 00:38:29 ID:???
段落をすっ飛ばすとは大胆だな。
453451:2005/08/11(木) 00:43:51 ID:???
>>452
ああ、ごめんなさい。マークアップは例のために適当に付けてしまったのでアレな感じです。
しかも、text-indent:-9999px;がアレなのも見逃してください。
454Name_Not_Found:2005/08/11(木) 01:24:21 ID:???
>>451
aの方を普通に画像リンクにして、visibilityで切り換えてみるというのはどうだろう?
背景がホバー画像で、画像が普通の。
455Name_Not_Found:2005/08/11(木) 07:33:47 ID:iP+3sZKc
floatで並べたブロック要素をbottomで合わせる方法を教えて頂きたく存じ申し上げる
vertical-alignでは駄目でござった
456Name_Not_Found:2005/08/11(木) 10:15:15 ID:???
>>455
素直にポジション指定汁
457Name_Not_Found:2005/08/11(木) 10:37:57 ID:???
>>451>>454
透明画像にリンクして、背景書き換えが良いんじゃないかと思われる
458Name_Not_Found:2005/08/11(木) 11:43:46 ID:???
>>457
背景書き換えじゃ451と同じことだろ。
背景書き換え(ポジションずらし)でIEのレンダリングがちらつくから、
解消方法か代替案がないかということなんだが。
459Name_Not_Found:2005/08/11(木) 11:51:22 ID:???
ポジションずらしじゃ無く、background-imageを変えればいいじゃん
460Name_Not_Found:2005/08/11(木) 12:06:51 ID:???
背景の指定はaじゃなく、a:linkにしてはどうだろうか?
461Name_Not_Found:2005/08/11(木) 12:08:20 ID:???
解決策が見つからないので知恵をお貸しください。
IE6とFirefoxを見比べながら作業しているのですが、
IEだとページの縦幅が短くても常にスクロールバーは右側に表示されて
いますが、Firefoxはスクロールが発生しないページではスクロールバー自体が
表示されません。
このせいで、Firefoxでスクロールが発生すると
そこだけバーの分だけ左にずれてしまいます。
overflowで常に表示というのも考えたのですが、
今度はFirefox以外のブラウザでバーが二重に表示されたり、もしくは
縦だけでなく横にもバーがでてしまったり。。とうまくいきません。
このような場合はどうやってすり合わせていけばよいのでしょうか。
462Name_Not_Found:2005/08/11(木) 12:16:13 ID:???
>>461
IEの仕様です。
overflow: auto;
でもダメですか?
463461:2005/08/11(木) 12:22:57 ID:???
>>462
autoだと結局IE側のバーが出たり消えたりするだけなので、
Firefox側が崩れることの解決にはならなかったです。
464461:2005/08/11(木) 12:26:11 ID:???
書き忘れました。IEだとバーがでてもでなくても
表示領域に変化はありませんでした。どうも、
バーを領域の一部として考えるかそうでないかということみたいですね。
仕様と思ってあきらめるしかないのでしょうか(´・ω・`)
465Name_Not_Found:2005/08/11(木) 13:07:02 ID:???
>>464
だね
ゲイツに文句をいいつつ自分のサイトに火狐へのリンクでもはっておこう
466Name_Not_Found:2005/08/11(木) 17:04:38 ID:???
それが気になるのは自分だけさ
467CSSマスター ◆glCCEzqfgE :2005/08/12(金) 01:22:02 ID:???
我こそはCSSマスター…
CSSを極めし者である。
私が解決できない質問など、この世に存在しない。
分からない事があれば何でも私に相談しなさい。
ただしHTML文とCSS文は必ず提示するように!
468CSSマスター:2005/08/12(金) 01:40:17 ID:???
ちなみに私もです
469Name_Not_Found:2005/08/12(金) 07:31:57 ID:???
あの世の住人の質問でもオッケーですか?
470Name_Not_Found:2005/08/12(金) 07:43:13 ID:???
なんでもこいや
471Name_Not_Found:2005/08/12(金) 09:01:28 ID:???
>>467
CSSでオナニーできますか?
472Name_Not_Found:2005/08/12(金) 11:42:13 ID:???
このサイト ttp://csszengarden.com/tr/japanese/?cssfile=/130/130.css&page=6
の背景画像 ttp://csszengarden.com/130/bg_hdr-csszengarden.jpg 等ってどこで
手に入るのでしょうか?

もしかして、これは作者さんのオリジナルなんでしょうか?
473Name_Not_Found:2005/08/12(金) 11:47:15 ID:???
>>472
タクラマカン砂漠に飛んでカメラのシャッターを切る
474Name_Not_Found:2005/08/12(金) 11:54:57 ID:???
>>473
無理だ。作者さんは本当に写真撮りに行ったの?
それとも、素材サイトから借りたとか?
475Name_Not_Found:2005/08/12(金) 11:57:07 ID:???
>>472
そんなことここの住人が知るかよ!
作者に直接訊けばいいだろウンコ野郎が!
476Name_Not_Found:2005/08/12(金) 11:58:18 ID:???
そういうことは作者に聞け
477Name_Not_Found:2005/08/12(金) 12:00:14 ID:???
474=ウンコ野郎 でよろしいか?
478Name_Not_Found:2005/08/12(金) 12:05:11 ID:???
すみません。 ちんこかまんこにしてくれますか?
479Name_Not_Found:2005/08/12(金) 12:09:24 ID:???
>>475
いや、そうじゃなくてですね。
CSS Zen Garden のルールがわからなくて。

素材サイトから借りた画像でもOKなのかなーと、思って。
あ、自分が出展するわけではありませんよ。
480Name_Not_Found:2005/08/12(金) 12:10:38 ID:???
>>479
それこそ運営側に聞け
つーかな、質問する前にせめて一分間ぐらいは頭働かせようや
481Name_Not_Found:2005/08/12(金) 12:10:58 ID:???
いずれにしてもこのスレに合わない質問な訳だが
482Name_Not_Found:2005/08/12(金) 12:12:04 ID:???
だって、英語じゃないですか?
483Name_Not_Found:2005/08/12(金) 12:13:11 ID:???
479=ウンコ野郎  決定!!
484Name_Not_Found:2005/08/12(金) 12:15:29 ID:???
はいはいわろすわろす
485Name_Not_Found:2005/08/12(金) 13:04:59 ID:???
仁義なきウンコ論争。
486Name_Not_Found:2005/08/12(金) 16:28:53 ID:???
「うう」
487Name_Not_Found:2005/08/12(金) 18:31:18 ID:BsaIeszE
CSSって出来上がりまでが楽しいんだよね、完成図を妄想して組んでいくのがたまらなく快感なんだよね、

出来上がった時って、射精したときと似てるよね・・・おまいらどうよ(;´Д`)ハァハァ
488Name_Not_Found:2005/08/12(金) 19:37:43 ID:???
あたし女だから射精なんてしないんだけど・・・

>>487 貴男のをお口で受けたいわ うふっ
489Name_Not_Found:2005/08/12(金) 19:58:40 ID:???
さすがに射精ほどではないが、妙に爽快な達成感はあるな。
苦労したときなんて特に。
490Name_Not_Found:2005/08/12(金) 20:03:36 ID:???
射精のあっけなさ    だろ
491Name_Not_Found:2005/08/12(金) 21:05:07 ID:???
しかもオナニーだよな
492Name_Not_Found:2005/08/12(金) 21:39:24 ID:???
何とも言えない達成感を見事なまでにぶち壊してくれるUAがあるよな。
493Name_Not_Found:2005/08/12(金) 21:48:38 ID:???
>>492
ゲイツブラウザですか?
494Name_Not_Found:2005/08/12(金) 22:30:34 ID:???
がてs
495Name_Not_Found:2005/08/12(金) 22:32:14 ID:???
>>493
公明ブラウザに決まってるだろwww
496Name_Not_Found:2005/08/12(金) 22:38:00 ID:???
脳内ブラウザでは多少のミスは許容してくれるのだが
497Name_Not_Found:2005/08/12(金) 22:39:17 ID:???
>>495
あったなそんなの
498Name_Not_Found:2005/08/12(金) 22:41:11 ID:???
ブロックとブロックの間が空いてしまうのですが、
どうすれば間を消せますか?
499Name_Not_Found:2005/08/12(金) 22:43:03 ID:???
>>498
ブロックって何さ
500Name_Not_Found:2005/08/12(金) 23:03:33 ID:???
えーと、・・・・。
馬鹿にされてるのでしょうか。

ともかく、こんなところで聞いた私が馬鹿でした。さようなら。
501Name_Not_Found:2005/08/12(金) 23:05:55 ID:???
>こんなところで聞いた私が馬鹿でした。さようなら。

この台詞って逆切れした質問者がみんな使うけど
そういうテンプレでもあるのかと思うくらい見事なパターンだな。
ほんとにテンプレあったら嫌だけどな。
502Name_Not_Found:2005/08/12(金) 23:43:54 ID:???
よし、逆切れのテンプレを(ry
503Name_Not_Found:2005/08/13(土) 00:09:07 ID:???
何様のつもりですか
504Name_Not_Found:2005/08/13(土) 00:15:40 ID:???
>>499って普通の質問に見えるけど、なんで切れたんだろう?
505Name_Not_Found:2005/08/13(土) 00:35:00 ID:???
カルシウムが足りないんだよ
きっとせいr(ry
506Name_Not_Found:2005/08/13(土) 00:38:02 ID:???
ブロックの意味はわからんが、
とりあえず、paddingの上下方向に0以外の数値を加えればいいよ
507Name_Not_Found:2005/08/13(土) 00:40:44 ID:???
よくあるこういうのはCSSでは出来ないでしょうか?TRはややこしくて
_______________
| なんたら. |
|~~~~~~~~~~|
| *ホニャララ |
|      .|
|______________|
508Name_Not_Found:2005/08/13(土) 00:43:00 ID:???
>>507
俺様の想像したものと同一ならば、できる
509Name_Not_Found:2005/08/13(土) 00:45:28 ID:???
>>507
多分その想像であってます。ご教授願います!
510Name_Not_Found:2005/08/13(土) 00:49:15 ID:???
>>509
<pre style="font-size: 100%;">
_______________
| なんたら. |
|~~~~~~~~~~|
| *ホニャララ |
|      .|
|______________|

</pre>

完璧、だろ?
511509(代理):2005/08/13(土) 00:53:48 ID:???
ここで聞いた私がバカでした・・
512Name_Not_Found:2005/08/13(土) 00:54:00 ID:???
(;^ω^)うぇうぇうぇ
513Name_Not_Found:2005/08/13(土) 00:58:50 ID:???
まってまって! ほんの、つかみのギャグだってば!!
参考urlとか絵で描いてみるとか、そうしてくれないとワカランよ
514Name_Not_Found:2005/08/13(土) 01:03:34 ID:???
>>509
一番簡単な方法はそういうところのCSSをパクる>自分用に変える
>いじっているうちに覚えちゃう>カスタマイズしたくなる
>調べる>詳しくなる
515507:2005/08/13(土) 01:30:04 ID:???
>>513
ヤフーのトピックスみたいな感じです。

>>514
結構ソースとか見るんですがどれもTRばかりで・・。
CSSでやってるのは見たこと無くて
516Name_Not_Found:2005/08/13(土) 02:21:00 ID:???
>>515
ホニャララが文章でなんたらがその見出しですよね?
*は何か意味があるのですか?
517Name_Not_Found:2005/08/13(土) 04:33:34 ID:???
CSS所学者だけど、練習ついでに分かる範囲で適当にYahooのトピックス風にしてみた。
でも、divの開きタグより前に、1画面に収まり切らずに自動改行されるような文字列入れてh2のfont-size小さくすると、
Firefoxで見た時にh2とulのボックスの間に隙間が・・・なんでだぁー orz

<style type="text/css">
#topics { width: 15em; }
#topics h2, #topics ul { margin: 0em; }
#topics h2 { background: #9b72cf; color: #ffffff; padding: 0em 0.125em; font-size: 1em;}
#topics ul { background: #f1f1fd; padding: 0.25em 0em 0.25em 1.25em; border-color: #9b72cf; border: 0.125em solid #9b72cf; }
</style>
<div id="topics">
<h2>トピックス</h2>
<ul>
<li>トピック1</li>
<li>トピック2</li>
</ul>
</div>
518Name_Not_Found:2005/08/13(土) 11:12:43 ID:???
すいません
ブロックとはダイアブロックの事です
519Name_Not_Found:2005/08/13(土) 11:19:09 ID:???
IE、フロート周りのバグ多くて腹立つ
firefoxと両立させんの難かしい・・
520Name_Not_Found:2005/08/13(土) 11:45:47 ID:???
そこで振り分けだよ
521Name_Not_Found:2005/08/13(土) 11:49:18 ID:???
>>518
ダイアブロックってなに?
522Name_Not_Found:2005/08/13(土) 13:01:22 ID:???
えーと、・・・・。
馬鹿にされてるのでしょうか。

ともかく、こんなところで聞いた私が馬鹿でした。さようなら。
523Name_Not_Found:2005/08/13(土) 13:05:39 ID:???
ダイアブロックとやらでググって見た
ttp://www.google.com/search?q=%E3%83%80%E3%82%A4%E3%82%A2%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF&ie=UTF-8&oe=UTF-8

なるほど。
ミュージシャンやおもちゃの事か。
で、それがどうしたって?
524Name_Not_Found:2005/08/13(土) 13:15:31 ID:???
この流れマジウケタ
525Name_Not_Found:2005/08/13(土) 15:25:00 ID:???
>>523
だから、間を無くするにはどうしたらいいですか?
526Name_Not_Found:2005/08/13(土) 15:29:11 ID:???
>>525
ミュージシャン達の心の隙間をうめるには昔から酒と薬と異性と相場が決まってる
おもちゃのブロックの隙間をなくすにはしっかり丁寧に組んでいけばいい

どっちにしても板違いだな
527Name_Not_Found:2005/08/13(土) 15:56:01 ID:???
>>500って、壮大な釣り?
なかなか面白い釣りだから、許そう。
528Name_Not_Found:2005/08/13(土) 16:05:21 ID:???
margin:0;
529Name_Not_Found:2005/08/13(土) 19:21:48 ID:???
印刷用CSSを作ってるのですが、アドバイスお願いします。
余白を作りたいのですが、だいたい何%ぐらいが適当でしょうか?
よろしくお願いします。
530529:2005/08/13(土) 19:22:35 ID:???
529です。
余白は margin で空けたいと思います。何%が適当かと思いまして…
531Name_Not_Found:2005/08/13(土) 19:24:38 ID:???
用紙サイズが秘密なようなので好きにしてください。
532529:2005/08/13(土) 19:40:18 ID:???
A4
533Name_Not_Found:2005/08/13(土) 19:42:01 ID:???
>>529
そんなことここの住人が知るかよ!
自分で適当と思う%を探せや!
%指定程度自分で試してすぐ実践出来るだろうウンコ野郎が!
534529:2005/08/13(土) 19:50:29 ID:???
またウソコ野郎扱いされました。
じゃ、5%って言う事で…
535Name_Not_Found:2005/08/13(土) 20:59:46 ID:???
せめてageろよ・・・質問する方
536Name_Not_Found:2005/08/13(土) 21:26:09 ID:???
>>500>>529
537529:2005/08/13(土) 21:39:05 ID:???
>>536
いえいえ>>429=529です。
538529:2005/08/13(土) 21:39:50 ID:???
間違えた。474=529ですw
539Name_Not_Found:2005/08/14(日) 00:51:18 ID:???
ID出ない上に、全く関連性のない質問で、
二度もウンコ野郎認定されるとは・・・さては>>529はネ申だな?
540Name_Not_Found:2005/08/14(日) 01:03:50 ID:???
いや、紙だろ。
541529:2005/08/14(日) 01:37:39 ID:???
間違えた
>>472>>529ですw
何か?
542Name_Not_Found:2005/08/14(日) 08:34:26 ID:???
CSSの練習するから練習に適してそうなサイトおせーて。
答え見ないで同じデザインを書く。
543472=529=ウソコ野郎:2005/08/14(日) 08:52:26 ID:???
544Name_Not_Found:2005/08/14(日) 23:41:16 ID:???
>>526
ありがとうございました
隙間を埋める事ができました。
545Name_Not_Found:2005/08/15(月) 02:21:15 ID:???
質問です

#footer {
     background-color: black;
color: white;
margin : 0 auto;
padding-top: 5px;
padding-bottom: 5px;
width : 700px;
border-top : solid black 1px;
font-size : small;
text-align:center;
}

と打ち込んでいるのですが、フッターの下に少し余白が出来てしまいます。
余白を無くすにはどうしたらいいでしょうか?
546Name_Not_Found:2005/08/15(月) 02:30:34 ID:CZjEltSP
>>545
position と bottom あたりをいじればなんとかなるんじゃないでしょうか
547Name_Not_Found:2005/08/15(月) 02:31:55 ID:???
>>545
body{margin:0;padding:0;}
548Name_Not_Found:2005/08/15(月) 02:56:41 ID:iWv/vJy9
>>546
>>547

position: absolute;
bottom 0px;

で解決出来ました。ありがとうございます。

549Name_Not_Found:2005/08/15(月) 08:16:40 ID:???
>>548
ほんとに解決した?
footerがコンテンツに重なったりしない?
550Name_Not_Found:2005/08/15(月) 15:26:01 ID:???
ttp://www.uploda.org/file/uporg170426.jpg.html

<div class="title">
ここにタイトル。
</div>
<div class="content">
ここに本文。
</div>


.title {
border-bottom: solid 2px;
border-left: solid 2px;
}
.content {
border-left: solid 1px;
border-bottom: solid 1px;
}

画像のように線を飛び出させたいのですが、
どの様な指定をすれば飛び出てくれますか?
551Name_Not_Found:2005/08/15(月) 15:57:28 ID:???
ttp://felden.way-nifty.com/felden/
うむぅBGMはどのファイル?
552Name_Not_Found:2005/08/15(月) 15:57:48 ID:???
厨よ 正しいhtmlを書こうや

<h1>タイトル</h1>
<p>ここに本文</p>

>画像のように線を飛び出させたいのですが、
>どの様な指定をすれば飛び出てくれますか?

paddinを上手く使うんだよ。
553Name_Not_Found:2005/08/15(月) 15:58:35 ID:???
paddingだた
554Name_Not_Found:2005/08/15(月) 16:53:40 ID:???
右の線を背景にすりゃいんでない?
555Name_Not_Found:2005/08/15(月) 16:53:46 ID:???
パッディン!!!
556Name_Not_Found:2005/08/15(月) 18:21:09 ID:???

The paddin
557Name_Not_Found:2005/08/15(月) 18:23:51 ID:???
(・∀・)パッディン♪
558Name_Not_Found:2005/08/15(月) 18:45:55 ID:???
hatten ar din
559472=529=ウソコ野郎:2005/08/15(月) 19:14:12 ID:???
div厨キターーーーーー(・∀・)ーーーーーー!!
CSSを外しても見れるようなサイト作りを>>550

解決策としたら>>554そのまま。
よし、スクリーンショットの画像加工して使え・・・
560Name_Not_Found:2005/08/15(月) 20:01:10 ID:???
>CSSを外しても見れるようなサイト作りを
なんで?
561Name_Not_Found:2005/08/15(月) 20:15:20 ID:???
>>560
釣り? ま、いいか。

構文として正しく書いてると、検索ロボットからも拾われやすくなる。

この先、ロボットのアルゴリズムや検索エンジンのサイト評価の基準は変更されていく可能性がある。
そこを正しい記述であれば、どのような変更になっても、生き残る確率は高くなるから。
562560:2005/08/15(月) 20:23:00 ID:???
ども 
なるほどねー
563472=529=ウソコ野郎:2005/08/15(月) 20:29:44 ID:???
>>560>>550ですか?
<div>で括ってると、CSSが適用されない(CSS未対応ブラウザ、検索ロボット、音声ブラウザ)
端末で表示した時ぐらい想像つくだろ。
<div id="titile">見出し</div>

よりは……

<h1>見出し</h1>って(ry
564Name_Not_Found:2005/08/15(月) 20:34:52 ID:???
正しい記述にこだわってない人間だ。
CSSが適用されない(CSS未対応ブラウザ、検索ロボット、音声ブラウザ)端末なんて、
ぜっっっっっったい眼中にないだろうな。
565472=529=ウソコ野郎:2005/08/15(月) 20:46:07 ID:???
おっと、音声ブラウザはCSS大丈夫だった。
>>564何か?
566質問者:2005/08/15(月) 21:03:36 ID:???
現在、勉強中の身であります。識者の方からのご返答お待ちしております。
小見出しの付いたリストを作っているのですが<H3>で囲んだ レビュー と
リスト aiueo との行間が開いてしまいます。

 レビュー
 ・a
 ・b
 ・c
 ・d
 ・e

のように小見出しにぴったりリストをつけるにはどのようにすればよいのでしょうか?
HTMLとCSSをつづきに記載いたします。
567質問者:2005/08/15(月) 21:04:53 ID:hoMnDXCD
つづき
<HTML>
  <DIV CLASS="menu">
<h3>レビュー</h3>
  <ul>
<LI>a</LI>
  <LI>i</LI>
  <LI>u</LI>
  <LI>e</LI>
  <LI>o</LI>
</ul>
</DIV>
<css>
  h3{
font-size:0.5em;
margin-bottom:0;
  }  
ul{
margin-top:0px;
text-align:left;
list-style-image:url(sozai/yz_12.gif);
margin-left:20px;
padding-left:0;
}
li{
font-size:0.5em;
padding-left:0em;
padding-bottom:0.2em;
}
568Name_Not_Found:2005/08/15(月) 21:31:43 ID:???
>>567
CSSに下記を追加してみてください。
*{
  padding:0;
  margin:0;
}
569質問者:2005/08/15(月) 21:58:35 ID:hoMnDXCD
>>568
レスありがとうございます
これは h3 ul li すべてに入れるのでしょうか?
入れてみたのですが解決いたしませんでした。(−−;)
よろしければ引き続きのフォローをお願いいたします。
570Name_Not_Found:2005/08/15(月) 22:02:01 ID:???
margin-top: -x

で地味に調整すれば〜〜?www
571Name_Not_Found:2005/08/15(月) 23:10:29 ID:???
>>567
ulにレフトマージンを設定すると、IEとFirefox等のブラウザとで挙動が異なるので注意(IEのバグかな)。かわりにliに設定するとうまくいきます。
572568:2005/08/15(月) 23:21:55 ID:???
>>569
↓これでわかる?

h3{
font-size:0.5em;
margin-bottom:0;
}  
ul{
margin-top:0px;
text-align:left;
list-style-image:url(sozai/yz_12.gif);
margin-left:20px;
padding-left:0;
}
li{
font-size:0.5em;
padding-left:0em;
padding-bottom:0.2em;
}
*{
padding:0;
margin:0;
}
573Name_Not_Found:2005/08/15(月) 23:31:49 ID:???
>>572
それじゃ無理。
574Name_Not_Found:2005/08/15(月) 23:34:19 ID:???
>>572
>*{
>padding:0;
>margin:0;
>}

これを最後に持ってきちゃダメだろ
最初にしないと
575Name_Not_Found:2005/08/15(月) 23:36:44 ID:???
*{
padding:0;
margin:0;
}
h3{
font-size:0.5em;
}  
ul{
text-align:left;
list-style-image:url(sozai/yz_12.gif);
margin-left:20px;
}
li{
font-size:0.5em;
padding-bottom:0.2em;
}

これでOK!
576Name_Not_Found:2005/08/15(月) 23:45:12 ID:???
いやだから違うっての
577Name_Not_Found:2005/08/15(月) 23:49:35 ID:???
質問です

#banner {
background-color : white ;
margin : 0 auto ;
padding : 0 ;
width : 680px ;

}


#menu { color: white ;
font-size : medium ;
background-color : black ;
margin : 0 auto;
padding : 0 ;
padding-top: 5px;
padding-bottom: 5px;
width : 700px;
text-align: center;

}

と打つと、バナーとメニューの間に1行くらいの余白が出来るのですが、
余白を無くすにはどうしたらいいでしょうか。

578Name_Not_Found:2005/08/15(月) 23:54:04 ID:???
>>577
>余白を無くすにはどうしたらいいでしょうか。
お前がつけた余白をなくせばいいと思います。
579Name_Not_Found:2005/08/15(月) 23:57:29 ID:???
>>577
>padding-top: 5px;
>padding-bottom: 5px;
しっかり余白が開いてると思うのですが
580577:2005/08/16(火) 00:06:33 ID:???
padding-top: 5px;
padding-bottom: 5px;

は無くしても、メニューバーの縦幅が小さくなるだけで
バナーとメニューの余白は詰まらないのですが・・・
581Name_Not_Found:2005/08/16(火) 00:10:18 ID:???
>>580
ソース晒さないから分かるわけない
もしかしてこんな構成かもしれんから何も言えない

メニュー



内容色々



バナー
582580:2005/08/16(火) 00:14:49 ID:ZH+86Xo2
スイマセン。

<div id="banner">
<h1><a name="top"></a><img src="アドレス"><a></h1>
</div>

<div id="menu">

というソースです。バナーとメニューの間には他の記述はありません。
583Name_Not_Found:2005/08/16(火) 00:18:39 ID:???
>>566

h3{
font-size:0.5em;
margin-bottom:-5px;
}

これでばっちり!!
584Name_Not_Found:2005/08/16(火) 00:21:19 ID:???
>>582
h1 {
margin : 0 auto;
padding : 0;
}
#menu {
margin : 0 auto;
padding : 0;
}

<h1 id="top"><img src="アドレス" alt="サイトタイトル"></h1>
<div id="menu">
585580:2005/08/16(火) 01:12:34 ID:???
>>584

h1のmargin : 0 auto; padding : 0;を指定していなかったからでした。

h1 {
margin : 0 auto;
padding : 0;
}

を加えたら問題なく解決できました。
ありがとうございます。
586Name_Not_Found:2005/08/16(火) 02:17:39 ID:???
「しばらく旅に出ます。探さないでください。」 クマより
587Name_Not_Found:2005/08/16(火) 11:11:05 ID:???
>クマ
ホケ手術後の養生かい?
588質問者:2005/08/16(火) 12:08:33 ID:???
亀ですみません。
たくさんの方からのアドバイスで頭がパニクっていました。
結局583氏の方法で隙間を埋めることが出来ました。
が、実は<h3>に続くulとの隙間だけではなく<h2>に続く<p>などにも
すきまが出来てしまって悩んでおりました。
たくさんの皆さんありがとうございました。

<h>に続く他の要素の間に余白が出来てしまう(ぴったり後に続かない)
ということで >>577さんと同じ問題の様な気もしております。

はー、はじめて1ヶ月がたちましたが分からんことばかりですorz
589Name_Not_Found:2005/08/16(火) 12:38:19 ID:???
最初はみんなそんなもんだ。
ひとつづつのんびり覚えていけばいい。

   がんがれ
590質問者:2005/08/16(火) 13:35:01 ID:???
ほんとにありがとう
例の隙間で盆休み2日つぶしますた。。。

paddingなどにマイナスを使うのを覚えて本日の作業ははかどっております。
がんがりまーす
591質問者:2005/08/16(火) 13:46:51 ID:WunMPhZC
お言葉に甘えてもひとつ質問投下よろしいでしょうか?
list-style-image:url(sozai/yz_12.gif); ではリストマークと文字とにずれがありましたので

li {
padding-left: 12px;
background: url(hogehoge.gif) no-repeat 10px 0.5em;
list-style: none; } 

に変更したところliの行間が以前より開いてしまいました
以前は  li { padding-bottom:-0.2em; } で行間を調整していましたが
-0.2emを変更しても行間が変わらないのはなぜでしょうか?
どうぞよろしくお願いいたします。
592Name_Not_Found:2005/08/16(火) 13:57:27 ID:???
>>591
おら、もう寝るだ。

このへんで勉強してくれ。

http://www.kanzaki.com/docs/html/htminfo17.html

 ここはちょっとアレだけど
http://www.openspc2.org/reibun/css/index.html
593Name_Not_Found:2005/08/16(火) 14:50:45 ID:???
行間はolに
line-height: *;
594Name_Not_Found:2005/08/16(火) 14:55:08 ID:???
paddingに負の値は指定できない
595Name_Not_Found:2005/08/16(火) 15:00:28 ID:???
>>591
よし分った
行間を完璧にしてやろう
これをスタイルシートの 一 番 最 後 におきたまへ

* {
border: 0px none;
margin : 0;
padding: 0;
list-style: none;
line-height:0;
}
596Name_Not_Found:2005/08/16(火) 15:07:30 ID:???
nanisitennda omae
597Name_Not_Found:2005/08/16(火) 16:05:29 ID:???
<pre>タグと同じことをcssだけで実現出来る?
598Name_Not_Found:2005/08/16(火) 16:07:39 ID:???
.pre{
font-family:monospace;
white-space:pre;
}
599597:2005/08/16(火) 16:13:45 ID:???
すいません。激しく説明不足でした。
<body>内のどこにも<pre>タグを置かずに
preと同じ動作(自動改行)をさせたいのですが、
cssで可能でしょうか?
bodyの属性にそのようなものはあるのでしょうか?
600Name_Not_Found:2005/08/16(火) 16:16:13 ID:???
601597:2005/08/16(火) 16:32:43 ID:???
改行されないようですが、
html内で何か指定する必要がありますか?
602472=529=ウソコ野郎:2005/08/16(火) 16:34:51 ID:???
つーか、<pre>で括る意味があるなら<pre>で括るべき。
HTMLの意味ないじゃん。
603ウソコ野郎:2005/08/16(火) 16:35:20 ID:???
ふぅ。。。。。
604597:2005/08/16(火) 16:44:12 ID:???
やはりそうですよね。
ウソコ野郎ありがとうございます。
605質問者:2005/08/16(火) 17:02:15 ID:???
またまた皆さんありがとう
盆休み最後の今日もパニ食ってますので
もー少し悩んでみます。。。
606Name_Not_Found:2005/08/16(火) 17:28:27 ID:dUU073i9
みなさまに質問ですが。ulで横並びのメニューをつくりたいのですが、どのブラウザでも適用できるcssの記述のしかたはありますか?
607Name_Not_Found:2005/08/16(火) 17:32:05 ID:???
>>599
>preと同じ動作(自動改行)をさせたいのですが、
なんで自動改行なんだ?(w
608Name_Not_Found:2005/08/16(火) 17:32:42 ID:???
どのブラウザでもってのは当然、css非対応はのぞく、だよな?
609Name_Not_Found:2005/08/16(火) 17:42:49 ID:dUU073i9
一度自分でcssを記述したところ、メニュー自体が消えたり、
ぜんぜん違う位置にあったりで。なにかコツがあるんですかね?
610ウソコ野郎:2005/08/16(火) 17:48:18 ID:???
>>609
floatじゃないの?
しかし、全てのブラウザってのは非対応は除くって事だよな?
じゃないと無理。
611Name_Not_Found:2005/08/16(火) 17:55:26 ID:16hbKc7B
まちがって消しちゃった
ブラウザ終了のタグしらない?
612Name_Not_Found:2005/08/16(火) 17:59:08 ID:???
display: inline;
613Name_Not_Found:2005/08/16(火) 18:04:09 ID:dUU073i9
>>608
>>610
非対応てなんざんす?
614ウソコ野郎:2005/08/16(火) 18:07:11 ID:???
>>613
釣り?CSSを十分にサポートしていない古い
ヴァージョンのブラウザを使っている方がまだいることをお忘れなく。

>>606であなたが、「どのブラウザでも適用できる」って書いたから
誤解してないか?と思ったり
615Name_Not_Found:2005/08/16(火) 18:30:13 ID:16hbKc7B
>>611
ブラウザ終了のあった〜
616Name_Not_Found:2005/08/16(火) 21:52:05 ID:???
>>612
ブロック要素のdisplay: inlineはIEでしか使えなかったという苦い経験があります


そんな僕はfloatちゃん!!!
617Name_Not_Found:2005/08/16(火) 22:02:32 ID:???
何いってんだ?
618Name_Not_Found:2005/08/16(火) 22:17:21 ID:???
NN4の呪いが頭から抜けないオサーンだろ。
619Name_Not_Found:2005/08/16(火) 23:25:17 ID:???
auがPCサイトビューワーとかCMで謳ってたけど、あれってどうなのよ
620Name_Not_Found:2005/08/16(火) 23:30:42 ID:???
「フルブラウザ」という単語はドキュモしか使えないので。
621Name_Not_Found:2005/08/16(火) 23:57:47 ID:???
DQM
ドラクエモンスターズ
622Name_Not_Found:2005/08/17(水) 00:21:47 ID:???
>>620
ハァ?いつそんな法律が出来たんだよ?
勝手に使えばいいだろが。アホか。
623Name_Not_Found:2005/08/17(水) 00:38:01 ID:???
>>622
昭和35年4月1日にできた。

>商標法施行法
>第1条 商標法(昭和34年法律第127号。以下「新法」という。)は、昭和35年4月1日から施行する。
624Name_Not_Found:2005/08/17(水) 02:13:38 ID:???
>>606
li を float:
横並びメニューが終わったらちゃんと clear: してね

css対応の主要ブラウザなら大丈夫だから
どんな感じのメニューかしらないけど、float:が妥当だと思うよ
625愚痴:2005/08/17(水) 11:32:15 ID:???
IEにはとことんあきれた。前からバグ多くて
嫌だったが、まさかmargin:autoも使えないとは…_| ̄|◯ガクリ
今日はじめて知っちゃったんだけど。

今までずっと、一部のサイト中央構えしてたからIEユーザは
左構えで見えていたのか orz

打倒MSって日はこないかねぇ?
厨房臭いレスでスマソ…
626Name_Not_Found:2005/08/17(水) 11:34:20 ID:???
margin:autoじゃなくて
margin-left:auto
margin-right:autoだった。
627Name_Not_Found:2005/08/17(水) 11:34:43 ID:???
>>625
いまどき互換モードなんかでページを作ってるからですよ
628Name_Not_Found:2005/08/17(水) 11:38:07 ID:???
>>625
IE6だと使えるはず。
つかここみれ。
http://www.mozilla.gr.jp/standards/webtips0004.html
629Name_Not_Found:2005/08/17(水) 11:49:46 ID:???
>>628
あ、それなら見ましたよ。
俺が主張したかったのは、せっかく製作を楽にしてくれるCSSなのに
糞IEのおかげでIE専用のスタイルシートを読み込ませてるから面倒なのです。(読み込ませなくても、IEのおかげで無駄なテクニックを使ってるし…)

text-alignだと、いちいちまた設定しなおさないといけないわけですし(左構えにしたい時leftを指定するの面倒)

どうすればあの糞IEを潰せるのだろうか…と。。。
630Name_Not_Found:2005/08/17(水) 11:57:34 ID:???
>>629
ゲイツを呪う
631Name_Not_Found:2005/08/17(水) 12:09:30 ID:???
>>629
Windows版のIEへの対策の弊害対策ってとこ嫁
632Name_Not_Found:2005/08/17(水) 12:14:33 ID:???
スレ違いだけど……
俺のサイトでも97%がIEユーザなので、困った者だ。
どうしてFirefoxやNNが広まらないのか…

・初心者はわざわざ設定なんかしたくないだろうから、使いなれたIEのままである
・そもそもNNで観覧するメリットを理解していない人が多い。(IEは世界最高のブラウザって思ってる)
・技術系重視のサイトは、あらかじめIEユーザ以外は弾く(Java Scriptは痛い)
・NN系が違和感ある
・IEしか知らない奴が多い
・MSがIEデフォにしてる限りなかなかNN系へ移る奴はいない

こんなものか?
633Name_Not_Found:2005/08/17(水) 12:18:54 ID:???
・最初から入ってるのがIE
・普通のサイトはIEで正しく観れるように作られており、利用者からすれば問題無い
634Name_Not_Found:2005/08/17(水) 13:40:18 ID:???
MSがIEを広めるのにそれなりの対価を払ったから。
635ウソコ野郎:2005/08/17(水) 13:52:04 ID:???
IEは子供のおもちゃだったよな?
636Name_Not_Found:2005/08/17(水) 14:14:29 ID:???
>>629 >>638
ヘタレはみんなそう言う。
637Name_Not_Found:2005/08/17(水) 14:15:10 ID:???
??
638Name_Not_Found:2005/08/17(水) 14:15:55 ID:???
>>636
なんでわかった?
639Name_Not_Found:2005/08/17(水) 14:33:08 ID:???
text-decoration:undelineを破線に出来ない?
640Name_Not_Found:2005/08/17(水) 15:58:04 ID:???
>>639
今のところできない。borderをうまく使えば近いことはできる。
あと、underlineね。
641Name_Not_Found:2005/08/17(水) 16:50:00 ID:???
border-bottom: 1px dashed;
642Name_Not_Found:2005/08/17(水) 16:51:22 ID:???
♪パッディン(・∀・)ウンデリン♪

小林製薬の商品名みたいだね
643Name_Not_Found:2005/08/17(水) 17:39:45 ID:???
kobayashi#seiyaku{
paddin:500em;
}


<kobayasi id="seiyaku">ウンデリン</kobayashi>
644Name_Not_Found:2005/08/17(水) 18:47:00 ID:???
paddin'
↑この方がカッコイイよね
645Name_Not_Found:2005/08/17(水) 19:48:41 ID:???
KEEP ON PADDIN'
646Name_Not_Found:2005/08/17(水) 20:56:43 ID:???
ずっとパディングって読んでたんが・・・パッディングって釣りだよな?
647Name_Not_Found:2005/08/17(水) 21:31:31 ID:???
>>646
誰もそんなこと言ってないよ(・∀・)パッディン♪
648Name_Not_Found:2005/08/17(水) 22:02:30 ID:???
発音としてはパリンが近いしな
649Name_Not_Found:2005/08/18(木) 13:31:23 ID:???
*で全体のmargin paddingを0にすると、
IEでリストのマーカーの表示が消えてしまいました。

Firefoxでは表示されているので、どうやら消えたのではなく
margin paddingを0にしたことで表示範囲外にいってしまっているようです。
*の設定はそのままで、リストの部分だけノーマルな位置に戻すのはどうすればいいのでしょうか。。。
650Name_Not_Found:2005/08/18(木) 13:35:01 ID:???
>>649
* {
margin:0;
padding:0;
}
li {
margin:0 0 0 適当な数値;
padding:0 0 0 適当な数値;
}
651Name_Not_Found:2005/08/18(木) 13:57:04 ID:???
>>650
レスありがとうございます。よく考えたら再度margin paddingを
指定しなおせばいいんですよね。。表示させることができました。

上に書いたCSSを無効化させるCSSとかあったら便利なのになあと
思ってしまいました。
652Name_Not_Found:2005/08/18(木) 21:31:37 ID:???
>>650
そんな書き方なら
margin-left
padding-left
を使ってくれ・・・
653Name_Not_Found:2005/08/18(木) 21:47:31 ID:???
♪パッディン(・∀・)パッディン♪
654Name_Not_Found:2005/08/19(金) 00:10:50 ID:???
そもそもCSSオフ環境でも見れるようにと勧めるW3C信者はCSSをなんと心得るのか!!
655Name_Not_Found:2005/08/19(金) 00:19:01 ID:???
ご老公の御前である。控えおろうー!
656ウソコ野郎www.unco.jp ◆z.fnC4lCx2 :2005/08/19(金) 00:21:20 ID:???
>>654
信者とかそういう問題なのかよ…
657Name_Not_Found:2005/08/19(金) 01:49:47 ID:???
何か勘違いしてるな
わざとだろうけど
658Name_Not_Found:2005/08/19(金) 02:34:10 ID:???
>>654
普通にマークアップしてればCSS切ってても、それなりに見えるんじゃない?
俺はそれで困ったことなんて一度も無いぞ。
659Name_Not_Found:2005/08/19(金) 02:45:44 ID:???
CSSみれないブラウザ利用者なんてもう対象外でいい
660Name_Not_Found:2005/08/19(金) 02:54:26 ID:???
>>659
携帯を対象から外すとは。
661ウソコ野郎www.unco.jp ◆z.fnC4lCx2 :2005/08/19(金) 03:03:03 ID:???
>>659
ある意味差別だな。さて、視覚障害者が実際、障害無くサイトを
訪れられるのは全体の何%だろうか。

ま、俺はそんなHTMLでアクセシビリティをあーだこーだじゃなくて
本当にボランティアで役立ってるから気にしない。
662Name_Not_Found:2005/08/19(金) 09:09:55 ID:???
視覚障害者がどーだとか言ってるヤツは、まずその辺の歩道に
違法駐輪してある自転車の一台でもどかした方がよほど社会の役にたってる。
663Name_Not_Found:2005/08/19(金) 15:21:30 ID:???
視覚障害者が見る必要のあるサイトなのかどうか?
視覚障害者が見てたのしめるサイトなのかどうか?
664Name_Not_Found:2005/08/19(金) 15:36:52 ID:???
そもそも視覚障碍者はどんなサイトを見るのか。
665ウソコ野郎www.unco.jp ◆z.fnC4lCx2 :2005/08/19(金) 15:40:28 ID:???
>>664
趣味(多少障害を乗り切れなくても)とかもあるだろうから
さまざまなサイトへアクセスすること間違い無し。
666Name_Not_Found:2005/08/19(金) 17:45:36 ID:???
まえに視覚障害の人が降臨したスレがあったな。
どこだったっけ?
667ウソコ野郎www.unco.jp ◆z.fnC4lCx2 :2005/08/19(金) 17:53:30 ID:???
俺が加入してるMLは、視覚障害者だらけだよ。
気分で顔文字使ったら「音声合成読み上げソフト使ってるから意味不明な文字書かれると
読みにくい」って怒られたんだボケーーーー!

まぁ、とても親切な事…。
サイトも晒したけどね、alt属性に入れる文字例に悩んでると、親切に考えてくれるのよ。
668Name_Not_Found:2005/08/19(金) 21:41:47 ID:???
気持ちわりーから帰れよ
669ウソコ野郎www.unco.jp ◆z.fnC4lCx2 :2005/08/19(金) 22:07:45 ID:???
オマエモナー
670Name_Not_Found:2005/08/19(金) 22:52:16 ID:???
すみません質問です

スクロールバー付き小窓&背景画像固定(壁紙固定)をcssでやると
IEでは、上手く表示されるのですが、モジラなどでは背景画像がずれて
表示されます。ソースは

div.*** {
background:url(背景画像、横200 縦120ピクセル!パターン模様とかの柄じゃなくて写真);
background-attachment:fixed;
height:120px;
overflow:auto;
border : 2px white inset
}

どこか訂正個所があればよろしくお願いします。m(__)mペコッ
671Name_Not_Found:2005/08/19(金) 22:53:35 ID:???
それだけじゃわかりません
672Name_Not_Found:2005/08/19(金) 23:01:22 ID:???
>>670
>background-attachment:fixed;
はviewportすなわちウインドウに対して固定、位置指定するのが正しい仕様です。
のでMozillaは仕様に従っているだけ。
IEは仕様に従ってないだけ。
http://www.meyerweb.com/eric/css/edge/complexspiral/demo.html
とかをWinIEとその他で見比べてみるとよろし。
673Name_Not_Found:2005/08/20(土) 00:02:18 ID:cRHuSufc
多分、インライン要素の設定に関しての知識が足りてないような気がするんですが、
次のようなことがわからないで困っています。
(HTML自体の問題もからんでいるのですが。。)

<img src="./left.gif"><img src="./center.gif"><img src="./right.gif">
って書くと、3つの画像が隙間なく表示されます。

しかし
↓のように改行を入れて書くと
<img src="./left.gif">
<img src="./center.gif">
<img src="./right.gif">
なぜか、3つの画像の間に隙間が入ってしまいます。
そのため、
img{
padding: 0px;
border: 0px;
margin: 0px;
}
などとして、3つの画像の間を埋めようとしたのですが、ダメでした。

2つ目のようにHTMLを書いて、間を埋めようとすると無理なんでしょうか?
あと、1つ目と2つ目の書き方で、どういう解釈の違いが生じているのでしょうか??
(CSSだけの質問でないですが、よろしくお願いします)
674Name_Not_Found:2005/08/20(土) 00:07:19 ID:???
ソースの改行は半角スベースと解釈される。

一行にずらずらと書くか、
<img
src="./left.gif"><img
src="./center.gif"><img
src="./right.gif">
みたいに書くとよいかもね
675Name_Not_Found:2005/08/20(土) 00:07:47 ID:???
>>673
CSSじゃなくてHTMLの仕様の問題
ほとんどのUAでは改行は空白文字として扱われる
試しにこんな実験をして御覧

<p>
色は匂へど
散りぬるを
</p>
<p>
色は匂へど散りぬるを
</p>
676Name_Not_Found:2005/08/20(土) 00:37:36 ID:???
そんな時は、テーブルレイアウトですね
677Name_Not_Found:2005/08/20(土) 00:56:11 ID:???
>>672
なんで「viewportすなわちウインドウ」になるんだろう?

普通に考えて
要素に背景をつけているわけだから
要素の top left 位置を基準に貼り付ける IE の方が
正しい仕様のような気がしなくもないだけど。
w3c の文書でそれについて厳密に記述しているものってあるん?

Gecko や Opera の実装のがかっこいいことは同意できるんだけど。
678Name_Not_Found:2005/08/20(土) 00:58:00 ID:cRHuSufc
>>674-676
なるほど。ありがとうございます。

679Name_Not_Found:2005/08/20(土) 01:23:46 ID:dfXjZ1y9
すみません。教えてください。
フリーの掲示板のCGIを設置して、HTMLでデザインしているの
ですが、文字数が多い場合、なぜか、ウインドウの幅で改行されない
のです。(横スクロールバーが出てしまう)
考えられる原因は、何でしょう?
680Name_Not_Found:2005/08/20(土) 01:24:36 ID:???
テーブル
681Name_Not_Found:2005/08/20(土) 01:29:23 ID:dfXjZ1y9
あ、やはり。ありがとうございます。分析してみます。
682Name_Not_Found:2005/08/20(土) 01:57:09 ID:???
<!-- 誰だよテーブルやめてfloatでレイアウトしようっていいやがったのはあああああああ -->
683Name_Not_Found:2005/08/20(土) 02:13:05 ID:???
俺はテーブル分からん。どっちの方が楽なんだろう。
684Name_Not_Found:2005/08/20(土) 02:34:46 ID:???
時と場合
685Name_Not_Found:2005/08/20(土) 02:42:07 ID:???
待て、楽かどうかは関係なかろう
686Name_Not_Found:2005/08/20(土) 03:03:57 ID:???
FireFoxで、display:table にするとz-index 効果なくなるけど、これはこれで良いの?
良いとすると、どういう理由?
687Name_Not_Found:2005/08/20(土) 04:30:11 ID:???
外部CSSファイルで

A { color: #00659D;}

と指定したものを
特定のページに関してのみ色を変えたいと思い、
ヘッダ部分に

<STYLE type=text/css>
<!--
a {color: #666666;}
-->
</STYLE>

と書き加えたのですが、
思うように色を変えることが出来ません。
(外部CSSファイルで指定した色のまま)

これは仕様上、外部ファイルの指定が継承されてしまうのでしょうか?

<a></a>のタグがシステムから自動で吐き出されてくるため、
class指定などが出来ないのですが、
ヘッダにスタイルを記述するだけで解決する方法はあるでしょうか?
688Name_Not_Found:2005/08/20(土) 04:34:19 ID:???
STYLEタグはLINKタグより後に来てる?
先に来ては駄目だぞ
689Name_Not_Found:2005/08/20(土) 06:31:33 ID:???
>>686
今試してみたら効果あったんだけど、他の部分も一緒に書き換えちゃったとかじゃ?

>>687
>>688の方法で多分解決するとは思うけど、
ページ内にstyle要素で書かずに、そのページ用の外部CSSファイルを作るってのも手だよ。
690Name_Not_Found:2005/08/20(土) 09:27:30 ID:???
もしかしてなまず?
691Name_Not_Found:2005/08/20(土) 10:00:13 ID:???
>>677
CSS2仕様書の'background-position'のとこに書いてある。
って、こんなのすぐ見つかるだろ
692Name_Not_Found:2005/08/20(土) 10:22:31 ID:???


* { display:none; }
693686:2005/08/20(土) 10:42:17 ID:???
>>689
極めて単純なHTMLとCSSで試して見たら、言われた通り効きますね。
う〜ん、もう少し原因を探って見ます。

お手数掛けました。
694Name_Not_Found:2005/08/20(土) 11:54:00 ID:???
このスレで質問するのは不適当かも知れませんが・・・

display: none; とは逆に、
スタイルシートをOFFにした時、消えるような文字列を指定することは可能でしょうか?
695Name_Not_Found:2005/08/20(土) 12:02:22 ID:???
contentプロパティ
もしくはbackground-image
696687:2005/08/20(土) 12:51:46 ID:???
>>688
いま確認してみましたら、
<link href="style.css" rel="stylesheet" type="text/css">
<STYLE type=text/css>
<!--
a {color: #666666;}
-->
</STYLE>

となっており、ちゃんと後ろのほうに来ていました。
なのに適用されてない。なんでだろう?


>>689
とりあえず、そのページ用に外部CSSを一個作りました。
無事表示されたので、このまま行くことにします。

ありがとうございました。
697Name_Not_Found:2005/08/20(土) 13:12:37 ID:???
>>695
どうもですm(_ _)m
698Name_Not_Found:2005/08/20(土) 14:14:23 ID:YnX+4Ix6
┌─┬───┐
│  ├──┬┤
│  │   ││
│  │   ││
├─┴──┴┤
└─────┘
こんな感じのCSSを作りたいです。
お願いします。
699Name_Not_Found:2005/08/20(土) 14:21:46 ID:???
>>698
テンプレ読んで自分で作れ
700Name_Not_Found:2005/08/20(土) 14:27:21 ID:???
外部スタイルシートでリンク色を指定してるんですが
同じページの一部のリンクの色を変える場合はどうすればいいですか?
701Name_Not_Found:2005/08/20(土) 14:35:58 ID:???
702Name_Not_Found:2005/08/20(土) 14:38:55 ID:???
>701
アホは答えなくてよい。
703Name_Not_Found:2005/08/20(土) 14:42:49 ID:???
>>700
a { color:#ff0000;}
a .hoge { color:#00ff00;}

<a herf="hoge.html">ほげ</a>
<a herf="hoge.html" class="hoge">ほげ</a>

または、
em a { color:#0000ff;}
<em><a herf="hoge.html">ほげ</a></em>
704Name_Not_Found:2005/08/20(土) 16:00:34 ID:???
テーブルを自由な位置に配置するにはどうすればいいですか?
705Name_Not_Found:2005/08/20(土) 16:02:56 ID:???
>>704
ポジションなど
706Name_Not_Found:2005/08/20(土) 16:03:37 ID:???
>>705
ピクセル単位で配置できますか?
707Name_Not_Found:2005/08/20(土) 16:09:01 ID:???
>>706
もち
708Name_Not_Found:2005/08/20(土) 16:13:46 ID:???
>>707
その場合のプロパティを教えてください
709Name_Not_Found:2005/08/20(土) 16:20:51 ID:???
>>708
         _,,..,,,,_∩
         / ,' 3  `ヽーっ
         l   ⊃ ⌒_つ
          `'ー---‐'''''"
710Name_Not_Found:2005/08/20(土) 16:21:21 ID:???
>>709
死ね役立たず
711Name_Not_Found:2005/08/20(土) 16:23:38 ID:???
712Name_Not_Found:2005/08/20(土) 18:37:04 ID:???
ようするにここは、適切な回答がわからないバカが回答者面してるわけですね
滑稽です
他で聞くのでもう結構。バカはバカたちで楽しくなれ合っててください
713Name_Not_Found:2005/08/20(土) 18:43:39 ID:???
自滅乙ww
714Name_Not_Found:2005/08/20(土) 18:44:43 ID:???
>>698,700,702,704,706,708,710,712
全部同一人物か?
やってらんね
715www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/20(土) 18:55:04 ID:???
ワロスwwwwww
716Name_Not_Found:2005/08/20(土) 18:55:16 ID:???
回答できない高度な質問に対しては
そうやって逆切れして、追い払ってる訳ですね
良く出来たシステムですね。全く素晴らしい。感動です
717Name_Not_Found:2005/08/20(土) 18:56:50 ID:???
高度な質問だったんだw
初めて知った
718www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/20(土) 19:04:26 ID:???
>>716
これも同一人物?
逆ギレしてるのはあなただと思うけど…

わからないからって逆ギレする方は誰もサポートできないシステムですよ。
719Name_Not_Found:2005/08/20(土) 20:13:59 ID:???
高度な質問していいかな  な?
720Name_Not_Found:2005/08/20(土) 20:18:46 ID:???
高貴な質問なら、気品ある態度でしたらしてもよろしくてよ
721Name_Not_Found:2005/08/20(土) 20:28:14 ID:???
おテーブルを自由な位置にお配置するにはどうすれば宜しいのでございましょうか?
722www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/20(土) 20:40:00 ID:???
最後に一言足りない…気品は?
723Name_Not_Found:2005/08/20(土) 20:46:34 ID:???
>>721
WYSIWYG
724Name_Not_Found:2005/08/20(土) 21:38:15 ID:???
>>708
"プロパティ"なんてものは存在しない。
勝手に用語を造るなよ。常識。
答えるのもばかばかしい質問だってこともわからないのか?
725Name_Not_Found:2005/08/20(土) 21:46:16 ID:???
>>724
なんでそんなにキレてんの?
まぁ落ち着け。
726Name_Not_Found:2005/08/20(土) 21:56:31 ID:???
回答できない高度な質問に対しては
そうやって逆切れして、追い払ってる訳ですね
良く出来たシステムですね。全く素晴らしい。感動です
727Name_Not_Found:2005/08/20(土) 21:58:39 ID:???
え?プロパティって存在しないの?初耳だぞそんなの
728Name_Not_Found:2005/08/20(土) 22:01:09 ID:???
何だよプロパティって。
Javaのスレに行けバカ。
729www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/20(土) 22:05:25 ID:???
>>726の頭の中=内部サーバエラー

オレモナー
7301/2:2005/08/20(土) 22:26:59 ID:qfXSsRS4
質問させていただきます。

【動作確認】
Win2k Netscape7.1

【やりたいこと】
テーブルセル内でのテキスト改行なし設定を1列一括指定したい

【希望表示】
┏━━━━┯━━━━━━━━━━━━━━━━┓
┃改行なし │改行任意改行任意改行任意改行任意┃
┃      │改行任意改行任意改行任意      ┃
┠────┼────────────────┨
┃改行なし │改行任意                  ┃
┗━━━━┷━━━━━━━━━━━━━━━━┛

【ソース】(実際には外部CSSファイルだが動作は変わらず)
<table>
<col style="white-space:nowrap;">
<col>
<tbody>
<tr><td>改行なし</td><td>テーブル幅より大きく改行するような長い文章</td></tr>
<tr><td>改行なし</td><td>改行任意</td></tr>
</tbody>
</table>
731Name_Not_Found:2005/08/20(土) 22:27:01 ID:???
>"プロパティ"なんてものは存在しない。
>勝手に用語を造るなよ。常識。

詳しく。
7322/2:2005/08/20(土) 22:27:39 ID:qfXSsRS4
【実際の表示結果】
┏━━┯━━━━━━━━━━━━━━━━━━┓
┃改行│改行任意改行任意改行任意改行任意改行┃
┃なし │任意改行任意改行任意            ┃
┠──┼──────────────────┨
┃改行│改行任意                     ┃
┃なし │改行任意                     ┃
┗━━┷━━━━━━━━━━━━━━━━━━┛



<tr><td style="white-space:nowrap;">改行なし</td><td>(略)長い文章</td></tr>
<tr><td style="white-space:nowrap;">改行なし</td><td>改行任意</td></tr>
ですと希望通りに表示はされますが、実際にはセル数が多いので
colで一括指定できないものかと思っております。
また、widthでのem指定ですと、今後テーブルの拡張がありますので
ミスをなくすためできれば避けたいと思っております。
何か方法がある、或いは方法を間違えておりますでしょうか。
733708:2005/08/20(土) 22:57:20 ID:???
例えば
p {font-size:40px}
のfont-sizeはプロパティですよ?

>>724
は俺より無知ですか?
734Name_Not_Found:2005/08/20(土) 22:59:51 ID:???
735Name_Not_Found:2005/08/20(土) 23:22:32 ID:???
騙りが出たのでもう一度質問します。
table{position
までは分かったんですが、その後具体的に
どうすればいいか分かりません。
教えてください。
736Name_Not_Found:2005/08/20(土) 23:24:34 ID:???
少しは自分で調べたら?
737Name_Not_Found:2005/08/20(土) 23:32:00 ID:???
>>735
その要素をどこにどういう風に固定したいのだい?
738Name_Not_Found:2005/08/20(土) 23:32:47 ID:???
>>736
わからないなら口を出さないでください(><)
739Name_Not_Found:2005/08/20(土) 23:33:50 ID:???
>>737
上から180ピクセル、左から40ピクセルぐらいの位置に配置したいです。
740Name_Not_Found:2005/08/20(土) 23:45:17 ID:???
>>739
教えてやるから二度と来るな!

#hoge {
position : absolute;
top : 180px;
left : 40px;
}
741Name_Not_Found:2005/08/21(日) 00:01:58 ID:???
>>740
ありがとうございました。
また来ます。ノシ
742Name_Not_Found:2005/08/21(日) 00:09:06 ID:???
もういや
↓まともな質問ドーゾ
いまならもれなく5割増の好感度で迎えられますよ
743Name_Not_Found:2005/08/21(日) 00:19:06 ID:???
テーブルを自由な位置に配置するにはどうすればいいですか?
744Name_Not_Found:2005/08/21(日) 00:19:39 ID:???
外部から、複数のスタイルシートを呼び出すことも可能だと聞きました
代替スタイルシートに萌え〜ってやつですか?
745Name_Not_Found:2005/08/21(日) 00:55:29 ID:???
「まともな質問」?
だめだな、表現は正確かつ的確にしないと。
「ここの低能回答者にも答えられるやさしい質問」だろw
746Name_Not_Found:2005/08/21(日) 01:02:22 ID:???
このスレって妙な奴らに妙な恨み買われてない?
なぜによ
747Name_Not_Found:2005/08/21(日) 01:13:42 ID:???
>>730,732

「改行なし」のセルって見出し?もしそうなら

<td>改行なし</td>を
<th>改行なし</th>に変えて
td { white-space:nowrap; } にしてみそ

もしくは自動改行抑えたいセルにクラス指定してみたら?
748Name_Not_Found:2005/08/21(日) 01:14:57 ID:???
>>747
まちがえた
th { white-space:nowrap; } だorz
749Name_Not_Found:2005/08/21(日) 06:34:46 ID:???
ちょっと質問です。

みなさんは画像を配置するとき、
background-image と imgタグ どちらを使用しますか?

750724:2005/08/21(日) 08:36:28 ID:???
>>733
ああ……すまん、てっきり"tableのプロパティ"を聞いてるのかと思った。
Java厨かと思ったんだ。まじすまん。
で、>>740じゃなくてposition, top, leftプロパティって答えて欲しいのか?
無学な俺にはどうしてそんな聞き方をするのか分からないんだがだれかご教授plz
751Name_Not_Found:2005/08/21(日) 09:58:45 ID:???
>>750
人間不信でJava厨で無知なのに教えたがりな君がどうしてここに粘着してるのかな
752Name_Not_Found:2005/08/21(日) 10:17:44 ID:???
listをfloatで横並びにするとマーカーが消えちゃうのはどうして?
753Name_Not_Found:2005/08/21(日) 11:22:21 ID:???
>>749
普通なら素直にimg要素
装飾画像を裏技的に使いたいのならbackground-image
754Name_Not_Found:2005/08/21(日) 16:44:59 ID:Fa3qCrYv
a:text {color : white ; }   ←これじゃダメなんですか?
a:link {color:white; text-decoration:none}
a:visited {color:white; text-decoration:none}
a:hover {color:yellow; text-decoration:underline}
a:active {color:red; text-decoration:underline}
755Name_Not_Found:2005/08/21(日) 16:56:04 ID:???
:link、:visited、:hover、:activeは疑似クラスといって
初めから用意されてる決まり文句。:textというのは存在しない。
a {color : white ; }
で不都合がありますか?
756Name_Not_Found:2005/08/21(日) 17:03:29 ID:j+e1P049
前にも誰かが;textのついたセレクタを用いてたな。
そのような擬似要素も擬似クラスもないはずだが、
だれがそんなことを教えているんだろうか。
もしかして何かのブラウザの独自仕様なんだろうか。
757www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/21(日) 17:13:31 ID:???
>>756
きっとどこかの嘘つきサイトが教えてるんだろ。
ぐぐってみるか…
758Name_Not_Found:2005/08/21(日) 17:56:23 ID:DpU8SDxk
>>754
a:link{color:#ffffff; text-decoration:none}
a:visited{color:#ffffff; text-decoration:none}
a:active{color:#ffffff; text-decoration:none}
a:hover{color:#ffffff; text-decoration:under-line}
759Name_Not_Found:2005/08/21(日) 17:57:24 ID:DpU8SDxk
underlineダ
間違イ
760質問者:2005/08/21(日) 18:36:22 ID:???
みなさま、先週はお世話になりました。

先週まで15インチ(1024×768)のノートPCでデザインしていたのですが
本日ネットワーク上にあるCRT(800×600)で見てみたところ
<h2>などでは上下半分で切れたり文字がすごく小さくなったりで
まともに見れたものじゃありませんでした。
CRTを1024×768にプロパティ変更して見ましたが同じでした。
CRTの方でノートPCの時のように変更し又ノートで見てみると
今度は<h2>などぶっとくなり過ぎて見れたものじゃありません。
このような時はどこに気をつけていけばよいのでしょうか?
あまりにも初歩的な質問をお許しください。

どうぞよろしくお願いいたします。
761Name_Not_Found:2005/08/21(日) 18:43:38 ID:???
マージンや文字サイズをemや%で指定する
普段から800幅・1024幅などで確認する癖をつける

自分はこんな感じかなぁ。モニタの解像度は1280*1024。
HTMLやCSSを気にしだしたらIE・NN・FF・Opera等一通りそろえて
チェックするようになってしまった。
いくつもCSS作る根性ないから振り分けしてないしなぁ。
762質問者:2005/08/21(日) 19:01:11 ID:???
>>761
レスありがとうございます
やはり皆さんも解像度にあわせて あーでもない こーでもないと 
チェックし手直しされながらデザインされてるんですね

マージンや文字サイズもemで指定しているのですが
もう一度見直してみます。何か根本的なミスがあるのかもしれませんし。

しかし、たとえばヤフーのTOPなどどちらで見てもほとんど変わりはないのに
私の場合の変わりようはえらいことになってしまっています。
ほんとにうまく作らないと違う解像度では見れないということですね。
ブラウザによって見え方が違うのは分かるのですが
解像度によりこんなにもデザインが変わってしまうなんてショックです。
763Name_Not_Found:2005/08/21(日) 19:22:41 ID:???
解像度変えてもなんも変わらんぞうちだと。
ただドットの細かさが変わるだけで
764Name_Not_Found:2005/08/21(日) 19:34:12 ID:???
>>758
それでは
<a name="〜">・・・</a>
の部分が白くならない。(そうしたいのかどうかは知らない)
また:activeの記述が:hoverで上書きされてしまう。
(:active状態は:hover状態でもあるので:activeを後に記述する)
765Name_Not_Found:2005/08/21(日) 19:35:05 ID:???
>>763
それならそれでいいんじゃね。
というか、そういうサイトのほうが親切度は上だろう。
640ピクセルでも見れますとかだと狭くて見難いぞゴルァとか思うけど。
オペラ、ページ表示領域の大きさをリアルタイムで表示してくれる設定があるから重宝してる。
パネル出した状態で幅800、消したら幅1024になるようにしてるので
サイトの確認も楽だな。
766質問者:2005/08/21(日) 19:36:02 ID:v899s8Pl
>>763
それがですね
例えばノートでは 長編小説レビュー って一列なんですけど
CRTでは 長編小説レ
        ビュー
って感じで2段になってバックの色帯もぶっとくなって
ぐちゃぐちゃなんですよー。 はーっ。。。
767質問者A:2005/08/21(日) 19:45:56 ID:hMvb4glk
たとえば、企業が使うソフトとかを開発したいって思ったら、どこに依頼すればいいんだ!?
ライブドアじゃねーし…。SEに言ってもなあ…。教えてくれー!!
768Name_Not_Found:2005/08/21(日) 20:02:55 ID:Fa3qCrYv
>>755
>>756
デフォルトのテキストを白にしたくて他のを真似してやってみたんですが・・・。

どうやったらいいんでしょうか?
a {color : white ; }←これではできませんでした
769Name_Not_Found:2005/08/21(日) 20:10:45 ID:???
>>768
body { color:#ffffff; }
770Name_Not_Found:2005/08/21(日) 20:12:59 ID:???
>>769
ありがとうございます。できました。
771Name_Not_Found:2005/08/21(日) 23:38:18 ID:???
意味もわからずいじってるってなんだか凄い冒険家だなぁ
772Name_Not_Found:2005/08/21(日) 23:38:22 ID:???
スタイルシートを外部リンクにする場合、全てのファイルに
共通のものだけを外部から読み込みにして、ファイルごとに
個別のものはそのファイルに追加するのと、
共通の物も、個別の物も外部から読み込みで、クラスを
使って区別するのでは、どっちが効率がいいですか?
773Name_Not_Found:2005/08/21(日) 23:39:51 ID:DpU8SDxk
>>764
idも白くしたいんなら
a{color:#ffffff}
にしれ
それから、activeとhoverは別物
774Name_Not_Found:2005/08/21(日) 23:57:53 ID:???
>>772
ねぇねぇどうやったらIDを???にできんの??


おせーーーーーーーーーーーーーーーーーーーーーーーーて!!!!><
775Name_Not_Found:2005/08/21(日) 23:59:18 ID:???
>>747-748
thにしてもおかしくない内容でしたので使用させていただきました
どうもありがとうございました!
776Name_Not_Found:2005/08/22(月) 01:03:19 ID:???
>>774
おまいもなってるじゃん・・
777Name_Not_Found:2005/08/22(月) 01:44:14 ID:???

         〜〜〜ID:???の真相に迫る〜〜〜


この物語は(ry  そんなことより↑これ文字が波立った海に浮かんでるっぽくね??
778Name_Not_Found:2005/08/22(月) 01:55:35 ID:???
(´・ω・`)つ>>752
779Name_Not_Found:2005/08/22(月) 02:04:47 ID:???
>>778
確かモジラ系のバグだった希ガス
全UAで試してみ
780Name_Not_Found:2005/08/22(月) 02:53:07 ID:???
ttp://adp.daa.jp/tech/20041203.html
こちらのサイトのサンプルのページを、Firefoxで見ているのですが、
最後の「dl要素(フッターつき)を使う場合」で、
一番下に、1pxだけ、縦棒の背景画像が見えてしまっているのは、
Firefoxの不具合でしょうか?
自分も画像ではないですが、borderやbackground-colorなどで、
いろいろと枠を作っていると、1pxだけ、色が付かないときがよくあります。
ul,liや、dlなどのリスト系を使うとなると思うのですが・・・。
これは、何か解決策はありますでしょうか?
781Name_Not_Found:2005/08/22(月) 09:47:07 ID:???
>>780
文字の大きさを大きくしたり小さくしたりしてみ、多分なくなるから
確かめてないけど、これbackground-imageをno-repeatにしてないせいじゃないか?
782Name_Not_Found:2005/08/22(月) 09:48:05 ID:???
あ、嘘つきました、no-repeatにしてるな
783Name_Not_Found:2005/08/22(月) 13:09:59 ID:???
>>780
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9a1) Gecko/20050813 Firefox/1.0+
だけどなかった。
dl要素を使う場合。のところの横枠が欠けてただけ。
784Name_Not_Found:2005/08/22(月) 13:11:43 ID:???
divの上にヘッダ/フッタが乗っかってて、フッタより下にdivの背景が飛び出してるからでしょ。
ピクセル数計算する時の切り捨て処理の問題じゃないかな。
バグって言えばバグだけど。

いちばん簡単な回避方法は、下地がはみ出さないように
.part2 totop { position: relative; top: 1px; }
とかでフッタを下に移動しちゃう事かなぁ。
あんまりいい方法とは言えない気もするけど。
785Name_Not_Found:2005/08/22(月) 13:18:16 ID:???
すみませんちょっと教えてください

firefoxとsafariとoperaとieと

このいずれのブラウザはスタイルシートの解釈がそれぞれ違ったりするんですか?
786www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/22(月) 13:22:52 ID:???
>>785
>>1を見ろ!しっかり…
787Name_Not_Found:2005/08/22(月) 13:54:27 ID:T+kIweCg
スタイルシートを使って、リンクテキストにマウスポインタを乗せると別の場所の画像が切り替わる
ということをしたいのですが、どうすればいいのでしょうか?
788Name_Not_Found:2005/08/22(月) 13:58:36 ID:???
>>787
正攻法じゃ無理
JSやフラッシュ使った方がいい
789Name_Not_Found:2005/08/22(月) 14:08:58 ID:T+kIweCg
>>788
回答ありがとうございます。
javaのスレで聞いてみます。
790Name_Not_Found:2005/08/22(月) 15:32:38 ID:???
待て、JavaじゃなくてJavaScriptだが、そこらへんわかってるか?
791www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/22(月) 15:50:23 ID:???
>>791
大丈夫、ちゃんとJSの質問スレで奴を見たからwwwwwwwww
792www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/22(月) 15:50:55 ID:???
ゴメスwww>>791じゃなくて>>790
793Name_Not_Found:2005/08/22(月) 16:19:03 ID:???
.contents {
padding:0px;
margin:0px 0px 0px 150px;
width: 300px;
}

#footer {
padding:0.5em;
text-align: right;
margin:0px 0px 0px 150px;
width: 300px;
}
というスタイルシートを使っています。IEでは問題なく表示されるのですが、firefoxでみるとfooterが少し右に飛び出します。
paddingの分だけ飛び出していることは分かり、.contentsのpaddingを弄りましたが、今度はIEでも表示が乱れる始末です。
何か解決方法があったら教えてください。
794Name_Not_Found:2005/08/22(月) 16:21:57 ID:???
>>793
IEはドキュメントタイプを書かない(大雑把)と、うんこモードになって、
paddingを幅に含めてしまいます。
標準では、paddingは幅に含まれないので、その例では300px+0.5emの幅になるわけです。
795www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/22(月) 16:22:14 ID:???
>>793
状況がわからんな、スクリーンショットくれ!
796www.unco.jp☆ ◆z.fnC4lCx2 :2005/08/22(月) 16:22:54 ID:???
あ、そういうことね。文句はIEに言ってくれ!
797Name_Not_Found:2005/08/22(月) 16:27:02 ID:???
右寄せしたボックスの中にある文字列を、
そのボックスの中で左寄せにする方法はないでしょうか。

<p>本日はご来場ありがとうございました。</p>
<div>代表取締役 山田太郎<br>
実行委員長 佐藤はな子</div>

これを、
例1:
本日はご来場ありがとうございました。
         代表取締役 山田太郎
        実行委員長 佐藤はな子

こうではなく、↓のようにしたいです。

例2:
本日はご来場ありがとうございました。
        代表取締役 山田太郎
        実行委員長 佐藤はな子

単にdiv{text-align:right;}だと
例1のようになってしまいます。

よろしくお願いします。
798 ◆z.fnC4lCx2 :2005/08/22(月) 16:39:42 ID:???
ヒント : text-align:left
799Name_Not_Found:2005/08/22(月) 16:40:21 ID:???
魔神
800Name_Not_Found:2005/08/22(月) 16:52:15 ID:???
マジレス
<table align=right>
<tr><td align="left">代表取締役 山田太郎<br>実行委員長 佐藤はな
</td></tr></table>
801Name_Not_Found:2005/08/22(月) 16:55:04 ID:???
margin-left: auto;
802Name_Not_Found:2005/08/22(月) 16:58:15 ID:???
htmlに配置したswfの上にCSSでレイヤーを被せても必ず
swfファイルが優先されて上に表示されます。
レイヤーでz指定したんですが、それでも上に表示されちゃいます。

これを回避する方法ご存知の方いらっしゃいますか?

よろしくお願いいたします。
803Name_Not_Found:2005/08/22(月) 17:19:31 ID:???
>>800
いやレイアウトにテーブルはできれば使いたくないです…

>>798>>801
ありがとうございます。できました!
div{
text-align:left;
width:11em;
margin-left:auto;
}
とやったらうまくいきました。
どうもありがとうございました。

auto指定は真ん中揃えのときしか使ったことがなくて
まだ挙動がよくわかっていません。
勉強しようと思います。
804Name_Not_Found:2005/08/22(月) 17:24:17 ID:???
おい! ウンコ野郎! 元気か!?
805 ◆z.fnC4lCx2 :2005/08/22(月) 17:26:12 ID:???
おう、元気だ!何か?
806 ◆z.fnC4lCx2 :2005/08/22(月) 17:26:36 ID:???
どうも、うんこ野郎です。
ttp://www.unco.jp/
807 ◆z.fnC4lCx2 :2005/08/22(月) 17:29:01 ID:???
>>803
どういたしまして…
質問内容斜め読みしたからいい加減な答え書いてしまったが、解決したなら吉。
808Name_Not_Found:2005/08/22(月) 17:43:06 ID:???
プルダウンの中の文字を右寄せにしたいのですが、
text-alignでrightを指定するとfirefoxではきちんと右に寄るんですが、
IE6では寄りません。
IEでも右寄せにする方法はないのでしょうか
809 ◆z.fnC4lCx2 :2005/08/22(月) 17:51:00 ID:???
>>808
ソース見せれ!
810808:2005/08/22(月) 17:55:48 ID:???
テスト用に簡単につくったものですみませんが、こんな感じです。

【html】
<body>
<form name="form1" method="post" action="">
<select name="select">
<option selected>あいうえお</option>
<option>あい</option>
<option>うえ</option>
<option>おかき</option>
</select>
</form>
</body>

【css】
option { text-align:right; }
811 ◆z.fnC4lCx2 :2005/08/22(月) 17:57:14 ID:???
あらあら、火狐ではOKなのにIEでは駄目ですか?
IEに文句言って下さいね。
812Name_Not_Found:2005/08/22(月) 18:06:04 ID:???
>>794
レスありがとうございました。
DOCTYPEは
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
と指定しています。
>>5
の一番上のwidthの仕様が絡んでるっぽいですね。ちょっと調べてきます

>>796
IEのうんこー!
813Name_Not_Found:2005/08/22(月) 18:13:14 ID:???
                   ヘ へ
                  :| / /
            ∧∧,..,.. ;'、., : 、
           ;'゚Д゚、、:、.: : ;:'
           '、;: ...: ,:. :.、.: '  
            `"∪∪''゙
         ∩     ∩
         //      | |
        // Λ_Λ  | |
        | |( ´Д`)// <うるせぇ、IEのフライぶつけんぞ
        \      |
          |   /
         /   /
         |   |
814 ◆z.fnC4lCx2 :2005/08/22(月) 18:14:10 ID:???
どうぞ↓
815Name_Not_Found:2005/08/22(月) 18:17:40 ID:???
│    _、_
│  ヽ( ,_ノ`)ノ 残念 私のおいなりさんだ
│ へノ   /
└→ ω ノ
      >
816Name_Not_Found:2005/08/22(月) 18:54:04 ID:???
         '、;: ...: ,:. :.、.: '  
          `"∪∪''゙
        //Λ_Λ  | |
        | |( ´Д`)//
        \      |      ミ
          |     lヽ,,lヽ 
          |    (    ) やめて
          |    と、  ゙i  衣はげちゃう
817Name_Not_Found:2005/08/22(月) 20:03:37 ID:???
>>812
一行目にXML宣言付けてるならそれが原因。
 IEのDOCTYPEスイッチのミス
付けてないならどっか間違ってるに200ペソ。
818Name_Not_Found:2005/08/22(月) 20:56:18 ID:???
CSS色分けできるテキストエディタってあるの・・・??

あったら見やすくて便利そう・・・
819Name_Not_Found:2005/08/22(月) 21:08:34 ID:f5A5VygK
classとidの違いを教えてください。
マジレスお願いします。
820Name_Not_Found:2005/08/22(月) 21:13:12 ID:???
idは1ページに1つだけ
classは何個でも

初心者はこう覚えておけばいいんでないかい?
821Name_Not_Found:2005/08/22(月) 21:19:41 ID:f5A5VygK
ありがとうございます。
idの中にclassや、classの中にidがあってもいいのですか?
822Name_Not_Found:2005/08/22(月) 21:26:51 ID:???
はぁ?
823Name_Not_Found:2005/08/22(月) 21:31:03 ID:???
>>822
素人は出てくんなよ
824Name_Not_Found:2005/08/22(月) 21:32:28 ID:???
>>822
プッ
825Name_Not_Found:2005/08/22(月) 21:36:03 ID:???
>>821
おk
826Name_Not_Found:2005/08/22(月) 21:37:29 ID:f5A5VygK
>>825
ありがとうございます。

質問の仕方が悪かったようです。
失礼しました。
827Name_Not_Found:2005/08/22(月) 21:45:20 ID:???
>>826
夏厨が混ざってるだけだから気にすんな
828Name_Not_Found:2005/08/22(月) 21:59:58 ID:???
>>817
ばっちし1行目にXML宣言あります。
仕様ちゅーことであきらめようと思います。

もう一回言っていいですか?
IEのうんこー!

829 ◆z.fnC4lCx2 :2005/08/22(月) 22:06:41 ID:???
>>828
やめなさい。またIEフライが飛んできますよwwwwwww
830Name_Not_Found:2005/08/22(月) 22:07:10 ID:???
>>828
2回までにしとけよ
831Name_Not_Found:2005/08/22(月) 22:15:02 ID:???
>>828
俺は最初のうちはIE用CSSで分離してたけど、最近あきらめがついたよ。
832Name_Not_Found:2005/08/22(月) 22:16:31 ID:???
                   ヘ へ
                  :| / /
            ∧∧,..,.. ;'、., : 、
           ;'゚Д゚、、:、.: : ;:'
           '、;: ...: ,:. :.、.: '  
            `"∪∪''゙
         ∩     ∩
         //      | |
        //   Λ_Λ  | |
        | |( ´Д`)// <うるせぇ、えびフライぶつけるぞ
        \      |
          |   /
         /   /
         |   |
833Name_Not_Found:2005/08/22(月) 22:22:25 ID:???
>>818
たくさんあります
834 ◆z.fnC4lCx2 :2005/08/22(月) 22:24:38 ID:???
   Λ_Λ    ∧∧
  ( ´Д`(# く;'゚Д゚

>>828
IEがうんこ以下なのは前からわかってるんだよ。
それを乗り越えないと、いけないんだって。
今やIE様はユーザが多いから急いでバグ直す必要も無いのだろうね。
835Name_Not_Found:2005/08/22(月) 22:55:15 ID:???
ブラウザのデフォルトスタイルシートをリセットするCSSよろ↓
836Name_Not_Found:2005/08/22(月) 23:00:35 ID:???
そんなことが出来ちゃったら困るだろ
837Name_Not_Found:2005/08/22(月) 23:02:05 ID:???
* {
* : reset !important;
}
838Name_Not_Found:2005/08/22(月) 23:22:20 ID:???
まだ、もうずっと人大杉?
839Name_Not_Found:2005/08/22(月) 23:57:05 ID:wWlrDJur
>>821
class と id を同時に指定するのはok
例:<div id="hoge" class="hage"></div>

id="class" や class="id" の様に文字として書く事も可
840Name_Not_Found:2005/08/23(火) 00:24:54 ID:???
>>821
<div id=hage>
<div class=hige></div>
</div>

<div class=hige>
<div id=hage></div>
</div>
もおk。
841Name_Not_Found:2005/08/23(火) 00:49:07 ID:???
ここの住人は高度な質問が出ると答えれない(スルーをかます)らしいです

誰か高度な質問かましてやってください><

こいつらただの教えたがりの青二才どもです><
842Name_Not_Found:2005/08/23(火) 02:46:24 ID:???
そんな高度な質問できる奴は一人で試行錯誤する。
843Name_Not_Found:2005/08/23(火) 02:49:50 ID:???
CSSなら日立ですか?
844Name_Not_Found:2005/08/23(火) 05:35:06 ID:???
高度過ぎる質問で私には答えられない。次どうぞ
845 ◆z.fnC4lCx2 :2005/08/23(火) 07:51:36 ID:???
>>698,700,702,704,706,708,710,712,716,743,745,841
これ全て同一人物か。乙!
846Name_Not_Found:2005/08/23(火) 12:22:25 ID:???
847Name_Not_Found:2005/08/23(火) 12:26:19 ID:???
>>818
みみかきエディタ
848Name_Not_Found:2005/08/23(火) 13:43:02 ID:???
>>847
それは旧名。しかも、ミミカキエディットだし。
現在は mi といいます。
849Name_Not_Found:2005/08/23(火) 14:19:39 ID:???
どっちにしろドザーには関係ない話さ
850Name_Not_Found:2005/08/23(火) 17:49:26 ID:???
>>818
gvimマジオススメ
851Name_Not_Found:2005/08/23(火) 18:07:18 ID:???
>>818
うはwwwwwwwwww俺xyzzywwwwwww
852 ◆z.fnC4lCx2 :2005/08/23(火) 19:31:04 ID:???
           
   ∩____∩ 
   | ノ    ヽ
  /  ●   ● | 
  |    ( _●_)  ミ <なかなかCSSって普及しませんねwwwwww
 彡、   |∪|  /
/ __  ヽノ /
(___)   /
853Name_Not_Found:2005/08/23(火) 19:48:09 ID:98OoKetL
質問ですが、
テーブルの代わりに<ul><li>使って画像を配置したいのですが、
winIEでは上下に余白ができてしまいます。
マージンもパディングも0に設定してあるのですが、それでも余白が消えません。
リストにはいろいろとサイズの違う画像を並べたいと思っております。

余白を消すやり方ってあるのでしょうか?
winIEだけ表示できればそれでいいのですが。。。

よろしくおながいします。
854 ◆z.fnC4lCx2 :2005/08/23(火) 19:53:44 ID:???
ソースを晒せ、話はそれからだwwww
855853:2005/08/23(火) 20:07:52 ID:98OoKetL
http://www.heartfull-machi.com/index3.html
↑とりあえず適当なものをここに置いておきました。
横712pxでピッタリに配置したいんですが、横に余白ができてしまいます。
幅178pxの画像を4つ並べればピッタリになると思っていましたが、考えが甘かったです。

どうかよろしくお願いいたします。


#navi {
width: 712px;
float: left;
margin-top: 5px;
margin-left: 4px;
margin-right: 4px;
margin-bottom: 10px;
}

#menu{
width: 712px;
margin:0px;
padding:0px;
}

ul#menu li{
display:inline;
width: 178px;
height:auto;
margin:0px;
padding:0px;
list-style-type:none;
}
856 ◆z.fnC4lCx2 :2005/08/23(火) 20:25:07 ID:???
>>855
IEじゃなくても(Firefox)でも、上下に余白はできるよ。
で、ローカルで試したけど、これでおk?
ttp://best-space.jp/vipper/uploader/src/up0028.png

希望通りだったら連絡よろ。
857Name_Not_Found:2005/08/23(火) 20:27:21 ID:???
>>855
関連要素間に空白類文字を直接含むのはイクナイ。
ココだって文章何行かドラッグすると、右端に半角スペース分の領域が発生するっしょ。
空白類文字を含むと予期せぬ余白が発生するので、今回みたいに敷き詰めるとか考えてるなら注意すべし。
見栄えの為に改行やインデントをしたかったらコメント化を利用汁。

ブロックレベル要素に包含される要素がimg要素のみの場合は置換インライン要素なので下端がbaseline揃えで表示されまふ。
ブラウザによってはディセンダが考慮されずに余白の扱いが統一されないので一括でもセレクタ使ってでもimg要素にvertical-alignでtext-bottomを指定することをお奨めする。
本来は考慮されるし、余白を無くすのにもプロパティ値はbottomでいいんだけれども、IEの挙動がイカれてるのでtext-bottomにしてくらはい。

分からんかったら試してから再度質問汁。
858853:2005/08/23(火) 20:31:16 ID:98OoKetL
>856

お返事どうもありがとうございます。
でも、すみません。
853では上下の余白と書きましたが、慌ててサンプルをアップしたので、855では横の余白の問題で出してしまいました。
855のサンプルで作ってくださっているので、それでお伺いしたいのですが、横がピッタリになると画像一個折り返しになっているのが解消されると思うのですが、どうにかなりますか?

ややこしくしてしまってすみませんが、どうかよろしくお願いいたします。
859 ◆z.fnC4lCx2 :2005/08/23(火) 20:34:06 ID:???
>>858
まとめると、メニューの画像を一列にしたいって事かい?
860853:2005/08/23(火) 20:38:49 ID:98OoKetL
>857
ありがとうございます。
でも、ちょっと自分にはレベル高い回答でした。
自分なりの解釈で挑戦してみます。
わからなかったらまた質問いたします。


>859
ありがとうございます。
そういうことです。

855のパターンでは横1列に、隙間なくピッタリに並べたいと考えております。
説明下手で申し訳ないです。
861Name_Not_Found:2005/08/23(火) 20:43:37 ID:???
>>853
とりあえず、
<ul>〜</ul>の
<li>部分の改行をとっぱらったら、横一列になったけど?
862 ◆z.fnC4lCx2 :2005/08/23(火) 20:47:40 ID:???
>>861
確かに横一列になりましたがね…
画像の幅の合計が、712pxより大きいからはみ出してますが…俺だけ?
863853:2005/08/23(火) 20:48:57 ID:98OoKetL
>861
ほんとだー!
どうもありがとうございます。

もしかして、857さんの「関連要素間に空白類文字を直接含むのはイクナイ。」というのはこういうことですか?

このやり方が解決方法ですかね。

864 ◆z.fnC4lCx2 :2005/08/23(火) 20:52:00 ID:???
はみ出してる。ちなみに ul#menu li のmarginを1pxにした。見にくいから。
ttp://best-space.jp/vipper/uploader/src/up0029.png
865853:2005/08/23(火) 21:01:01 ID:98OoKetL
>862
ありがとうございます。
調べてないですが、178を4つで712になるので
もしかしたら影との間隔が712pxと違っている可能性があります。
準備不足ですみません。
866Name_Not_Found:2005/08/23(火) 21:02:37 ID:???
MacIEだとはみ出してないのだー。
文字らもはみ出してないのだー。
Winを起動させて確認したらはみ出していたのだー。
867Name_Not_Found:2005/08/23(火) 21:03:58 ID:???
>>865
#naviは何のためのフロートなの?
868 ◆z.fnC4lCx2 :2005/08/23(火) 21:10:43 ID:???
>>866
おや、私はFirefoxですよ。
WinIEはうんこじゃないようですね(^^;
869853:2005/08/23(火) 21:12:06 ID:98OoKetL
>867
ご指摘ありがとうございます。
イメージを伝えるため急ぎ用意したものなので、コピペのカタマリです。
余計なものもくっついてきているかと思います。
紛らわしくてすみません。

もしかして、フロートのせいで何かなるということはあるでしょうか?

870Name_Not_Found:2005/08/23(火) 21:23:56 ID:???
>>869
イメージを伝えるため。ってどうせならポジション使えば。
自分でプロパティ適用させたり解除したりで挙動確かめてごらんなさい。

CSS慣れてないならテーブル使ってでも構成してみなょ。
871853:2005/08/23(火) 21:42:11 ID:98OoKetL
>870
ご指摘ありがとうございます。
ついつい甘えて短絡的な質問になってしまいました。
まだまだCSS勉強中の身、自分でもいろいろと試してみます。


みなさんも付き合ってくれてどうもありがとうございます。

872 ◆z.fnC4lCx2 :2005/08/23(火) 21:45:14 ID:???
どういたしまして。どうも 「うんこ野郎」です。
www.unco.jp
873Name_Not_Found:2005/08/23(火) 21:56:46 ID:???
>>843
てか、何故日立と思う?迄の過程を説明汁
874Name_Not_Found:2005/08/23(火) 22:07:39 ID:???
>>871
XHTML1.0ってonmouseoutとかの値に大文字含めて大丈夫だっけ?
875Name_Not_Found:2005/08/23(火) 22:18:20 ID:???
>>874
XHTML1(J)では、属性名は小文字で書かなければなりません。
⇒属性"値"に関しては何の規制もありません。
876Name_Not_Found:2005/08/24(水) 00:10:16 ID:???
2カラムでheightが100%のレイアウトを作っています。
テンプレを見てhtmlとbodyにheight100%を指定しており、その他のエリアも
divでheightを100%指定しています。

[side bar]  [main]
あああ   文章が入ります。
いいい    ・
ううう     ・
        ・


こういうようなレイアウトにした場合。main内の長さがブラウザの立てスクロールを
必要とするぐらい長くなった場合、mainは問題なく下に伸びるのですが
sidebarの方は下に伸びずに途中で切れます。

tableの表示のように、sidebarもmainも左右どちらも同じ長さだけ
伸びるようにするには、どのように指定すればいいのでしょうか?
877Name_Not_Found:2005/08/24(水) 00:18:51 ID:???
>>876
どうやって2段組にしてますか?
クロスブラウザにしたいですか?
IEで実現できれば良いのでしょうか?
DTDは何ですか?何モードを適用させたいですか?
ハイブリッドデザインじゃダメですか?

どうでしょうか。
878Name_Not_Found:2005/08/24(水) 00:41:48 ID:???
>>877
長くなるので、出来るだけ完結にまとめます。

<div id="sidebar">aaa</div>
<div id="main">bbb</div>

html,body{ height:100% }
#sidebar{ height:100%; background-color:#cccccc;}
#main{ height:100%; background-color:#cccccc;}

IE6.0とFirefoxです。
DTDは<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
ハイブリッドでは駄目です。
879Name_Not_Found:2005/08/24(水) 00:54:04 ID:???
>>877
2段組の方法は…?
HTML4.0(識別子無し)で定義している理由はありますか?

ハイブリッドデザインがダメな理由はありますか?
特別な理由があれば合わせますが…。

CSSハックは利用してもいいですか?
880876:2005/08/24(水) 00:56:25 ID:???
>>879
すみません、肝心なところが抜けていました・・。
再度、cssを書きます。
html,body{ height:100% }
#sidebar{ height:100%; background-color:#cccccc;float:left;}
#main{ height:100%; background-color:#cccccc;float:right}

>>HTML4.0(識別子無し)で定義している理由はありますか?
特にありません。Dreamweaverを利用しているものですから。。

>>ハイブリッドデザインがダメな理由はありますか?
そこまでの事をしたいわけではないからです。

>>CSSハックは利用してもいいですか?
使用しないで下さい。


このような回答で意図が伝わりますでしょうか?
881Name_Not_Found:2005/08/24(水) 01:22:34 ID:???
>>880
完成形は>>876の時点で想像ついたのですが、条件を絞るための質問でした。
IEの解釈に対応するのは困難なので、出来るか出来ないかは分かりません。

ただ、まだ理想形に関して分からないことがあります。

>>876
> sidebarの方は下に伸びずに途中で切れます。
これは、切れるというのは背景のことでしょうか?
であれば、ラッパーし、そのブロックで同色の背景を付けるだけで良いのでしょうか?
※単純な左、右だけなら、bodyの背景色で補えるはずですが;

次に、>>880のハイブリッドデザインについて。
> そこまでの事をしたいわけではないからです。
どういう意味ですか?テーブルで組めば一発なのですが。
テーブルレイアウトを利用してはならない理由を聞いたのですが…。
まぁ、前者(ラッパー利用)でよければ簡単に出来ます。

理想形の条件が緩いようですが、宜しいのでしょうか。
882876:2005/08/24(水) 01:45:36 ID:???
>>881
>これは、切れるというのは背景のことでしょうか?
はい。左右のエリアに指定している背景が切れるのです。
どちらかのエリアに文が下に続くぐらい長いと。

>> そこまでの事をしたいわけではないからです。
>>どういう意味ですか?テーブルで組めば一発なのですが。

確かにテーブルですれば一発ですが、ここはCSSのスレですよね?
CSSのみでのレイアウトにこだわっているもので、極力、表意外は
テーブルを使いたくないんです。テーブルレイアウトなら簡単に出来ますね。
883876:2005/08/24(水) 01:52:29 ID:???
アップローダーにアップしましたので、ごらんいただければ幸いです。
http://tool-ya.ddo.jp/2ch/trash-box/file/20050824015146458.html
884Name_Not_Found:2005/08/24(水) 02:09:00 ID:???
>>883
Firefoxだとmainもちゃんと下に伸びないんだけど・・・

sidebar、mainともheightに最低サイズ(1画面分)を指定しておいて
mainが伸びたら、同じだけsidebarも伸ばしたい。って事?

<!-- 関係ないけど、1行目だけ改行コードがLfになってたよ -->
885876:2005/08/24(水) 02:13:37 ID:???
>>884
すみません、Firefoxでもおかしいみたいですね。。

>>sidebar、mainともheightに最低サイズ(1画面分)を指定しておいて
>>mainが伸びたら、同じだけsidebarも伸ばしたい。って事?

そういう感じです。テーブルだと↓のような表示になるのを
CSSでやりたいのです。
<table width="100" height="100%" >
<tr>
<td bgcolor="#CCCCCC"> </td>
<td bgcolor="#CCCCCC"> </td>
</tr>
</table>
886Name_Not_Found:2005/08/24(水) 02:18:59 ID:???
table には height など無いのだが・・・
887Name_Not_Found:2005/08/24(水) 02:22:01 ID:???
>>886
・・・・
888Name_Not_Found:2005/08/24(水) 02:24:52 ID:???
> <!ATTLIST TABLE -- table element --
> %attrs; -- %coreattrs, %i18n, %events --
> summary %Text; #IMPLIED -- purpose/structure for speech output--
> width %Length; #IMPLIED -- table width --
> border %Pixels; #IMPLIED -- controls frame width around table --
> frame %TFrame; #IMPLIED -- which parts of frame to render --
> rules %TRules; #IMPLIED -- rulings between rows and cols --
> cellspacing %Length; #IMPLIED -- spacing between cells --
> cellpadding %Length; #IMPLIED -- spacing within cells --
> %reserved; -- reserved for possible future use --
> datapagesize CDATA #IMPLIED -- reserved for possible future use --
> >

確かに無い。
889Name_Not_Found:2005/08/24(水) 02:41:40 ID:???
>>885
最低サイズを指定、最大サイズは可変ってのは、自分も昔やろうとしたけど、うまくいかずに諦めた憶えが・・・

サイドバーとメインの長さを同期させるってのは、正攻法じゃ無理だと思うので
サイドバーとメインを入れるコンテナを作って
<div id="container"> <!-- ここにサイドバーとメインの背景色(同じ色じゃないと駄目) -->
 <div id="sidebar></div>
 <div id="partition"></div> <!-- 仕切り線。背景色にbodyの背景色と同じ色を -->
 <div id="main"></div>
</div>
という具合に、同期してるように見せかけるのはどうでしょう?(bdoyの背景が画像だったらアウト)
最低サイズを指定しなければ、一応これで同期が取れるには取れるかと。
納得いって貰えなさそうだけど・・・
890876:2005/08/24(水) 02:57:57 ID:???
>>889
ありがとうございます。いささか汎用性が下がる気もしますが
そういう方法しかなさそうですね・・。

ありがとうございます。大変参考になりました。
891881:2005/08/24(水) 02:58:56 ID:???
>>876-890
作ってみた。
漏れはもう寝る。

分かりやすいように色変えといたが、適当に直してくれ。
sidebarとcontainerの背景色を同じにすれば良いかと。
つか適当にやってくれ。

http://www.42ch.net/UploaderSmall/source/1124819648.dat

何かあったら、また夜だな。


IE6.0とFFしか考えてないから。
まぁ標準モードで解釈できるブラウザなら多分大丈夫。
marginとpaddingを使い分けてるから、直すなら注意。
挙動変わってくるからな。では。
892876:2005/08/24(水) 03:05:11 ID:???
>>891
お手間を取らせてすみません。。こちらも参考にさせていただきます。
本当にありがとうございました。
893891:2005/08/24(水) 03:13:16 ID:???
2カラムで、基本全体縦横100%、超越したらメイン基準ってので、
ヘッダ 縦固定値
メニュ 横固定値
メイン 縦横可変
フッタ 縦固定値
で、各ブロックでのスクロールバー表示が絡んでくる構成を考えたことがあるんだが、

これのクロスブラウザ化が、ハック使っても漏れには出来なかった。
もし出来るって人居たら教えてくれ(つд`)マークアップは何でもいいw
|彡
894Name_Not_Found:2005/08/24(水) 05:21:55 ID:???
はてなダイアリーを指定なしで一から作っているのですが、伸びたサイドバーが日記の方へ回りこんでしまいます。
すれ違いかもしれませんが、対処の仕方を教えてください。よろしくお願いします。

div.hatena-body {
width: 800;
margin: 0px 0px;
overflow: hidden;
background-color: #f0f;
}

div.main{
float: left;
text-align: left;
width: 500px;
background-color: #cc0000;
}

div.sidebar{
float: right;
width: 230px;
background-color: #008080;
padding: 0px 0px;
}
895Name_Not_Found:2005/08/24(水) 09:49:14 ID:???
>>876
どうしてプロパティに height: 100%; を指定してるんだ?
説明よろしく。
896Name_Not_Found:2005/08/24(水) 10:03:10 ID:???
画面いっぱいに表示がとりあえずの最低サイズって事を言いたいからじゃ?
上のレイアウトで、メインがheight: 100%; じゃ必ず画面からはみ出すけどね
897Name_Not_Found:2005/08/24(水) 12:49:31 ID:???
水平線を1pxで横幅100%にしたいのですが、
HR {
color:#000000;
height:1px;
border-top:solid 1px #000000;
border-left:none;
border-right:none;
border-bottom:none;}
これだとIE・FF・Operaでは問題ないのですが、NNでは横に1px分ほどずれて横スクロールバーが出てしまいます。
出ないようにするにはどうしたらいいでしょうか?
ブロックのborderでやった方がいいんでしょうか…
898Name_Not_Found:2005/08/24(水) 13:01:03 ID:???
>>897
margin、width,、paddingあたりを調節してみ
899Name_Not_Found:2005/08/24(水) 14:31:38 ID:???
>>898
margin:0px;で無事消せました!bodyで既に指定していて考えにありませんでした。
ありがとうございます。
900Name_Not_Found:2005/08/24(水) 17:31:30 ID:???
<div class=contents>

<div class=leftleft> (ラッパー)

<div class="topleft"> (メニュー)
内容
</div>

<div class="topright"> (記事))
内容
</div></div>

<div class=rightright> (アフィリエイト)
内容
</div>

<div id="footer">
内容
</div>

と3カラムで作っているのですが、IEだとうまく表示されるのに NNやFIREFOXだと
<div class=contents>の中にラッパーから下が入ってくれないのですが
どうしたらいいでしょうか?よろしくお願いします。
901Name_Not_Found:2005/08/24(水) 17:34:38 ID:???
>>900
ページ晒せ
902545:2005/08/24(水) 18:14:59 ID:???
>>901
すいません解決しました。

新たな問題が・・・

#footer {
     background-color: black;
color: white;
margin : 0 auto;
padding-top: 5px;
padding-bottom: 5px;
width : 700px;
border-top : solid black 1px;
font-size : small;
text-align:center;
}

と打ち込んでいるのですが、フッターの下に少し余白が出来てしまいます。

position: absolute;
bottom 0px;
を入れるとIEでは余白が無くなるのですが、NetscapeやFirefoxだとコンテンツと重なった
部分に表示されてしまいます。

余白を無くす方法、よろしくお願いします。

>>549
解決していませんでした・・・。
903Name_Not_Found:2005/08/24(水) 19:42:58 ID:???
>>902
各ブロックの構成がどうなってるか晒せ。
余計なことしなけりゃ余白なんか出来ねぇよ。

つか、positionを使う意味不明。挙動をよく理解してから使え。
904ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/24(水) 19:53:58 ID:???
今北帰宅。
今日は質問スゴスwwwwwww
905Name_Not_Found:2005/08/25(木) 00:41:54 ID:???
1つのhtmlファイル上でCSSを使って
2カラム・3カラムとCSSによって変更するのは難しいですよね?
通常は2カラムなら2カラム用のhtmlを、3カラムなら3カラム用のhtmlを
用意するのが無難ですよね?
906Name_Not_Found:2005/08/25(木) 00:43:28 ID:???
>>905
否。
初めから想定していればちょっとの工夫でやれる。
907Name_Not_Found:2005/08/25(木) 01:02:06 ID:???
>>905
cssとHTMLの分離を理解すればある程度の前提次第でできるよ。
他人といっしょにWEBページ作ったこと無いの?
908Name_Not_Found:2005/08/25(木) 01:20:35 ID:???
>>907
それは初耳だな
一人で作らせろよバカ
909有希:2005/08/25(木) 01:27:52 ID:???
>>907
「ある程度の前提次第」ってなに?

 おしえて おにいちゃん
910Name_Not_Found:2005/08/25(木) 01:27:52 ID:???
ジグザグで2カラムを3カラムにしたいんですけど、やっぱり難しいですね?
例えば

・あああ  本文
・いいい
・ううう
・えええ

という2カラムがあったとして

・あああ  本文  ・ううう
・いいい
・えええ

のような。それぞれをdivで囲ってfloatで振り分けつつclearしたら
出来るかなって思ったのですが、「ううう」が右上に来なくって
はまってます・・・
911Name_Not_Found:2005/08/25(木) 01:38:39 ID:???
>>910
試してみたfloatとclearの指定はどんな?
ソース晒してみ。
912ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/25(木) 01:38:39 ID:???
ふぅ・・・
913Name_Not_Found:2005/08/25(木) 01:39:46 ID:???
シンクロった(つд`)
914910:2005/08/25(木) 01:56:37 ID:???
>>911
IEだといけているように見えますが、Firefoxだと表示がおかしくなります・・・
http://rivernet.cool.ne.jp/upmini/200508f/20050825015523_3467.html
915Name_Not_Found:2005/08/25(木) 02:38:58 ID:???
>>914
考えたけどちょっとむずぃ。
FFだと表示がおかしく…って、FFの挙動が正常です。

うまい手があるかもしれんけど、今はポジションしか思いつかないな。
916910:2005/08/25(木) 02:39:46 ID:???
>>915
そうですか・・。色々とやっていただいたみたいで、ありがとうございます。
また、勉強してみます。
917ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/25(木) 02:47:39 ID:???
>>916
ガンガレ!ふぁ〜あ。('o`)
918Name_Not_Found:2005/08/25(木) 06:21:40 ID:???
スタイルシートによるボックス表示の中に更新していく記事を書こうと思っているのですが、
IEならまともに表示されるのですが、Geckoだとうまく表示されません。

SS
ttp://www.uploda.org/file/uporg177202.jpg

どのように修正すればGeckoでもIEのように表示できるのかご教授宜しくお願いします。

↓ソース
919Name_Not_Found:2005/08/25(木) 06:22:03 ID:???
>>909
こことか
【天皇陛下】皇室のWEBサイトを作ろう 2
http://pc8.2ch.net/test/read.cgi/hp/1123685159/

ここ見れ
皆が使えるテンプレートを作るスレ3
http://pc8.2ch.net/test/read.cgi/hp/1119085216/
920918:2005/08/25(木) 06:25:19 ID:???
HTMLソース
<DIV CLASS="1">
<DIV CLASS="2">08/01 祝!ウェブサイトオープン!!</DIV CLASS="2">
<DIV CLASS="3">
ウェブサイトオープンしました。<BR>
<BR>
このコーナーは、最近流行のブログのようなものです。<BR>
いろいろな事を面白おかしく書いていきたいなと思っています。<BR>
基本的に毎日更新していく予定ですので、お時間に余裕があるときなんかは覗いてやってください。<BR>
</DIV CLASS="3"></DIV CLASS="1">

CSSソース
/* 記事のボックス */ .1 {
width: 100%; margin: 30px 30px 50px 30px;
background-color: #F7F7FF;
border-width: thin;  border-style: outset;
}

/* 件名のボックス */ .2 {
.width: 100%;  margin: 30px 30px 30px 30px;  font-weight: bold; padding-left: 4px;
border-top-width: 0px;  border-right-width: 0px;
border-bottom-width: 1px;  border-left-width: 7px;
border-color: ; #909090;  border-style: ridge;
}

*/ 本文のボックス */ .3 { width: 100%; margin: 0px 60px 30px 60px; }

(少々詰めて書いてあります)
921有希:2005/08/25(木) 07:12:27 ID:???
おいおい html を一から勉強したほうがよくないか?
922Name_Not_Found:2005/08/25(木) 07:28:02 ID:???
>>920
・ソースの中に全角スペース入りまくりなのをどうにかしてくれ。特にCSSの方が致命的。
・id名, class名の命名規約を守る。(a-zA-Zから開始しなきゃいけない)
 http://www.htmlhelp.com/ja/reference/html40/special/a.html
そんだけ修正すれば、一応ちゃんと表示された。

というか、なんか>>920のソース見てると、マークアップの仕方がすごい微妙な気がするので(覚えたてなのかもしれないけど)
ちゃんとしたリファレンスとか、Web標準やらのドキュメントやら読んで、まともなマークアップの仕方覚えた方がいいかも。
923Name_Not_Found:2005/08/25(木) 07:35:31 ID:???
924Name_Not_Found:2005/08/25(木) 07:56:09 ID:???
>>920
これはあくまで経験上ですが、クラス指定に数字だけ使うと適用されないみたいですよ、Mozilla系は。

そのclass="1"になにか文字列加えてやれば大丈夫だと思うよ。

例:class="nuko1"
925924:2005/08/25(木) 07:58:49 ID:???
って>>922氏がわかりやすく的確に説明してくれてる・・・orz

おいらなさけね
926918:2005/08/25(木) 07:59:31 ID:???
>>922
>>923
PC用ウェブサイトを作るためCSSは最近少しだけ覚えました。
全角スペースはここに書き込む際に見やすいようにと入れてしまいました。
CLASS名を変えたら表示することができるようになりましたが、思ったとおりの表示になってくれません。
もう少し、勉強しなおしてみようと思います。
また、わからないことがあったらそのときもどうぞ宜しくお願いします。

ありがとうございました。
927Name_Not_Found:2005/08/25(木) 08:12:17 ID:???
idは数字から始まる文字列が禁止だが
classはいいんだっけ?
928Name_Not_Found:2005/08/25(木) 11:06:40 ID:???
だめにゃん
929Name_Not_Found:2005/08/25(木) 14:33:10 ID:???
>>927
一応、定義上問題ないのはnameトークンだけ。
数字から始まるのがダメとかじゃなくて、アルファベットから始めなくてはいけない。
アンダースコアとかハイフンは微妙。認められてたりダメだったり。
930Name_Not_Found:2005/08/25(木) 19:43:43 ID:???
勉強になるなぁ
931Name_Not_Found:2005/08/25(木) 23:52:58 ID:???
フィルターについて質問です。

<TABLE style="filter:alpha(style=0,opacity=50); background-color:#d9daea; color:#a0a0a0; font-

size:12px">
<TR><TD>
<DIV style="margin:2px; padding:10px; border:1px dashed #a0a0a0">
<P>ああああ</P>
<IMG src="wall.jpg" style="filter:none; background-image:url(wall.jpg); width:100px;

height:100px">
</DIV>
</TD></TR>
</TABLE>

画像だけフィルター適用外にしたいのですが、うまくいきません。
上手い解決法はあるでしょうか?WinXPsp2、IE6です。
932Name_Not_Found:2005/08/26(金) 00:01:21 ID:???
>>931
簡単にはできません
933Name_Not_Found:2005/08/26(金) 00:03:29 ID:???
ブロック要素のwidth属性にて最小幅だけ設定することは出来ますか?
例えば、最小値300pxでウィンドウ幅がそれ以上なら→枠いっぱい100%というような感じで
934Name_Not_Found:2005/08/26(金) 00:03:54 ID:???
すいません、
IMGの中のstyleのbackground-imageは無視してください。
935ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:06:54 ID:???
>>933
min-widthじゃなかった?
記憶にございません。。
936ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:07:47 ID:???
937Name_Not_Found:2005/08/26(金) 00:10:17 ID:???
300px の透明 gif
938Name_Not_Found:2005/08/26(金) 00:12:46 ID:???
>>933
それを可能にするプロパティは存在するんだが
ブラウザが悲しいまでに対応してない
939ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:13:09 ID:???
>>937
それだと横スクロールバーが出ると思われ。
940ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:13:45 ID:???
>>939 違ったorz
941Name_Not_Found:2005/08/26(金) 00:21:51 ID:???
うんこはだまっとれ!!
942933:2005/08/26(金) 00:24:05 ID:???
ウンコ野郎 www.unco.jp さんどうもです
でもdiv や table には対応してないみたいですね・・・

>>938
そうなんですか残念です。
contentと同様はやく実装して欲しいす
943ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:24:07 ID:???
どうも うんこ野郎です。 www.unco.jp
下品ってメール貰ったのでリネームしようと思います。
944ウンコ野郎 www.unco.jp ◆z.fnC4lCx2 :2005/08/26(金) 00:24:57 ID:???
>>942
あらそう…残念ね。
945Name_Not_Found:2005/08/26(金) 00:33:18 ID:???
>>942
対応してないのはIEだけ。
(ということは9割以上対応してないって事でもあるが。)
946under ◆z.fnC4lCx2 :2005/08/26(金) 00:36:25 ID:???
さて、火狐は問題無しでしたよ。
947Name_Not_Found:2005/08/26(金) 00:48:58 ID:???
.a { background-color: RED }
ul.hoge {float: left; width: 50%; }

<div class="a">

 <H1>ほげほげほげ</H1>

 <p>ほげほげほげ</p>

 <ul class="hoge">
  <li>ほげリスト</li>
  <li>ほげリスト</li>
 </ul>

 <ul class="hoge">
  <li>ほげリスト</li>
  <li>ほげリスト</li>
 </ul>

</div>

このような段組に挑戦して、レイアウト自体はうまくいったんですが、
「ほげリストのUL部分の背景にclass="a"で指定した背景が反映されません
(PとH1の「ほげほげほげ」の部分はclass="a"で指定した背景に変わってくれています)

ULにて背景を指定してやれば見かけ上は解決するんですが、
いま悩んでる問題の解決にはならないので後学のためにアドバイス頂けたらうれしいです。
どうぞよろしくお願いします。
948Name_Not_Found:2005/08/26(金) 00:54:24 ID:???
floatは深く考えてはいかんのじゃ
949Name_Not_Found:2005/08/26(金) 00:58:05 ID:???
下のULのCSSは要らない
950Name_Not_Found:2005/08/26(金) 01:05:42 ID:???
>>947
ul要素に直接フロートとか微妙に危険。

包含ブロック要素内がフロート化した要素で終わってると、高さが算出されないょ。
transitionalなら<br clear="all">を最後の</div>の直前に入れればok。
strictなら、フロートしたまま終わるような構成にしない。
951Name_Not_Found:2005/08/26(金) 01:05:46 ID:???
div.a にパディング入れたら大丈夫だった気もするような感じだったと思うっぽいよーな
952Name_Not_Found:2005/08/26(金) 01:12:40 ID:???
>>949
ちゃんとそのソースで確認した?
>>949の言ってる通りの動作すらしてくれないんだけど。

んで、上で答えてる人がいるんで、他の方向から適当に解答。
div以下の各要素に共通のプロパティを設定するのであれば、
各要素にいちいち背景色を設定せずに、属性セレクタで
.a, .a * { background-color: red; } のようにすればいい。(.a自身と、.aの子孫の全要素を指定)
953Name_Not_Found:2005/08/26(金) 01:22:22 ID:???
>>949
ためしに下のULCSSからフロート部分を抜き出したら背景はうまく行きました。
ですが、右側(下)の部分のUL内のLIのstyaleや他のstyaleが全て無効に・・・なんでなんだぁぁぁぁ

>>950
>包含ブロック要素内がフロート化した要素で終わってると、高さが算出されないょ
そうなんですか?!だとしたらULのclassを外してやってDIVで指定してやっても同じということですよね・・・

実は二つ目の</ul>の下に<br style="clear: both;">を置くと回避されるのは発見していてたんですが、
いわゆる「よくない無意味なタグ」ということで使うのを憚られたんですが
仕方ないのかもしれませんね<span style="clear: both;">全角スペース</span>なんてやるよりかはましでしょうからね・・・・うーん

>ul要素に直接フロートとか微妙に危険

これはどういった理由からなんでしょうか?
DIVを多用するのも避けるべきだと書いてあったので
ブロック要素にはなるべく直で扱うように心がけています・・・

>>951
>>947には不要かと判断して書いてませんがpaddingの指定もしてます
954Name_Not_Found:2005/08/26(金) 01:33:49 ID:???
>>952
ありがとうございます。背景をしてやれば見栄え上は解決するんですが、

>.a, .a * { background-color: red; }
これってDIV.aにして*を<div class="a"> * </div>してやれば
.a { background-color: red; }と同じ事ではないの?って思って
もやもやと納得いかない部分がありまして今回質問させてもらいました。

>>950さんが仰るように>包含ブロック要素内がフロート化したまま終わってると
高さが反映されないということで仕方ないのかなと思いましたorz

みなさんありがとうございました。



955949:2005/08/26(金) 01:39:09 ID:???
ごめんごめん
下の<ul>のfloat指示を外して変わりにmargin:50%;でおk
956949:2005/08/26(金) 01:39:51 ID:???
さらにゴメン
margin-left ね
957949:2005/08/26(金) 01:43:34 ID:???
ちゃんと書くわ。つまり

ul.hoge {width: 50%; }
一個目<ul class="hoge" style="float: left;">
二個目<ul class="hoge" style="margin-left: 50%;">

ね。
>ul要素に直接フロートとか微妙に危険。
これって何?
958Name_Not_Found:2005/08/26(金) 01:45:07 ID:???
>>952
最後、それ属性セレクタじゃないだろ。
クラスセレクタ、クラスセレクタと全称セレクタの子孫セレクタ。

>>953
clearプロパティはブロックレベル要素にしか適用されないよ。
div要素に指定するならwidthも指定することが推奨される。100%でも。

> いわゆる「よくない無意味なタグ」ということで使うのを憚(はばか)られたんですが
読めなかった。
で、無意味じゃないからtransparentなら指定汁。clear属性で。
IEはフロートボックスのサイズも計算するけど、イカレた挙動。
フロートとかポジショニングしたら普通は親要素無視される。
後続要素があればその分領域が発生するので包含ブロックの領域も下まで発生する。

>>953&>>957
ul要素直接フロートが危険なのは、ブラウザによってリスト要素の解釈が異なるから。
適当に指定してるとマーカー重なったりするよ。outsideだと。※↓
しかも、フロートする要素は内在的な幅が指定されていない限り、width指定が必要。
だからってul要素にwidth指定したり、※マーカー避けるためにmarginとか指定すると、IEでli要素が崩れる。

そんなこんなで、divで包含した方が吉。
divの多用を避けるっつっても、クロスブラウジングするにはある程度必要。
よく考えて、必要なだけ使うのであれば気にすることはない。

>>954
>953のまま終わるなっ。
959Name_Not_Found:2005/08/26(金) 01:47:16 ID:???
ブログでよく見かける文章を枠で囲む場合です
引用文ではないのに blockquote を使ってもいいのでしょうか?
960949:2005/08/26(金) 01:48:44 ID:???
>>958
>ul要素直接フロートが危険なのは(以下略)
そいうことか
なるなる。了解
961958:2005/08/26(金) 01:51:26 ID:???
誤記スマソ。
> で、無意味じゃないからtransparentなら指定汁。clear属性で。
transitionalね。

で、>>959
食事中に箸でドラムの練習するのと同じくらい良くないことです。
でも、絶対にしてはいけないって訳でもないです。表示結果さえ理想形であればいいってなら。
文法無視してるけど。つかlivedoor blog使いにくい。(板違いスマソ
962951:2005/08/26(金) 01:54:40 ID:???
>>961
ありがとうございます
やろうと思ってたけどやめておきます
963959:2005/08/26(金) 01:55:44 ID:???
>>962
はボクです

>>951さん
間違えましたすいません
964947:2005/08/26(金) 02:04:29 ID:???
>>949
>>957のでもうまく行きました。なるほど〜そういう考え方も(感心)m(_ _)m

>>958
>無意味じゃないから

うーん開眼したかも。確かにフロートしっぱなしを解除しやるわけですからね
imgタグで置き換えてやると、確かに無意味どころか、むしろ文法的には必須のものかも!?
<br>の下に何も来ないこと(実際には<div="fotter">フッター<div>がありclear:both;してるんですが…)、CSS解除モードで余計な一行分のスペースが空くことから余計なもの
と考えておりました。

>transitional>div要素に指定するならwidthも指定することが推奨される。100%でも。

となにやら私のスタイル的に重要な新しい知識が得られそうなのでググッて参ります。
他にも重要で中身の濃いアドバイス本当にありがとう。貪欲にググッて参ります!
965Name_Not_Found:2005/08/26(金) 02:12:02 ID:???
漏れの回答が正しいとは限らないが;
こういうWeb歴半年で、1000時間くらいしか学習してないょ。
10年以上前から確立してんだから凄いよな。先人は。
966Name_Not_Found:2005/08/26(金) 02:57:32 ID:???
id属性値ってhtml文書内でユニークと聞いたのですが、
 <input type="radio" name="hoge" value="1">
 <input type="radio" name="hoge" value="2">
というラジオボタンにid属性をつけたい場合はどうなるのでしょう?

name=idだとユニークになりませんよね?
id="hoge_1"
id="hoge_2"
というようにつけるのでしょうか?
967Name_Not_Found:2005/08/26(金) 03:10:56 ID:???
>>966
それってCSSじゃない気がするけど、一応。

name属性はデータを送信する際に渡すパラメタの名称や、
オブジェクトをオブジェクト外部から参照するための名称
id属性は文書内でオブジェクトを一意に識別するための識別子
なんで、そんな感じでいいんじゃないの。
968Name_Not_Found:2005/08/26(金) 09:19:53 ID:???
一応自分で調べて絶望済みなんですが、確認のために質問させてください。

margin & padding の値で「デフォルト」を指示することってできないですよね?
leftだけデフォルトでって場合は
margin-top: **
margin-bottom: **
margin-right: **
padding-top: **
padding-bottom: **
padding-right: **
こうやらないと駄目なんですよね?autoってのは微妙に違うしみたいだし

margin: ** ** ** デフォルト
padding: ** ** ** デフォルト これが出来たら便利なんだけどな〜…
969Name_Not_Found:2005/08/26(金) 09:25:14 ID:???
デフォルト値を書けばいいだけじゃん
970Name_Not_Found:2005/08/26(金) 09:30:40 ID:???
>>968
個別指定じゃなくてmargin/padding一括指定したいという意味?
だったらできる
もうちょっと調べてみ
971Name_Not_Found:2005/08/26(金) 11:22:39 ID:???
>>970
質問読んでないだろ?
972Name_Not_Found:2005/08/26(金) 12:43:16 ID:???
どなたか知恵を貸してください。

全体(div id="all")にborderを設定してあるんですが、
中の要素を絶対配置にしたところ、その要素を含んでくれません。。
どうすれば中の#left #rightも含んでくれるようになるのでしょうか。
973972:2005/08/26(金) 12:43:53 ID:???
ソースです

---html---
<body>
<div id="all">

<div id="left">
左やねん
</div>
<div id="right">
右ですわ
</div>
</div>
</body>
974Name_Not_Found:2005/08/26(金) 12:44:14 ID:J+I7PKFa
すみません、質問です。

【HTML】
<div id="foot">
  <div class="menu">
    <ul>
      <li><a href="aaa.html">AAA</a></li>
      <li><a href="bbb.html">BBB</a></li>
    </ul>
  </div>
  <div class="copyright">Copyright (C) hogehoge.</div>
</div>

(注:見やすいように全角スペースを入れていますが、実際は半角です。)


これを
−−−−−−−−−−−−−−−−−−−−−−−−
Copyright (C) hogehoge.   AAA BBB
−−−−−−−−−−−−−−−−−−−−−−−−
と表示したいです。

ネックになっているのはmenuとcopyrightの場所を左右逆にすることです。
ネックって言うか全然見当がつきませんorz

良い知恵がありましたら教えてください。
ソースの順番を変えるというのはナシでお願いします(´・ω・`)
975972:2005/08/26(金) 12:45:18 ID:???
---css---
* {
margin: 0; padding: 0;
font-weight: normal;
font-style: normal;
font-family:"MS P Gothic", "MS Gothic", "Osaka-等幅", monospace;
color:#333333;
}

#all{
width:688px;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
background-color:#EAEAEA;
}


#left{
position:absolute;
top:160px;
left:0px;
background-color:#FF0000;
width:170px;
}

#right{
width:518px;
background-color:#00FFFF;
position:absolute;
top:160px;
left:170px;
}
976Name_Not_Found:2005/08/26(金) 12:53:23 ID:???
>>974
宿題は自分でやらなきゃいけんぞなもし。
977Name_Not_Found
>>974
floatでGoogle検索して自分で当てはめてみると
見当以前に答えが分かる。
ガンガレ、あとちょっとだ。