CSS（スタイルー大柴シート）質問スレ51日目

1 名前：Name_Not_Found [2006/01/13(金) 00:43:59 ID:0j/prymY] CSSに関する質問はこちらへどうぞ。 ※　ブログ厨大量発生月間　※ ■■■■■　質問のしかた　■■■■■ ●基礎は解説サイト（→【解説など】>>3-4）で勉強してください。 ●質問の前に【FAQ】（>>5-9）を参照して、既出の再掲を避けて下さい。 ●【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。 　WinIEの場合は、[Ctrl+F]で検索できます。 ●ブラウザによって対応していないプロパティーやバグがありますので、 　解説サイト（→【関連リンク】）の対応表や「CSSバグリスト」に目を通しておきませう。 ●土台のHTMLが間違ってるとCSS指定も意図通りに効きません。 　正当(valid)なHTMLを心がけて下さい。validator（>>2）でチェックできます。 初心者の疑問は大抵ここまでで解決します。 ●OSやブラウザの種類とヴァージョンについては必ず明記してください。 　特にNetscapeは、ver.4までと6以降でまったく別物です。 ●「環境を書け」とか「ソースは？」と求められたら応じませう。 　その方が回答が早く得られます。質問は具体的に。 【まとめサイト】　web2ch.s31.xrea.com/?CSS 【FAQ】　web2ch.s31.xrea.com/?CSSFAQ 【過去ログ】　web2ch.s31.xrea.com/?CSSLog 【関連リンク】　web2ch.s31.xrea.com/?CSSRelated 【前スレッド】　pc8.2ch.net/test/read.cgi/hp/1134048018/ 関聯リンクは>>2-15 あたり 【関連スレ】【仕様書】【CSS検証】>>2 【解説など】>>3-4 【FAQ】>>5-9 2 名前：Name_Not_Found mailto:sage [2006/01/13(金) 00:45:47 ID:???] 【関連スレッド】 CSS/DHTMLバグ辞典スレッド 第４版 　pc8.2ch.net/test/read.cgi/hp/1078463560/l50 代替スタイルシートに萌え〜 　pc8.2ch.net/test/read.cgi/hp/991400015/l50 独自拡張、草案段階のCSSについて語れ 　pc8.2ch.net/test/read.cgi/hp/1019912046/l50 * CSS[適用="2ch"]{ イケてるスタイルを："作れ"} 　pc8.2ch.net/test/read.cgi/hp/1038678267/l50 CSSでイケてるデザインサイト 26 pc8.2ch.net/test/read.cgi/hp/1120837682/l50 【仕様書】 CSS1の仕様書の原文(英語) 　www.w3.org/TR/REC-CSS1 CSS2の仕様書の原文(英語) 　www.w3.org/TR/REC-CSS2 CSS1の仕様書の邦訳（日本規格協会訳／個人訳） 　www.y-adagio.com/public/standards/css1/toc.htm 　www.swlab.it.okayama-u.ac.jp/man/rec-css1/rec-css1.html CSS2の仕様書の邦訳（日本規格協会訳／個人訳） 　www.y-adagio.com/public/standards/tr_css2/toc.html 　www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html 【CSS検証】 W3C CSS 検証サービス 　jigsaw.w3.org/css-validator/ 3 名前：Name_Not_Found mailto:sage [2006/01/13(金) 00:48:32 ID:???] 【解説など】 ・ごく簡単なHTMLの説明 　www.kanzaki.com/docs/htminfo.html ・ZSPC - Style Sheets Reference 　www.zspc.com/stylesheets/ ・ZSPC - CSS2対応状況ガイド 　www.zspc.com/documents/css2/ ・CSS1テストスイート 　www.doraneko.org/css1test/ ・ばけらの CSS リファレンス 　www.ne.jp/asahi/minazuki/bakera/html/css/reference ・K@tsukun's PAGE! > CSS Reference 　hp.vector.co.jp/authors/VA022006/css/index.html ・K@tsukun's PAGE! > 付録：CSS対応状況表 　hp.vector.co.jp/authors/VA022006/css/corrbrwser.html ・CSS Laboratory対応表・一覧 　is.vis.ne.jp/charts/index.xhtml ・ブラウザのHTML4/CSS対応度テスト 　homepage1.nifty.com/emk/moz/browsertest.html ・CSSバグリスト＠CSSバグ辞典スレッド 　cssbug.at.infoseek.co.jp/index.html 4 名前：Name_Not_Found mailto:sage [2006/01/13(金) 00:49:15 ID:???] 【解説など】 ・Web標準化Tips（特に「HTML/CSSのよくある誤解・ミス」） 　www.mozilla.gr.jp/standards/webtips/index.html ・ブラウザによる振り分け（JavaScriptを使用しない方法） 　east.portland.ne.jp/~sigekazu/css/boxm.htm#ua ・Web Site 作成支援 - What is CSS? 　www.nextindex.net/web/CSS/index.html ・Academic HTML::CSS2 　www.tg.rim.or.jp/~hexane/ach/ ・『スタイルシートWebデザイン』ボランティアHTML化版。 　www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/ ・スタイルシート用語集 　www.mitsue.co.jp/case/design/c_index.html ・IE で min-width を指定する方 　www.lucky-bag.com/archives/2005/05/ie_minwidth.html ・CSSでイケてるデザインサイトリンク集 　ike.s33.xrea.com/ ・（ ´∀｀）＜ CSS でイケてるデザインサイトリンク集2 　www.geocities.jp/cas_ike2/ ・* CSS { イケてるスタイルを："作れ";} 発表所 　web.archive.org/web/20030415121122/http://strict.jp/~sappari/2ch/css.php 5 名前：Name_Not_Found mailto:sage [2006/01/13(金) 00:56:30 ID:???] 【FAQ】 Q1: IEでは大丈夫なのに、Netscape6 以降で見ると横スクロールバーが出たりするが？ A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。 「width と height の計算方法の実装の違いについて」参照。 　hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height width（height）は、要素の内容領域の幅（高さ）を指定するプロパティですが、 WinIE等では、ボーダー領域 + パディング領域 + 内容領域 の寸法で計算されます。 Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。 WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます。 　www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3 参考「IEとNNのBOXの計測方法の違いについて」 　www.fromdfj.net/html/border2.html Q2: tableなどブロック要素をセンタリングするには？　text-align:center;を指定しても Netscape6(or7)ではなりません。IEでは中央寄せになるのに…… A2: IEの実装の誤りです。詳しくは下記（特に5.）をご覧ください。 1.'text-align'に関する考察 　anslasax.net/css-make/t-a/index.html 2.IE5.5とNetscape6のCSS - 中央寄せ 　tancro.stp-1.com/stylesheet/n6_center.html 3.Internet Explorer 6におけるCSSの拡張 　www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic6 4.Tableのセンタリング 　members.jcom.home.ne.jp/jintrick/Personal/css_miss_table.html 5.ブロックレベル要素をセンタリングする方法 　www.mozilla.gr.jp/standards/webtips0004.html 6 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:06:27 ID:???] 【FAQ】 Q3: CSSで段組するには？ A3: 下記などを参照して下さい。 CSSを用いた段組の作成のコツ 　www.fromdfj.net/html/column.html CSS段組レイアウトデザ委員会 　web.archive.org/web/20031005195659/http://www.skipup.com/~l-_-l/web/ スタイルシートでマルチカラムデザインの実現 　ttp://web.archive.org/web/20040603063133/shiten.s9.xrea.com/etc/stylesheet/multi_column.htm スタイルシートでマルチカラム・デザインを実現する方法 　www.motchie.com/article/multicolumn.html tableを使はない段組:CSSによるマルチカラムデザインについての考察 　members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html 試驗場 - 段組(position版) 　members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html 段組れいあうとてすと (floatによる段組の例) 　www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html なかよしぱれっと（Netscape4でも崩れない段組みの実例） 　ttp://web.archive.org/web/20041001014138/homepage3.nifty.com/fores/ リストを用いたレイアウト 　css.maxdesign.com.au/index.htm 7 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:35:09 ID:???] 【FAQ】 Q4: なんかフロートの表示が崩れるみたいなんですけど？ A4: まずclear忘れがないかをを確認してください。 floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。 　www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html またfloat:left;で回り込むのはテキスト（imgを含む）だけです。ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:（浮動要素のwidth）;”なりを指定する必要があります。WinIEの間違った実装で誤解が多いので注意。 　cssbug.at.infoseek.co.jp/detail/winie/b054.html これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。 　www.mozilla.gr.jp/standards/webtips0021.html#c1_2 　cssbug.at.infoseek.co.jp/detail/winie/b079.html 　cssbug.at.infoseek.co.jp/detail/winie/b053.html 8 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:36:22 ID:???] 【FAQ】 Q5: CSSで擬似フレームってどうやるの？ A5: 次のページを参考にして下さい。 overflow プロパティは擬似フレームも作成できる 　web.archive.org/web/20040221221340/http://kobit.info/tips/overflow.html 　web.archive.org/web/20040215182735/http://kobit.info/files/frame.html overflowを用いた擬似フレーム 　www.fromdfj.net/html/overflow.html レイアウトサンプル 擬似フレーム 　www.rju666.com/web/layout/imitate_frames.html Q6:画面中央に配置するにはどうすれば？ A6:左右（水平方向）のセンタリングはA2に既出。垂直には色々な方法があります。 　「スタイルシート 縦中央(垂直中央)」参照のこと。 　chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。 Q7:背景画像を二つ指定するにはどうするか。 A7:background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。 Q8.dt・ddを横並びにしたいのですが。（会話文など） A8.floatとmargin-leftの応用で。下記サイトを参照のこと。 「<dl> の整形」 　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は cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。 text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。 cf. cssbug.at.infoseek.co.jp/detail/winie/b040.html 9 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:38:38 ID:???] 【FAQ】 Q10: リンクを新しいウィンドウで開かせるにはどうしたら？ A10: ＣＳＳではできません。target属性かJavaScript?でやって下さい。別窓が開くと迷惑に感じる人もありますからなるべくしない、がＷ３Ｃの方針です。 Q11. height:100%;としても高さが100%になりません。 A11. heightを%単位で指定するためには親要素の高さを明示的に指定する必要があります。下記サイトを参照のこと。 「height: n%;の正しい仕様」 　www.mozilla.gr.jp/standards/webtips/webtips0032.html Q12: いままでＨＴＭＬでやってた××をＣＳＳでやるにはどうすればいい？ A12: 下記をご覧あれ。テーブル・レイアウトは段組のＦＡＱ（A3）を見なさい。 「いままでの HTML との対照」 　www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm 　www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm 　www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm HTML でのレイアウト指定の、 CSS での指定との対応表 　deztec.sakura.ne.jp/x/01/tips/page/p0037.html 10 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:39:21 ID:???] ばかもんが 11 名前：Name_Not_Found mailto:sage [2006/01/13(金) 01:40:08 ID:???] 【参考】 ＊IEの position:absolute; のバグを利用した擬似フレーム １．標準モードにする ２．body {height:100%; overflow:auto;} ３．fixしたいブロックを position: absolute; で指定 以下に示すようなハックを用いることにより、全ブラウザへの対応も可。 /* 全ブラウザに適用 */ #menu {position:fixed; display:block; top:100px; left:10px; width:130px; height:200px;} /* IE6 のみ読み込む */ * html #menu {position:absolute; display:block; top:100px; left:10px; width:130px; height:200px;} 《実現例》 CSS frame emulation www.stunicholls.myby.co.uk/menu/background2.html アンダーバー・ハックの方がいいか？ cssbug.at.infoseek.co.jp/detail/winie/b157.html 12 名前：Name_Not_Found mailto:sage [2006/01/13(金) 02:12:52 ID:???] 【FAQ】 Q5: CSSで擬似フレームってどうやるの？ A5: 次のページを参考にして下さい。 overflow プロパティは擬似フレームも作成できる 　web.archive.org/web/20040221221340/http://kobit.info/tips/overflow.html 　web.archive.org/web/20040215182735/http://kobit.info/files/frame.html overflowを用いた擬似フレーム 　www.fromdfj.net/html/overflow.html レイアウトサンプル 擬似フレーム 　www.rju666.com/web/layout/imitate_frames.html Q6:画面中央に配置するにはどうすれば？ A6:左右（水平方向）のセンタリングはA2に既出。垂直には色々な方法があります。 　「スタイルシート 縦中央(垂直中央)」参照のこと。 　chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。 Q7:背景画像を二つ指定するにはどうするか。 A7:background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。 Q8.dt・ddを横並びにしたいのですが。（会話文など） A8.floatとmargin-leftの応用で。下記サイトを参照のこと。 「<dl> の整形」 　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は cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。 text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。 cf. cssbug.at.infoseek.co.jp/detail/winie/b040.html 13 名前：Name_Not_Found mailto:sage [2006/01/13(金) 02:16:05 ID:???] 【先代の格言】 おまいらまだCSSとかやってんの はっきり言って時代おくれ 14 名前：Name_Not_Found [2006/01/13(金) 19:26:17 ID:C6gM4fZT] スレタイ痛すぎ 15 名前：Name_Not_Found mailto:sage [2006/01/14(土) 01:25:55 ID:???] >>14 質問も回答も、激しくクドい感じでお願いしちゃうゼ？ 16 名前：Name_Not_Found mailto:sage [2006/01/14(土) 23:29:03 ID:???] ルー大柴が居るって聞いたんですけど・・・・・ 17 名前：Name_Not_Found mailto:sage [2006/01/15(日) 21:09:32 ID:???] /* CSS・スタイルシート質問スレッド【51th】 */ pc8.2ch.net/test/read.cgi/hp/1137310503/l50 18 名前：Name_Not_Found mailto:sage [2006/01/16(月) 05:49:25 ID:???] 何このルー大柴って何か元ネタあるの？ 19 名前：Name_Not_Found mailto:sage [2006/01/16(月) 09:32:46 ID:???] ぐぐれ 20 名前：Name_Not_Found mailto:sage [2006/01/16(月) 10:37:35 ID:???] ルー大柴とCSSでググったが… ルー大柴はよく英語を略すのか？ 21 名前：Name_Not_Found mailto:sage [2006/01/16(月) 14:08:06 ID:???] IE6.0にて、フッタの【CopyRight 2006 111 All Rights Reserved.】 という文字列最後の３文字【.ed】が変な場所に現れます。 しかも、二重にです。 HTMLソース <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <title>001</title> <link href="test.css" rel="stylesheet" type="text/css"> </head> <body> <div id="top">top</div> <div id="main_wrap"> <div id="menu">menu</div><!--/#menu--> <div id="main">main contents</div><!--/#main--> <div id="bottom" align="right">CopyRight 2006 111 All Rights Reserved.</div> </div> </body> </html> 22 名前：Name_Not_Found mailto:sage [2006/01/16(月) 14:09:04 ID:???] CSS部分（外部ファイル） div#top { width:800px; background-color:#ff0000; } div#main_wrap { clear:both; width:800px; background-color:#cccccc; } div#menu { float:left; border:0px dashed #ffffff; width:130px; background-color:#00ff00; padding:0px 0px 0px 10px; } div#main{ float:left; width:660px; } div#bottom { float:left; clear:both; width:800px; color:#666666; } 23 名前：21 mailto:sage [2006/01/16(月) 14:10:10 ID:???] とりあえず、解決方法は、 １、HTML宣言の後半部分のURLを消す ２、<!--/#menu--><!--/#main-->のコメントを消す ３、CSSでdiv#menuのpaddingをすべて0pxにする。 ４、CSSでdiv#bottomのfloat:leftを消す のどれかで解決できるんですが、決定的な理由がわかりません。 ただのバグというにはあまりにも解決方法が多すぎる気がするんですが・・・。 画期的な解決方法をご存知の方、いらっしゃいますか？ 24 名前：Name_Not_Found [2006/01/16(月) 15:59:06 ID:Qhe1jz4x] >>23 Mac OS9、Netscape7.02というドマイナーな環境ではこのままで正常に表示されるな。ｗ 25 名前：Name_Not_Found mailto:sage [2006/01/16(月) 17:51:06 ID:???] >>24 win XPでも Netscape4.8 Netscape6 Netscape7.1 Netscape8.0 Opera8.5 Firefox1.5 では正常です。 おかしいのはIE6.0だけ。 明らかにバグだとはわかるんですが、解決方法が多すぎるのでなんかスッキリしないんです。 26 名前：Name_Not_Found mailto:sage [2006/01/16(月) 18:53:23 ID:???] ていうか本スレここじゃないよ。 27 名前：Name_Not_Found mailto:sage [2006/01/16(月) 21:36:14 ID:???] >>25 またIEの不具合報告ですか 28 名前：Name_Not_Found mailto:sage [2006/01/16(月) 21:36:44 ID:???] ﾜﾛｽ 29 名前：Name_Not_Found mailto:sage [2006/01/18(水) 12:57:40 ID:???] <dt>DT1</dt> <dd>DD1</dd> <dd>DD2</dd> <dt>DT2</dt> <dd>DD3</dd> <dd>DD4</dd> <dd>DD5</dd> というのを DT1 DD1 DD2 DT2 DD3 DD4 DD5 と並べて表示したいのですが dt float: left clear: both dd float: left だとWinIEで DT1 DD1 DD2 DD3 DD4 DD5 DT2 となってしまいます。 どうやったら解決できますか 30 名前：Name_Not_Found mailto:sage [2006/01/18(水) 13:42:16 ID:???] 内緒です 31 名前：Name_Not_Found mailto:sage [2006/01/18(水) 13:44:38 ID:???] そこをなんとかお代官 32 名前：Name_Not_Found mailto:sage [2006/01/18(水) 13:49:30 ID:???] 下記に移行せよ。 /* CSS・スタイルシート質問スレッド【51th】 */ pc8.2ch.net/test/read.cgi/hp/1137310503/l50 33 名前：Name_Not_Found mailto:sage [2006/02/04(土) 17:44:59 ID:???] 田中彰の応援歌を考えた。 行くぞ彰ホームラン！センターオーバーホームラン！ 弾丸ライナーだ！飛ばせ！運べ！彰！ 俺が考えた歌詞ですよ！ 弾丸ライナーだ！の後に「ヘイ！」とか「おい！」って掛け声を入れてスタンドでジャンプするの とかいれると面白いかもしれない。 34 名前：Name_Not_Found [2006/02/22(水) 20:48:57 ID:mL83/VvT] 頑張ってますよ 35 名前：Name_Not_Found mailto:sage [2006/02/22(水) 22:30:57 ID:???] /* CSS・スタイルシート質問スレッド【52nd】 pc8.2ch.net/test/read.cgi/hp/1139885961/l50 36 名前：Name_Not_Found mailto:sage [2006/03/15(水) 19:48:37 ID:???] 同じページでリンクの色をクラスごとに分けたいんですけど、どのように記述すればよいでしょうか。 メニュー中の日記は青、BBSは赤、といった感じにしたいのですけど。 どうぞよろしくお願いします。 もしかして不可能でしょうか・・・ 37 名前：Name_Not_Found mailto:sage [2006/03/15(水) 21:35:01 ID:???] 自己解決しました 38 名前：Name_Not_Found mailto:sage [2006/03/22(水) 09:17:03 ID:???] クラスセレクタに続けて要素名を書けばよろしい 39 名前：Name_Not_Found mailto:sage [2006/03/23(木) 02:20:09 ID:???] なんだよこのスレｗｗ 40 名前：Name_Not_Found mailto:sage [2006/07/26(水) 13:10:05 ID:???] >>1 スレタイわらた 41 名前：Name_Not_Found [2006/11/08(水) 17:20:38 ID:xMeRUYZn] まん 42 名前：Name_Not_Found [2006/11/12(日) 20:51:42 ID:s6+6DegB] こ 43 名前：Name_Not_Found [2006/12/14(木) 01:20:03 ID:EaJjM8Lc] 質問です。 CSSのfloatで以下のようなレイアウトは可能ですか？ 「aaa…」は段落無しの連続した文章です。 aaaaaaaaa┌─┐ aaaaaaaaa│画│ aaaaaaaaa└─┘ ┌─┐aaaaaaaaa │画│aaaaaaaaa └─┘aaaaa 44 名前：Name_Not_Found mailto:sage [2006/12/14(木) 07:23:36 ID:???] 可能。 クリアを忘れずに。 45 名前：Name_Not_Found [2007/02/10(土) 13:49:19 ID:cwVXvG/f] tdのひとつひとつの横幅のサイズを指定する 方法がありましたら教えてください。 46 名前：Name_Not_Found mailto:sage [2007/02/10(土) 14:37:34 ID:???] >>45 なんでよりによってこのスレで質問する？ 普通にwidthプロパティ。 47 名前：45 [2007/02/10(土) 16:21:37 ID:cwVXvG/f] >>46 ありがとうございます。 インライン要素にはwidthは使わない方がいいと書いてありました。 他には、tableにはwidthを指定できるので、 tdには比率が指定できればサイズが指定できると思ったのですが、 そのやり方は見つかりませんでした。 48 名前：Name_Not_Found mailto:sage [2007/02/10(土) 16:24:26 ID:???] >>47 td要素はブロック要素ですが何か。 49 名前：45 [2007/02/10(土) 16:55:21 ID:cwVXvG/f] >>48 間違えていましたか。 ブロック、インラインの違いは、おおまかに 改行を伴うか伴わないかで覚えていました。 ただ、CSSチェッカーjigsaw.w3.org/css-validator/ でエラーが出るので、使ってはいけないのは同じだと思いました。 50 名前：45 [2007/02/10(土) 17:18:51 ID:cwVXvG/f] すいません。:ではなく、=でつないでいました・・。 CSSチェックをしても、英語の変な文章が出てくるわけですね・・。 51 名前：Name_Not_Found [2007/02/11(日) 14:03:15 ID:hu/1JMam] tableのcolspan、lowspanの CSSバージョンがありましたら教えてください。 52 名前：Name_Not_Found mailto:sage [2007/02/11(日) 14:09:23 ID:???] ない。 つーかこのスレで質問すんな。 53 名前：51 mailto:sage [2007/02/11(日) 16:25:11 ID:???] ありがとうございました。 54 名前：Name_Not_Found mailto:sage [2007/02/14(水) 23:51:38 ID:???] 初心者向けの質問スレはこちらです pc10.2ch.net/test/read.cgi/hp/1171444150/ 55 名前：Name_Not_Found [2007/03/29(木) 06:13:51 ID:Vw1XKpXy] <br>を2つ以上入れても、1回分の改行しか出来ません。 そういう症状の場合、letter-spacingが疑われますが、letter-spacingは使っていません。 ひとつひとつ検証してみたところ、　* { margin: 0, padding: 0, }　で使っているmarginが原因のようです。 これは必要な要素なのでカットするわけにもいかないし、困っています…。 いままでも同じように設定しているのですが、何も問題はありませんでした。 何かアドバイスをしてくださる方がいれば、よろしくお願いします。 ちなみにmarginを1pxにしたら、若干行間があきました。 改行でできる隙間（＝マージン？）も0に、という解釈なのでしょうか。 56 名前：Name_Not_Found mailto:sage [2007/03/29(木) 08:42:40 ID:???] >>55 釣りだと思うがマジレス。 ・letter-spacingの意味を調べろ。 ・CSSの基礎から勉強し直し。 57 名前：Name_Not_Found mailto:sage [2007/03/29(木) 10:27:08 ID:???] >>55 <br>は空行を作るためのものではない。 そもそもの使い方が間違ってるからCSS勉強しなおせ。 2回以上改行する場面など無い。 58 名前：Name_Not_Found mailto:sage [2007/03/29(木) 12:21:07 ID:???] ひとつのタグに二つ以上要素を設定することは可能ですか？ <ul id="content" class="center"> という感じなんですが・・・ また文法的には正しいんでしょうか？ 59 名前：Name_Not_Found mailto:sage [2007/03/29(木) 12:33:55 ID:???] >>58 それの中の「要素」ってulだぞ？ 多分idとclassの同時設定は、という意味だと思うが、可能。 ついでにclass複数も値を半角スペースで区切って可能。 60 名前：Name_Not_Found mailto:sage [2007/03/29(木) 13:02:40 ID:???] >>59 ありがとうございます 61 名前：Name_Not_Found [2007/03/29(木) 16:07:04 ID:A4Tu737G] absoluteを用いたレイアウトでIE６とFFでレイアウトが違ってしまいます。 <body> <div id="container"> <h1>sss</h1> <div id="navigation"> 　 <p>aaaaaaa</p> </div> <div id="content"> <p>ccccccc</p> </div> </div> </body> これにcssで body{text-align:center;} h1{psition:absolute;} #container{text-align:left;} #navigation{float:left; width:100%;} #content{float:right; width:20%;} とxml宣言をしたため、中央ぞろえにtext-align:center;を使いました。 62 名前：Name_Not_Found [2007/03/29(木) 16:07:49 ID:A4Tu737G] この表示がＦＦなら sssaaaa cc cc cc c と表示されるのですが、ＩＥでは aaaaaaa sss cc cc cc c と開始位置がずれてしまいます。どうやって改善したらよろしいでしょうか？ 63 名前：Name_Not_Found mailto:sage [2007/03/29(木) 17:18:45 ID:???] >>61-62 釣り大流行らしいが、負けずにマジレス。 レイアウトと呼べる代物じゃないので、一から勉強して下さい。 64 名前：Name_Not_Found mailto:sage [2007/03/29(木) 17:28:31 ID:???] >>63 webページにおいて実用性は一通りでは語れないはずですが？ そもそもあなたの予想しているものと違う場合だってあります。 問題の方は解決…ぽいことはできました。ありがとうございました。 65 名前：Name_Not_Found mailto:sage [2007/03/29(木) 17:39:50 ID:???] 釣れました？ 66 名前：Name_Not_Found mailto:sage [2007/03/29(木) 17:46:22 ID:???] >>65 あーざすｗｗｗｗｗ 67 名前：Name_Not_Found mailto:sage [2007/03/29(木) 22:01:13 ID:???] このスレ一体何人が張りついてるんだ 68 名前：Name_Not_Found mailto:sage [2007/03/29(木) 22:22:48 ID:???] >>67 すべて67の自演です。 69 名前：Name_Not_Found [2007/04/02(月) 19:02:42 ID:YnkH6gsN] news.ameba.jp/2007/04/4005.php 70 名前：Name_Not_Found mailto:sage [2007/04/04(水) 23:25:28 ID:???] なんというルー大柴・・・これは間違いなくルー大柴 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 ／￣＼ 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　|　＾o＾　|　 　 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　＼＿／ 71 名前：Name_Not_Found [2007/05/11(金) 00:03:01 ID:Xz++WjQ7] 12日（土）17時ルー大柴アメスタ出演 土曜の夕方5時にクリック↓　　　 　　　studio.ameba.jp/ 72 名前：Name_Not_Found mailto:sage [2007/05/11(金) 00:20:06 ID:???] これは見逃せない 73 名前：Name_Not_Found mailto:sage [2007/05/14(月) 00:02:37 ID:???] テーブル内の文字を全て左揃えにしたいんですが わかる人お願いしますm(_ _)m 74 名前：Name_Not_Found mailto:sage [2007/05/14(月) 00:12:55 ID:???] >>73 table,td,tr {text-align:left;} 75 名前：Name_Not_Found mailto:sage [2007/05/14(月) 00:18:57 ID:???] >>74 >>74 >>74 >>73 table * { text-align : left; } 76 名前：Name_Not_Found [2007/05/18(金) 15:08:40 ID:4i99yRls] アメスタ vision.ameba.jp/watch.do?movie=238467 77 名前：Name_Not_Found mailto:sage [2007/05/24(木) 00:42:01 ID:???] フレームの色を全て同じにするにはどうすればいいですか？ ｈｔｍｌソフトのプレビューでは、ちゃんと表示されるのですが 某ブログでは、色が変わらないのでｃｓｓでやってみようと 思っています。 78 名前：Name_Not_Found mailto:sage [2007/05/24(木) 01:06:32 ID:???] 事故解決しました　汗汗；；；；； 79 名前：Name_Not_Found [2007/06/09(土) 21:12:40 ID:d51ozyPH] ここは笑いの絶えないほのぼのスレッドですね 80 名前：qa [2007/07/07(土) 20:43:24 ID:h5myQA9f] [ ]　←画像（縦方向のグラデーション） [ テキスト ] [ テキストテキストテキスト ] 上記のようにテキストの量によって自動で背景画像が可変するような CSS指定をしたいのですが、これって可能でしょうか？ 縦の可変はわかるのですが、横の可変がわかりません… 81 名前：Name_Not_Found [2007/07/07(土) 20:46:44 ID:9ivsDHRw] マージンやパッジングを指定するときに margin-top: 0; と書いてあるところがほとんどなのですが margin-top: 0px; と書いても問題ないですか？ 82 名前：Name_Not_Found [2007/07/07(土) 22:13:51 ID:BHKm+gY3] >>81 問題ないです 83 名前：Name_Not_Found [2007/07/07(土) 23:19:42 ID:OT0y3ZG6] ■HTML中身 <body> <div id="a">あ</div> <div id="b">い</div> </body> ■CSS中身 body {width: 400px; position: relative; margin-left: auto; margin-right: auto;} #a {margin-top: 100px;} #b {position: absolute; top: 70px; right: 0;} これだと、「い」が「あ」から70px下の位置に表示されてしまいます （IEだけは一番上から70pxの位置に表示される） ・「い」を、一番上から70pxの位置に表示したい ・「い」を、400pxで真ん中に寄せたBODYの右端に表示させたい 二つを満たすにはどうしたらいいんでしょうか？ お願いします 84 名前：Name_Not_Found mailto:sage [2007/07/08(日) 01:43:54 ID:???] 自分でどうにかしようって気はないのか… 85 名前：Name_Not_Found mailto:sage [2007/07/10(火) 17:31:28 ID:???] >>83 関係ないが、俺ボデーにいきなりwidthやらpositionって指定しない。 コンテナid作る。 86 名前：Name_Not_Found mailto:sage [2007/07/10(火) 19:44:43 ID:???] そうですか。 87 名前：Name_Not_Found mailto:sage [2007/07/11(水) 01:27:22 ID:???] うん 88 名前：Name_Not_Found [2007/07/27(金) 22:27:40 ID:eb2UaVpt] あげときましょうか 89 名前：Name_Not_Found mailto:sage [2007/07/31(火) 10:19:14 ID:???] ちょっとした質問なんだが <div id="main" class="index"> があったとして div#main.index { といった指定は通る？ そもそも文法的に正しいのかも気になる IDとClassを同時に指定なんて滅多に無いから実用性は無いと思うが･･･ 気になってググってみたけど見つけきれなかったんだ 90 名前：Name_Not_Found mailto:sage [2007/07/31(火) 12:25:48 ID:???] >>89 その記述の必要性がなくない？ <div id="main">にして 各要素にclassを使うってので良いと思うが。 91 名前：Name_Not_Found mailto:sage [2007/08/01(水) 02:59:37 ID:???] テーブルの<td align=left valign=bottom> ってのを<div>で出来ませんか？ 検索した結果<div align=left>では、できたのですが、 valign=bottomが出来ませんでした。 ちなみにHPとかで使うのではなくテーブルのセル内で左側表示と 右側の表示というので使うつもりです。 誰か詳細がわかりましたらよろしくおねがいします。m(_ _)m 92 名前：Name_Not_Found mailto:sage [2007/08/04(土) 14:44:13 ID:???] 速報!!!! hiro.pya.jp/soku.php hiro.pya.jp/soku2.php hiro.pya.jp/soku3.php 93 名前：Name_Not_Found mailto:sage [2007/09/10(月) 17:05:04 ID:???] >>91 全然スタイルシートについて質問してないし vertical-alignについて聞いてるのかと思ったら 左右とか言い出して意味不明だが、こういうことか？ <HTML> 左側表示したいセル: td class="left" 右側表示:したいセル td class="right" <CSS> td.left {text-align:left} td.right {text-align:right} 94 名前：Name_Not_Found mailto:sage [2007/09/10(月) 17:22:01 ID:???] スレチに回答するドアホ 95 名前：Name_Not_Found [2007/10/14(日) 17:15:11 ID:FB+vrREU] サイトのコンテンツ領域外背景がグラデーション状になっていて コンテンツ領域内と外背景の間をグローのようなぼかし効果をしているサイトを見た事がありましたが bodyタグに背景グラデーション画像を指定するとして、このグロー効果はどうやって付けているのでしょうか グローの背景画像付ける為だけにコンテンツ領域全体を新たにdivで囲む事も考えましたが、必要の無い無駄div作るのもどうかと思って・・・ この方法以外に良い方法などあったら教えて頂けませんでしょうか 96 名前：Name_Not_Found mailto:sage [2007/10/14(日) 17:18:38 ID:???] bodyやdivの背景画像はcssのbackground-imageで指定しています 書き足りていませんでした、すみません 97 名前：Name_Not_Found mailto:sage [2007/10/14(日) 19:45:43 ID:???] >>95,96 ここで聞くなよ。 取り合えず手本となるサイトがあるなら、ソース見れ。 あんたの説明から想像するに、div使う以外考えられないけどな。 98 名前：Name_Not_Found mailto:sage [2007/10/14(日) 22:34:25 ID:???] >>97 ぐぐって色々調べ物をしていた時辿り着いたサイトなので、どういった検索で行けたのか覚えていないもので・・・ やっぱりdivが必要なら諦めようと思います、レスありがとうございました 99 名前：Name_Not_Found mailto:sage [2007/10/14(日) 22:35:41 ID:???] IE(Mac) において、TABLEタグのcellspacing属性の代替となるCSSプロパティはありますか？ border-spacing や border-collapse も使えないようですが、 セル間隔をなくすには、cellspacing属性を使うしかないないのでしょうか？ 100 名前：Name_Not_Found mailto:sage [2007/10/14(日) 22:47:57 ID:???] >>99 IE(Mac)に限らずpadding。 IE(Mac)なんて使ってる奴は希少。 101 名前：Name_Not_Found mailto:sage [2007/10/15(月) 00:15:02 ID:???] ルー大柴流行再来の前に建てられたこのスレは本格予言的スレ 102 名前：99 mailto:sage [2007/10/15(月) 01:07:33 ID:???] >100 うーん、paddingプロパティはcellpadding属性の代用にはなりますが cellspacingとは異なりますよね？ それともMacIEではpaddingでセル間隔を調整できるのでしょうか？ 当方ボックスモデルの理解はできているつもりですが 試す環境がないのでMacIEの仕様の詳細がわからないのです・・・。 103 名前：Name_Not_Found mailto:sage [2007/10/15(月) 01:17:22 ID:???] >>99 border-spacingがその代用。 border-collapseがseparateのときのみ。 104 名前：Name_Not_Found mailto:sage [2007/10/15(月) 01:25:04 ID:???] Mac用IEなんてどうでもいいよ。。 105 名前：Name_Not_Found mailto:sage [2007/10/15(月) 01:29:11 ID:???] >>99 テンプレのQ12にあるだろが。 106 名前：Name_Not_Found [2007/10/19(金) 20:37:37 ID:b7HNLlS3] 携帯から見てリンク下線を見えなくする方法ってありますか？ 107 名前：Name_Not_Found mailto:sage [2007/10/19(金) 20:59:03 ID:???] >>106 CSSの効く携帯ブラウザなら普通と一緒 108 名前：Name_Not_Found [2007/10/19(金) 21:22:35 ID:b7HNLlS3] >>107 DoCoMoから確認したところ反映されていなかったので困っています やはり携帯対応タグはないんでしょうか？ 109 名前：Name_Not_Found mailto:sage [2007/10/19(金) 21:40:25 ID:???] 携帯関連の質問者ってどうしてこうバカばかりなんだろ 110 名前：Name_Not_Found mailto:sage [2007/10/19(金) 23:17:16 ID:???] >>108 CSS未対応の機種ではおそらく無理かと。 111 名前：Name_Not_Found mailto:sage [2007/10/20(土) 09:36:02 ID:???] >>110 そうですか… やはり携帯からみて下線を消したり見えなくする方法はなさそうですね ありがとうございました 112 名前：Name_Not_Found mailto:sage [2007/10/20(土) 13:14:38 ID:???] (ﾟдﾟ)ﾀﾞｶﾗCSS対応ｹｰﾀｲﾅﾗ可能ｯﾃ言ｯﾃﾙﾉﾆ自分ﾉｹｰﾀｲｶﾞｽﾍﾞﾃｶﾖ 113 名前：Name_Not_Found mailto:sage [2007/10/20(土) 13:32:44 ID:???] そもそも下線のないリンクなんてユーザビリティの観点から（以下略） 114 名前：Name_Not_Found mailto:sage [2007/11/08(木) 13:03:31 ID:???] たまにでいいから読み上げブラウザのことも思い出してあげてください 115 名前：Name_Not_Found mailto:sage [2007/11/08(木) 13:20:43 ID:???] 包括ブロックとfloatが俺をいじめる 116 名前：Name_Not_Found mailto:sage [2007/11/14(水) 20:33:19 ID:???] 大手テンプレートサイトで配布されているCSSに次のような記述がありました。 font: 70%/1.5em sans-serif; この、"70%/1.5em" というのはどういう意味なんでしょうか？ 教えて下さい。 117 名前：Name_Not_Found mailto:sage [2007/11/14(水) 20:45:38 ID:???] font propertyを調べろ 118 名前：Name_Not_Found mailto:sage [2007/11/20(火) 17:43:19 ID:???] hu 119 名前：Name_Not_Found mailto:sage [2007/11/29(木) 15:11:48 ID:???] ぬ 120 名前：Name_Not_Found [2007/12/01(土) 05:26:51 ID:3bqLvzKw] すいません、初歩的な質問ですがよろしくお願いします。 １つのページにリストを表示して、複数のリストグループがあるとき、 １つは横並びのリスト、もう一つはたて並びのリストにしたいのですが、 float:leftで設定すると、<li>全部横並びになってしまうんですけど どうすればいいでしょうか？ 以上よろしくお願いします。 121 名前：Name_Not_Found mailto:sage [2007/12/01(土) 06:47:02 ID:???] >>120 何の為にclassやidがあるのか考えよう。 122 名前：Name_Not_Found mailto:sage [2007/12/01(土) 23:50:46 ID:???] >>120 何のためにCSS質問スレがあるのか考えよう。 123 名前：Name_Not_Found [2007/12/03(月) 11:31:33 ID:BKcjh546] ルー大柴が紅白の目玉説　あの大物も一緒に出るか news.ameba.jp/domestic/2007/12/9064.html 124 名前：Name_Not_Found mailto:sage [2007/12/10(月) 12:22:55 ID:???] ho 125 名前：Name_Not_Found mailto:sage [2007/12/11(火) 16:44:40 ID:???] スタイルシートで不等号("<", ">")って使うっけ？ 126 名前：Name_Not_Found mailto:sage [2007/12/11(火) 18:28:28 ID:???] >>125 ちょwww 127 名前：125 mailto:sage [2007/12/12(水) 23:26:59 ID:???] あ、自己解決、 qq 'xxx'; でやればいいと気付いた。 128 名前：Name_Not_Found mailto:sage [2007/12/12(水) 23:42:38 ID:???] ・・・なんかすっごく解決してない気がする。 子供セレクタって知ってるか？ 129 名前：125 mailto:sage [2007/12/13(木) 01:24:44 ID:???] >>128 いあ、ダブルクォーテーションのエスケープだけが問題だから。 ｿﾚさえクリアできれば、まぁって感じで。 130 名前：Name_Not_Found mailto:sage [2007/12/13(木) 13:12:57 ID:???] しかしスレ違いという根本的な問題は解決してない罠 131 名前：Name_Not_Found mailto:sage [2007/12/20(木) 11:48:45 ID:???] nürüpo守 132 名前：Name_Not_Found mailto:sage [2007/12/26(水) 19:43:45 ID:???] >>131 gä 133 名前：Name_Not_Found [2007/12/31(月) 16:41:54 ID:BsoPA2II] ルー大柴のカルタ vision.ameba.jp/watch.do?movie=692032 134 名前：Name_Not_Found mailto:age [2007/12/31(月) 21:18:14 ID:???] 下のアホアホなソフトで勉強してみろ どうにも、ならんくなるぞ。 www.siteup-system.com/ 135 名前：Name_Not_Found [2008/01/23(水) 15:11:00 ID:xqvM1sDp] 保守 136 名前：Name_Not_Found mailto:sage [2008/01/25(金) 17:39:22 ID:???] floatを指定する要素にはwidth属性が必須、 ただし画像などもともとwidth属性を持つ要素の場合は無くても可。 …ってことらしいんですが、 <div style="float:left;"> <img src="img.jpg"> </div> <div style="float:left;"> <img src="img.jpg"> </div> のように、フロート要素内に画像のみ、という場合でもやはり （上記例の場合はdivに対して）width指定は必須？ 137 名前：Name_Not_Found mailto:sage [2008/01/25(金) 19:25:02 ID:???] >>136 CSS2.0はwidth必要、CSS2.1はCSS不必要。 138 名前：Name_Not_Found mailto:sage [2008/01/26(土) 01:20:24 ID:???] 必要ないかと divの最小幅は画像で引っかかって決まるだろうし。 139 名前：Name_Not_Found mailto:sage [2008/01/26(土) 19:43:53 ID:???] >>138 おまえ・・・・ 140 名前：136 mailto:sage [2008/01/28(月) 02:39:26 ID:???] レスありがとう。 結局、CSS2.0では本来は必要だけど、ブラウザが なんちゃって表示してくれる、って感じですね。 で、CSS2.1ならOK（autoで適宜解釈してくれる）ってことですね。 141 名前：Name_Not_Found mailto:sage [2008/01/29(火) 17:10:44 ID:???] 毎回手書きで文字の前に画像を持ってきていたのですが <p class="icon">ここに文字</p>と書いて 外部cssで画像を指定することは可能でしょうか？ 「css 画像」でググったのですが、解決できなかったのでアドバイスいただけると嬉しいです。 142 名前：Name_Not_Found mailto:sage [2008/01/29(火) 18:16:09 ID:???] cssというよりはxmlなきがしなくもない 143 名前：Name_Not_Found mailto:sage [2008/01/29(火) 19:20:56 ID:???] contentsもな、IE対応してないし 144 名前：Name_Not_Found mailto:sage [2008/01/29(火) 19:59:21 ID:???] 画像というのがどういう画像なのかわからんけど もしアイコンみたいな小さい画像だとしたら、 背景画像で左上に表示して、あとは画像の大きさに合わせて paddingとかtext-indentとかで中身をずらせばそれっぽくできる。 145 名前：Name_Not_Found mailto:sage [2008/01/29(火) 20:01:39 ID:???] あ、class="icon"って書いてるからアイコンぽいのでいいのか。 146 名前：Name_Not_Found mailto:sage [2008/01/29(火) 20:10:09 ID:???] <p><img src="kuso" />ここに文字</p> これに尽きるだろ、わざわざ CSS でするもんでもない てか、手書きって、<p class="icon">も手書きじゃねぇか 方法はいくらだってある、あんたの言う手書きってのはメモ帳でって事かい ならテキストエディタ使え 画像のファイル名を変えたら修正が大変だってかい なら置換使え 他にも定型のコピー＆ペーストなり、扱いやすいファイル名に設定するだの、いろいろ出来ることがあるだろうに この手間さえも省きたいんであれば”手書き”ってやつはやめときな、向いてないわキミには 147 名前：Name_Not_Found mailto:sage [2008/01/29(火) 21:44:43 ID:???] 146はこのスレで相談に乗ることに向いてないと思うのは私だけか。 148 名前：Name_Not_Found mailto:sage [2008/01/30(水) 02:24:16 ID:???] んー、146の応え方、好きだけどな。頑固親父が居るﾗｰﾒﾝ屋ぽいじゃんｗ 149 名前：Name_Not_Found mailto:sage [2008/01/30(水) 18:47:23 ID:???] kusoが入ったラーメンなんていやです＞＜ 150 名前：Name_Not_Found mailto:sage [2008/01/31(木) 19:32:17 ID:???] 特定の要素のみを指定する場合の書き方が混乱してきました。 例えばclassを使ってtableのth要素だけを指定したい場合どうすれば良いのでしょうか？ <html> <body> <table class="test"> <tr><th>あいうえお</th></tr> <tr><td>かきくけこ</td></tr> </body> </hmlt> 151 名前：Name_Not_Found mailto:sage [2008/01/31(木) 19:53:05 ID:???] table.test th { color: pink; } 152 名前：Name_Not_Found mailto:sage [2008/01/31(木) 19:53:16 ID:???] table.test th {...} 153 名前：Name_Not_Found mailto:sage [2008/01/31(木) 19:54:20 ID:???] ごめん 154 名前：Name_Not_Found mailto:sage [2008/01/31(木) 19:54:58 ID:???] table[class="test"] th { color: red; } 155 名前：Name_Not_Found mailto:sage [2008/01/31(木) 20:00:08 ID:???] test[class~="test"] th { color: yellow; } 156 名前：Name_Not_Found mailto:sage [2008/01/31(木) 20:26:14 ID:???] art5.photozou.jp/pub/125/168125/photo/6988405.jpg 「au、…」はHTMLの文字例です。背景はCSSで指定しています。 文字例をCSSでピクセル単位で動かすにはどうすればいいでしょうか? 157 名前：Name_Not_Found mailto:sage [2008/01/31(木) 20:58:59 ID:???] later-spacing プロパティ 158 名前：Name_Not_Found mailto:sage [2008/02/01(金) 12:08:30 ID:???] paddingすりゃいいだけだろ 159 名前：Name_Not_Found [2008/02/11(月) 02:20:11 ID:xgyjrVKt] HTML 文書には、 link 要素で import.css を読み込ませるようにしてあり、 その import.css には、 @import'style1.css'; @import'style2.css'; と、二つのスタイルシートファイルが更にインポートされるようにしてあります。 この style1.css と style2.css 両方に、 style1.css ： 文字の太さは通常の太さで、文字色は青にする。 style2.css ： 太文字にし、文字色は赤にする。 というような、異なる a 要素のスタイルが書いてある場合、 どちらの表示が優先されるのでしょうか？ また、 style2.css での記述を必ず優先させるためには、 !important を書くだけで平気でしょうか？ よろしくお願いします。 160 名前：Name_Not_Found mailto:sage [2008/02/11(月) 05:26:06 ID:???] 何で試したり、cssの仕様を読もうとしないの？ 161 名前：158 mailto:sage [2008/02/11(月) 17:04:19 ID:???] 試してみたのですが、 どちらが優先されているかがイマイチ分かりません…。 後からインポートした方(style2)の方が優先されるのでしょうか…？ 162 名前：Name_Not_Found mailto:sage [2008/02/11(月) 17:14:39 ID:???] 色盲なんだな。 163 名前：Name_Not_Found mailto:sage [2008/02/11(月) 17:27:34 ID:???] 上から下へ読んでいくんだろうが、ボケ PCは昔のことなんか振替んねぇんだよ 164 名前：Name_Not_Found mailto:sage [2008/02/12(火) 09:21:37 ID:???] お前らなんでcssの話してんだよカスが 大柴の話をちゃんとしろよ 165 名前：Name_Not_Found mailto:sage [2008/02/12(火) 12:45:50 ID:???] ルー語でおｋ 166 名前：Name_Not_Found mailto:sage [2008/02/12(火) 15:25:47 ID:???] ユーはホワイcssのトークオンリーな訳？ しっかり大柴のトークをトゥギャザーしようぜ 167 名前：Name_Not_Found mailto:sage [2008/02/12(火) 16:40:19 ID:???] ミーの脳がメルトダウン 168 名前：Name_Not_Found mailto:sage [2008/02/12(火) 22:21:27 ID:???] >>166 もはやそなたはルー語をマスターしてるな 169 名前：Name_Not_Found mailto:sage [2008/02/18(月) 10:21:33 ID:???] 幅指定ありのテーブルにボーダーを付けた時、ボーダーを含めて 幅が設定されるみたいなんだけど、これって仕様通り？ 例えば <table style="width:500px;border:3px solid #000;"> とかってした場合に、ボーダーを含めた幅が500pxになるみたいなんだけど。 （標準モードでも互換モードでも同じ） 仮に仕様通りの解釈だとして、どういう理屈になるのかな？ 170 名前：Name_Not_Found mailto:sage [2008/02/18(月) 16:25:06 ID:???] strictスレへどーぞ 171 名前：Name_Not_Found mailto:sage [2008/02/18(月) 20:01:26 ID:???] 　　ｼｭｯ 　　　　　　ｼｭｯ 　ｼｭｯ　　 ﾊ,,ﾊ　　ｼｭｯ 　ﾊ,,ﾊ彡（ ﾟωﾟ ),ﾊ （ ﾟωﾟ )彡ミ（ ﾟωﾟ )　お断りします ＿(__つ/￣￣￣/＿ 　　＼/　 　 　 / 172 名前：Name_Not_Found [2008/03/04(火) 10:29:28 ID:jxKPUKng] <div style="width:300px;height:300px;background-color:red;overflow:hidden;"> <img src="hoge.png" width="100" height="100" style="position:absolute;top:250px;left:250px;"> </div> 画像の赤いエリアからはみ出しているところが隠れるようにしたいと思っています。 IE7だと上の書き方でできましたが、 Opera9だとはみ出している部分が表示されてしまいます。 Operaでも可能な方法を教えてください。 173 名前：172 mailto:sage [2008/03/04(火) 10:39:52 ID:???] すみません解決しました。 divのほうにも絶対座標を指定すればいいんですね。 174 名前：Name_Not_Found [2008/03/04(火) 15:28:12 ID:58HvQhEk] <ol> <li>あああ</li> <li>いいい</li> </ol> としたとき、数字と文字（あああ）の隙間が空くのですが、 これを詰める方法はないでしょうか？ 175 名前：Name_Not_Found mailto:sage [2008/03/04(火) 15:51:59 ID:???] マーカー表示をやめて、content プロパティで表示するようにすれば？ IE対応？そんなゴミブラウザｼﾗﾈｰﾖ 176 名前：Name_Not_Found mailto:sage [2008/03/04(火) 17:18:11 ID:???] スレ違い ここはルー大柴スレだ 177 名前：Name_Not_Found mailto:sage [2008/03/04(火) 21:31:22 ID:???] オールマイティーオッケーさ　ブラザー 178 名前：Name_Not_Found [2008/03/05(水) 20:20:26 ID:3TVPhP6o] 「#***がclassで、.***がidだ」って書いてある本があるんだが、これは一体なんなのでしょうか？ 返品して貰えますかね？ 179 名前：Name_Not_Found mailto:sage [2008/03/06(木) 00:22:31 ID:???] なんていう本ですか？ 180 名前：Name_Not_Found mailto:sage [2008/03/06(木) 11:21:45 ID:???] div.newpage{ page-break-before: always;} で印刷時の改行位置をやってるんだが、 印刷プレビューしてみると、divで指定しているブロックの区切りの間がものすごい開いて、 改行ポイントまで一つのdivブロックを押し下げるって状態になってる。 ようするに、ある区間、真白な部分ができている状態。 これってどうすればいい？ 181 名前：Name_Not_Found mailto:sage [2008/03/06(木) 14:50:39 ID:???] どの UA で発生する現象なのかも書かないで質問とは片腹痛い 182 名前：178 mailto:sage [2008/03/08(土) 01:52:28 ID:???] >>179 『3日で作るPHPアプリケーション』秦崇・遠藤諭　アスキー という薄っぺらい本です。 PHPについての本ですが、なぜかCSSについても数頁ふれていて、そこでこの間違いが。 単なる誤植ではなく、著者が根本的に勘違いしてるんだと思われまする。 183 名前：Name_Not_Found mailto:sage [2008/03/08(土) 21:01:41 ID:???] ならCSS自体はおまけなわけで そこのまちがいくらいじゃ返品はできないでしょ 184 名前：Name_Not_Found mailto:sage [2008/03/10(月) 21:13:57 ID:???] >>182 指摘すれば図書券500円くれるかもよ 185 名前：Name_Not_Found mailto:sage [2008/03/26(水) 07:22:49 ID:???] >>181 間違っています。 以上。 ↓次どうぞ 186 名前：Name_Not_Found mailto:sage [2008/04/09(水) 16:25:49 ID:???] <html> <head> <style type="text/css"> h2{ background-image:url(nav_bk.gif); float:left;} </style> </head> <body> <h2>MMENU</h2> <h2>MMENU</h2> <h2>MMENU</h2> <h2>MMENU</h2> <h2>MMENU</h2> </body> って試しに書いたら www2.uploda.org/uporg1359650.png みたいに左のだけ上にズレルのは何故 187 名前：Name_Not_Found mailto:sage [2008/04/09(水) 17:34:29 ID:???] margin,paddingを殺す 188 名前：Name_Not_Found mailto:sage [2008/04/10(木) 02:57:56 ID:???] おk、試してみるｻﾝｸｽ 189 名前：Name_Not_Found mailto:sage [2008/04/10(木) 03:12:17 ID:???] padd殺さんでもmargin殺したらできた。 聞いてばっかりですまないがコレってどういう理屈？ 190 名前：Name_Not_Found mailto:sage [2008/04/10(木) 06:14:58 ID:???] 仕様書にinline要素はそうしろ的なことが書いてあるから 一応、UAによってmargin,paddingの解釈は違うので最初に全部殺しておくが吉 191 名前：Name_Not_Found mailto:sage [2008/04/10(木) 06:22:58 ID:???] 回答ｻﾝｸｽだぜ 192 名前：Name_Not_Found [2008/04/12(土) 01:51:31 ID:ezBgs235] 背景画像の範囲を左や真ん中に寄せるにはどうすればいいですか？ bodyでwidthを指定すればできると思いましたが背景画像だけは全体に広がってしまいます。 193 名前：Name_Not_Found mailto:sage [2008/04/12(土) 02:28:52 ID:???] >>192 a) box作ってそれに背景指定 b) 画像を表示したい幅または高さに加工し、repeat方向をyまたはx指定 194 名前：Name_Not_Found [2008/04/12(土) 13:21:43 ID:gYw71jVr] www.xn--cckza4ab6e9czhb.net/ これはJavaScriptかな？ 195 名前：Name_Not_Found [2008/04/12(土) 16:24:01 ID:CNG7bHPk] DTDでURL書いとけばieでも火狐でもそんなに機にしなくていいよ 196 名前：Name_Not_Found [2008/04/13(日) 05:10:04 ID:AdLzqwk3] ほら絶対配置なんかするとフッタから、金玉みたいにはみ出る事もあるじゃないか。 そういうのはCSSを諦めてtableを使ってみたりしてるのかい。 197 名前：Name_Not_Found mailto:sage [2008/04/13(日) 05:46:01 ID:???] 金玉はしまってあるし 198 名前：Name_Not_Found [2008/04/13(日) 07:28:41 ID:AdLzqwk3] 君は金玉に対する認識が間違っている。 折角、ぶらさげた金玉を皆に紹介しないでどうする。 それすらしたくない程に金玉が恥ずかしい存在なら 引きちぎってしまえ！！ 199 名前：Name_Not_Found [2008/04/27(日) 15:03:58 ID:B3KoEFqh] バックの色を指定しつつ それとは別に特定の場所から特定の場所までの色を別の色に指定する方法はありますか？ 200 名前：Name_Not_Found mailto:sage [2008/04/27(日) 17:26:22 ID:???] ありますよ。 201 名前：Name_Not_Found mailto:sage [2008/04/27(日) 21:39:41 ID:???] 余裕ですよ。 202 名前：Name_Not_Found mailto:sage [2008/04/28(月) 11:07:33 ID:???] CSSファイルを分けて作ると、管理はしやすいけど読み込みの処理が時間かからない？ 前にサーバーが極端に重いときに読み切れなかったりしたんだけど。 ずらずらと長い1つのCSSファイルか、 部分部分に分けた5つぐらいのCSSファイルか どっちがいいんだろうね 203 名前：Name_Not_Found mailto:sage [2008/04/28(月) 11:33:58 ID:???] そんなに細かい指定をずらずらCSSで行うのもどうかと 204 名前：Name_Not_Found mailto:sage [2008/04/28(月) 17:09:38 ID:???] 冗長なソースしか書けないんだろ 205 名前：Name_Not_Found mailto:sage [2008/04/28(月) 17:53:54 ID:???] 　 　　　　　　　ﾊ,,ﾊ 　僕、アルバイトォォ！！ 　　　　　 　 ('(ﾟ∀ﾟ∩_　僕をどこかのスレに送って！ 　　　　　　／ヽ 　 〈／＼　お別れの時にはお土産を持たせてね！ 　　　　 ／|￣￣￣|.＼／ 　　　 　 　| ﾓﾂ煮　|／ 　　　　　　 ￣￣￣ 現在の所持品：新聞、∈(･ω･)∋ﾀﾞﾑｰ、ゆうパック、ダム穴、NCSA Mosaic 206 名前：Name_Not_Found mailto:sage [2008/04/28(月) 18:09:52 ID:???] 普通にCSSだけで8kbいかないか？ 207 名前：Name_Not_Found mailto:sage [2008/04/28(月) 18:38:05 ID:???] んじゃ、まさるさんのとこに送り返すか 208 名前：Name_Not_Found mailto:sage [2008/04/28(月) 18:50:38 ID:???] >>206 8kbで重いんか？ 209 名前：Name_Not_Found mailto:sage [2008/04/28(月) 18:53:32 ID:???] >>205 土産：糞IE 行き先：society6.2ch.net/test/read.cgi/kokusai/1196906218/ 210 名前：Name_Not_Found mailto:sage [2008/04/28(月) 19:35:41 ID:???] htmlが大体12k〜24kに収まるようにしてるから、 cssだけで10kbいったりすると、長くなったかもと思う。 一回読み込めばいいから気にならんけど。 cssにした一番のメリットは転送量だったが、少しでも軽くしたい。 211 名前：Name_Not_Found mailto:sage [2008/04/28(月) 22:03:54 ID:???] 今見直したらHTMLが50Kから100KでCSSがざっと20Kほどか 50はさすがに個別ファイル化したほうが見やすいが、 idとnameによって一つのファイルに詰め込めるから詰め込んでいるが、 こりゃちょっとやりすぎだな。テーブルだとさらに増えそうだ。 212 名前：Name_Not_Found mailto:sage [2008/04/28(月) 22:59:48 ID:???] CSSもページ数が多くなってひとつに詰めるとそれぐらいになるよな 213 名前：Name_Not_Found mailto:sage [2008/04/28(月) 23:27:49 ID:???] ブログも煩雑だから20KB超えるぜ どの程度のclassとidを使用するかによって、 最終的な量が決定するわけだ。 シンプルでidもclassも指定しなければ問題はないけど、 段組とかやりまくっていると、結構な量になるね。 214 名前：Name_Not_Found mailto:sage [2008/04/28(月) 23:38:35 ID:???] テーブルレイアウト→CSS段組→シンプルなCSS こう移ると見た。 CSS段組も飽きると質素な、ほとんど文法のみのhtmlになるのかな。 215 名前：Name_Not_Found mailto:sage [2008/04/28(月) 23:46:29 ID:???] ならないだろ。 歴史的な系譜としては、 シンプル→テーブル→CSS だよ。 発端は紙媒体のデザインをwebで表現したいことなんだから。 216 名前：Name_Not_Found mailto:sage [2008/04/29(火) 03:43:00 ID:???] 定番な3カラムCSSだけど デザイン的には悪くないんだけど カッチリやればやるほど融通が利かなくなるな 文字サイズを最大にしたら崩れたり、cssでキッチリサイズ指定するから 217 名前：Name_Not_Found mailto:sage [2008/04/29(火) 07:43:23 ID:???] さすがルー大柴公認のｽﾚ 218 名前：Name_Not_Found mailto:sage [2008/04/29(火) 09:58:38 ID:???] というか、文字サイズ変更で崩れないデザインのほうが難しいだろ。 IE7は描画が特殊だからborder指定した瞬間、文字サイズ変更で崩れるのが確定。 219 名前：Name_Not_Found mailto:sage [2008/04/29(火) 10:07:12 ID:???] 1カラムが少なくてさびしいな。 2カラムも好きだが、基本1カラム。 3カラムとかなんですか……なんであんなごちゃごちゃしたものが好きなんだろう。 220 名前：Name_Not_Found mailto:sage [2008/04/29(火) 12:34:15 ID:???] ヘタレ発見・・・>>218 221 名前：Name_Not_Found mailto:sage [2008/04/29(火) 12:45:58 ID:???] 縦のスタイルのほうが楽だから 3カラム→2カラム→ほとんど1カラムになったよ 222 名前：Name_Not_Found mailto:sage [2008/04/29(火) 13:53:38 ID:???] 読む分にも3カラムって全くメリットないしな。 あれって作成者がアフィ貼り付けるのに便利ってだけじゃね？ 223 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:28:23 ID:???] www.templatemonster.jp/show.php?templ=13269&discount=&hide_flash=0&page=0 これってCSSで可能ですか？ 可能だとしたら、どうやってレイアウトすればいいのでしょうか？ 特に下の両サイドあたりが、よくわからなくて。 どうかお願いします。 224 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:29:48 ID:???] ちなみに↑これって下の両サイドはブラウザに合わせて伸縮するんですよね・・・？ どうかお願いします。 225 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:45:10 ID:???] 余裕だな。中身まで伸縮されたら厄介だったが。 後方互換は無視する。考えると面倒だ。 body { margin:auto; width:800px; } <body> ここの中のものが中央ブロック揃えになりますよ </body> 当たり前だが、後方互換を考えたらbodyではなくdivに指定する必要がある。 互換モードが発動するとbody要素ではセンタリングできないんだ。 226 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:49:37 ID:???] さらに段組にする場合は、floatを使って外幅の90%を超えないように指定する。 この場合、メニュー部分は250pxで本文部分は500pxでいいだろう。 後方互換の場合は全体にtext-align:leftを指定して、 bodyにtext-align:centerを指定する。さらに中身は全部外側にdivで外側divにwidth指定とmargin:autoだ え？　text-alignはボックス位置の指定ではなくテキストの位置指定だって？　MSの製造ミスですよ。 227 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:53:08 ID:???] #CONTENT { width: 500px; float: right; } #MENU { width: 250px; float: left; } <div id="CONTENT"> <p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p> <p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p> <p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p> </div> <div id="MENU"> <p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p> <p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p> <p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p> </div> 段組はこういう感じ。お粗末様 228 名前：Name_Not_Found mailto:sage [2008/04/29(火) 17:55:30 ID:???] >>223 は、「このページの作り方」を聞いてるんじゃなくて 「このページで紹介されているテンプレート」の作り方を 聞いてるんじゃないかと思うんだ。 229 名前：Name_Not_Found mailto:sage [2008/04/29(火) 18:00:37 ID:???] >>228 そのとおりでございます・・・ >>225さん ありがとうございます。 いただいた内容も全部理解しきれていないのですが・・・ 背景の写真とか、下のメニューの伸縮を考えると少し違うような？ 中身のテンプレの作りを教えていただけるとありがたいです。 もし、私の勘違いだったらすみません・・・ どうかお願いいたします。 230 名前：Name_Not_Found mailto:sage [2008/04/29(火) 18:06:42 ID:???] orz もしかしてflashの中身か…… 上半分と下半分はまず最初にdivでグーピングして分割する。 別にフレーム使ってもいいけどさ。 上はタブメニュー部分をulリストにして丁寧にfloat そこから内容は2カラム段組。さっき表示したパターンのdivを採用だ。 縦に表示が崩れると困る場合はここでoverflowを使う。 で外枠のdivに角丸背景画像を表示して上は完成 下は三カラム段組。一個ずつ丁寧にfloatしていく。 floatブロックの角丸は背景画像使うと楽だからそれ使え。 さらに外枠divにwidth指定。marginの指定も忘れるなよ。 で、あまった背景部分はおそらく別の背景画像を表示する。 下3カラムはおそらく固定だろう。上は伸縮しそうだけど。 231 名前：Name_Not_Found mailto:sage [2008/04/29(火) 18:09:47 ID:???] グルーピングすら不要だと思うがとにかく余裕 がんがれ 232 名前：Name_Not_Found mailto:sage [2008/04/29(火) 18:13:31 ID:???] body背景画像は左右に角丸と写真を描いたものno-repeatでtop・center位置に指定。 背景色は#fffかな？ もしくは下三カラムは角丸+縦横の線を描いたものを背景画像で指定かな？ すると中身は固定だが、背景部分のお陰で大きく見ると伸縮しているように見える。 この容量だと1024よりも大きい解像度で見ることはまずないだろうから、気にしないでいいだろう。 気になるのなら真ん中だけ可変幅にするとか出来なくないんだけど、そうすると角丸のために余分なdivが二つ必要になる。 233 名前：Name_Not_Found mailto:sage [2008/04/29(火) 18:17:05 ID:???] floatしたものにmarginは出来ないかorz とりあえず四つのブロックに幅指定する。 上と下は別物として扱う。下はfloatする。 これだけね。すまんね。長々と。 234 名前：Name_Not_Found mailto:sage [2008/04/29(火) 21:18:30 ID:???] >>223 俺と好みが近いな。 他のテンプレートも紹介してくれ！ 235 名前：Name_Not_Found [2008/05/01(木) 22:14:14 ID:ECONvAZd] float指定で困っています。 side1、main、side2を間隔なく配置し、それをブラウザの中央に表示したいと考えています。 この３つの要素をfloat:leftで左寄せにし、contentsというdiv要素の中に記述しました。 marginは0px、paddingも0pxと指定し、各要素のwidthはside1が9px、mainが740px、side2が9pxに 設定しました。合計で758pxなのでcontentsのwidthを758pxにしましたが、side2がside1の真下に配置されてしまい困っています。 IE6で確認しただけなのですがなぜかわかる方いましたらご教授お願いします。 236 名前：Name_Not_Found mailto:sage [2008/05/01(木) 22:34:56 ID:???] 合計値は外幅の90%にするんだよ じゃないと崩れる 237 名前：Name_Not_Found mailto:sage [2008/05/01(木) 22:40:35 ID:???] >>235 IEは横幅合計値とコンテナボックス横幅が同じだと下に落ちる有名なバグがある。 238 名前：Name_Not_Found mailto:sage [2008/05/01(木) 22:40:43 ID:???] ちなみに、その場合、mainのみでいいんじゃないか？ 外側のdiv（この場合、contents）にpaddingかmarginを指定するのが定石だよ で、さらに外側のbodyをセンタリングするといい感じ。 もしくはmainのみでpaddingかmarginを表示して幅指定しない 239 名前：Name_Not_Found [2008/05/01(木) 22:50:15 ID:ECONvAZd] >>236 >>237 すばやい指摘ありがとうございます。 width761pxにしたらしっかりなりました。 >>238 <body> <div class="contents"> <div class="side"><img src="aaa.jpg" width="9"></div><!-- end side--> <div class="main"> <div class="t_logo"><img src="logo.jpg" width="220"></div><!-- end t_logo--> <div class="t_photo"><img src="photo.jpg" width="520"></div><!-- end t_photo--> </div><!-- end main--> <div class="side"><img src="bbb.jpg" width="9"></div><!-- end side--> </div><!-- end contents--> </body> こんな感じになっています。logoとphotoにもfloat:leftつけてきっちり配置しているので （デザイン上1pxも空けたくないので・・・）こんな面倒なことになってしまって。 240 名前：Name_Not_Found mailto:sage [2008/05/01(木) 22:54:30 ID:???] >>239 背景画像として組み込んだほうが、管理しやすいってことだよ 特にimgのみのdivってのはさほど意味がない ごちゃごちゃとソースをいじるよりは一発なんだ 241 名前：Name_Not_Found mailto:sage [2008/05/01(木) 22:56:54 ID:???] 書き忘れたが、divではなく、h*……つまり見出しの場合はimgの方が楽 242 名前：Name_Not_Found [2008/05/01(木) 23:03:06 ID:ECONvAZd] >>240 ご指摘ありがとうございます。 書き忘れましたが、背景に組み込みめばよかったのですが、デザイン上背景にすでに別の画像を組み込んでいたので 仕方なくこのような形をとりました。ブラウザによっては何個か背景画像を組み込めるらしいのですが通常は1つだけらしいので・・・ 何か別の簡単なやり方などがあればご教授お願いします。 243 名前：Name_Not_Found mailto:sage [2008/05/01(木) 23:35:45 ID:???] つーかこのスレで質問すんなよ・・・ 244 名前：Name_Not_Found mailto:sage [2008/05/02(金) 00:10:20 ID:???] sageも知らん超初心者だからな 245 名前：Name_Not_Found mailto:sage [2008/05/02(金) 00:25:45 ID:???] >>242 一つの要素に表示できる背景画像は一つ 旧IEを考えればhtmlはムリなので、 body以下の要素になる つまり、bodyやdivなどがこの場合最有力候補 固定は旧IEのバグで一個しか固定できないが、普通に考えたら一個固定できれば十分 後は自分で考えろ。そうじゃないと成長しないぞ 246 名前：Name_Not_Found mailto:sage [2008/05/02(金) 00:29:16 ID:???] って、書いて、分からないだろうから答えを書く。 contentsが内包するdiv三つの画像を合体させて、contentsに背景表示する もし、side main logo photoに背景表示されている場合はもう諦めるしかないけどね それに、ソースを見る限り内包しているのはimg要素であってテキストではない この場合テキストを追い出すテクニックもあるが、確かにこりゃfloatしかないわ おせっかいすまんね 247 名前：Name_Not_Found mailto:sage [2008/05/02(金) 10:29:52 ID:???] >>IEは横幅合計値とコンテナボックス横幅が同じだと下に落ちる有名なバグがある。 これってpx指定でも崩れる？ どっか解説してるページとかあったら教えて。 248 名前：Name_Not_Found mailto:sage [2008/05/02(金) 12:09:22 ID:???] つーかdivの直下にimg 249 名前：Name_Not_Found mailto:sage [2008/05/02(金) 12:25:08 ID:???] おまえらネタスレで何やってんだ 250 名前：Name_Not_Found mailto:sage [2008/05/02(金) 17:39:26 ID:???] 本音で語れないこの世の中じゃあ・・・ 251 名前：Name_Not_Found mailto:sage [2008/05/02(金) 18:56:33 ID:???] >>246 どうもです。 参考になりました。自分なりにいろいろ試してみます。 252 名前：Name_Not_Found [2008/05/16(金) 14:57:31 ID:yRdVj5ds] hr要素にborder-styleを適用する手法は有りですか? dottedを指定しても、FirefoxとSafariでだけベタの直線になってしまいます。 スタイルシート適用時は点線の罫線で、非対応のときは通常の罫線を表示したいのですが、 うまくいきません。 253 名前：Name_Not_Found mailto:sage [2008/05/16(金) 15:20:57 ID:???] UA依存だから仕方ない 254 名前：Name_Not_Found [2008/05/16(金) 21:53:02 ID:8V5hksUz] 質問 画像付きボタンを　img src=　で書いたのですが、FireFoxだけちょっと横長で 小さくなりません、小さくするにはどうしたらいいのでしょうか？ 255 名前：Name_Not_Found mailto:sage [2008/05/16(金) 22:39:47 ID:???] はあ？web初心者スレ池 256 名前：Name_Not_Found mailto:sage [2008/05/17(土) 01:20:30 ID:???] >>253 やはりしかたないのですね。罫線の意味としては変わらないので、そのままでいくことにします。 257 名前：Name_Not_Found mailto:sage [2008/05/17(土) 01:20:58 ID:???] あ、罫線ではなく水平線か。 258 名前：Name_Not_Found mailto:sage [2008/05/17(土) 02:31:45 ID:???] だからここは質問スレじゃねえっての！ 259 名前：Name_Not_Found mailto:sage [2008/05/17(土) 03:22:33 ID:???] >>258 じゃあ何なの? 検索してヒットする質問スレは上級者用だけだし、「スタイル」で探して辿り着いたのだが。 260 名前：Name_Not_Found mailto:sage [2008/05/17(土) 04:21:34 ID:???] スタイルで検索ってダイエット板か 261 名前：Name_Not_Found mailto:sage [2008/05/17(土) 04:56:09 ID:???] >>259 マジレスすると ネ　タ　ス　レ　。 「CSS初心者」で検索汁 262 名前：Name_Not_Found mailto:sage [2008/05/17(土) 16:18:55 ID:???] CSSの質問かもわからないのにいい加減な誘導すんな 263 名前：Name_Not_Found mailto:sage [2008/05/17(土) 22:11:20 ID:???] >>262 間違ってここにきたとしてもCSSの質問じゃないことはあり得ない件 お前のほうが質問者よりスレタイ間違えてね？ 264 名前：Name_Not_Found mailto:sage [2008/05/17(土) 22:38:36 ID:???] ハァ？ 265 名前：Name_Not_Found mailto:sage [2008/05/18(日) 00:34:46 ID:???] >>263 カスケーディングスタイルシートではなく単にスタイルシートについて質問する人が 多いのではないかと。 266 名前：Name_Not_Found mailto:sage [2008/05/18(日) 04:58:08 ID:???] ハァ？ 267 名前：Name_Not_Found mailto:sage [2008/05/18(日) 12:26:51 ID:???] >>265 JSSやXSLの質問なんてあったか？ｗｗｗ そんなことよりも、どっちのスレもCSS用スレだから無関係。 268 名前：Name_Not_Found mailto:sage [2008/05/18(日) 13:43:41 ID:???] >>260 「スタイルシート」で検索したあと、「シート」を削って再検索。 269 名前：Name_Not_Found mailto:sage [2008/05/18(日) 22:16:17 ID:???] そりゃダイエットし過ぎってもんで 270 名前：Name_Not_Found [2008/05/19(月) 15:38:04 ID:2teYNWNa] 『仕切り奉行』が五月蠅すぎ。 271 名前：Name_Not_Found mailto:sage [2008/05/19(月) 21:50:55 ID:???] 五月蠅いって漢字がうるせーよｗｗｗ 272 名前：Name_Not_Found mailto:sage [2008/05/19(月) 21:56:57 ID:???] ご･･･ごがつばえ 273 名前：Name_Not_Found mailto:sage [2008/05/19(月) 22:19:32 ID:???] たしかに五月蠅いｗｗｗｗｗ 274 名前：Name_Not_Found mailto:sage [2008/05/26(月) 10:19:34 ID:???] 特定のクラスのタグ内にあるテキストの先頭に 番号を順番に振っていきたいのですが， こういうことってスタイルシートだけでできるのでしょうか？ <div class="title">たいとる</div> <div class="naiyou">内容</div> <div class="title">たいとる</div> <div class="naiyou">内容</div> <div class="title">たいとる</div> <div class="naiyou">内容</div> のような繰り返しがあるときに，title タグの中の 文字列の先頭に番号を振っていきたいのですが・・・・ 今は連番を返してくる関数を書いて， <div class="title"> 　<script type="javascript"> 　　renban(); 　</script> 　たいとる </div> のようにしているのですが，面倒で・・ 275 名前：Name_Not_Found mailto:sage [2008/05/26(月) 11:04:52 ID:???] >>274 ol 276 名前：Name_Not_Found mailto:sage [2008/05/28(水) 08:49:09 ID:???] >>274 質問スレに行きなさい。ここはネタスレ 277 名前：Name_Not_Found [2008/07/04(金) 18:15:59 ID:zSjWM7/K] cgiで吐き出すテーブル（サーチエンジンの結果）を改行ではなく、 順に横に並べていって、横まで行きついたら改行するっていうのを cssでやろうと思うのですがどのようにすればいいでしょうか？ 278 名前：Name_Not_Found mailto:sage [2008/07/04(金) 19:29:22 ID:???] float 279 名前：Name_Not_Found [2008/07/04(金) 20:02:47 ID:zSjWM7/K] >>278 ありがとうございます。 フロートでできたのですが、一つ一つのテーブルの縦の長さが違うため、ブラウザの端まで来て回り込む際にガタガタになってしまいます。 ブラウザの横サイズを決めちゃう以外で何かいい方法はあるでしょうか？ 280 名前：Name_Not_Found mailto:sage [2008/07/04(金) 21:21:14 ID:???] tableの高さを決めちゃう 281 名前：Name_Not_Found [2008/07/05(土) 20:54:59 ID:PZ6XbNJj] 質問です。 下記のような同じ構成のボックス（四角は画像など）を 回り込ませてレイアウトした際にIE6でまれにボックスの 文章の最後から5文字くらいが外にはみ出してしまうことが あるのですが対処方法はないでしょうか？ ■こうなるはずが・・・ ┏━━┓　　　　　　　　┏━━┓　　　　　 ┃　　　┃あいうえお　 ┃　　　┃さしすせそ ┃　　　┃かきくけこ　 ┃　　　┃たちつてと ┗━━┛　　　　　　　　┗━━┛　　　　　 ┏━━┓　　　　　　　　┏━━┓　　　　　 ┃　　　┃なにぬねの  ┃　　　┃まみむめも ┃　　　┃はひふへほ  ┃　　　┃やゆよ ┗━━┛　　　　　　　　┗━━┛　　　　　 ■IE6でたまにこうなる ┏━━┓　　　　　　　　┏━━┓　　　　　 ┃　　　┃あいうえお　 ┃　　　┃さしすせそ ┃　　　┃かきくけこ　　┃　　　┃たちつてと ┗━━┛　　　　　　　　┗━━┛　　　　　 ┏━━┓　　　　　　　　ひふへほ←────左のボックス内の後ろ5文字くらいが ┃　　　┃なにぬねの　┏━━┓　　　　　　　　この辺に分身として現れる ┃　　　┃はひふへほ ┃　　　┃まみむめも ┗━━┛　　↑　　　　 ┃　　　┃やゆよ 　　　　　　　　│　　　　┗━━┛　　　　　 　　　　　　　　│ ここにきちん文章があるのに 282 名前：Name_Not_Found mailto:sage [2008/07/05(土) 22:11:49 ID:???] >>281 IE6のfloat関連バグは山程あり、情報も山程あるんだからググレカス 283 名前：Name_Not_Found mailto:sage [2008/07/06(日) 04:53:23 ID:???] IE6以外で正しく表示できるならIE6対策を取らず放っておいても構わないとさえ思う。 284 名前：Name_Not_Found mailto:sage [2008/07/06(日) 10:36:17 ID:???] >>281 最後に<br>入れてみ 285 名前：Name_Not_Found [2008/07/10(木) 21:55:01 ID:5d81RjCM] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=SHIFT-JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title></title> <style> div#foo { width: 100px; height: 100px; border: 5px solid #000; } div#foo p { display: none; } </style> </head> <body> <div id="foo"><p>FOO<p><div><img src="./foo.gif" width="100" height="100" /> </body> </html> 例が変で申し訳ないですが、 上記HTMLを出力すると、foo.gif のボトムに数ピクセルの隙間が必ずできてしまいます。 対応方法はあるのでしょうか？ 286 名前：285 [2008/07/10(木) 22:01:14 ID:5d81RjCM] すいません。追記です。 この現象はIE6のみで発生します。 287 名前：Name_Not_Found mailto:sage [2008/07/10(木) 22:27:09 ID:???] >>286 こんな風にしてみたらどうかな？ div#foo p { display: none; margin: 0px; } 288 名前：Name_Not_Found mailto:sage [2008/07/10(木) 22:35:20 ID:???] >>287 変わりませんでした。 289 名前：Name_Not_Found mailto:sage [2008/07/11(金) 01:02:22 ID:???] そうか・・・では知らん!!(｀･ω･´)ｷﾘｯ!! 290 名前：Name_Not_Found mailto:sage [2008/07/11(金) 09:59:02 ID:???] >>285 img {vertical-align:bottom;} 291 名前：Name_Not_Found [2008/07/19(土) 00:31:11 ID:nQ5rYAPt] PHPとCSSを使っていますがCSSでも変数って使えないの? 色とか文字サイズを1つ1つ指定していくのは大変・・・ もっと効率よく使いたいので変数が使えればいいな〜 292 名前：Name_Not_Found mailto:sage [2008/07/19(土) 01:49:04 ID:???] セレクタの意味わかってる？ 293 名前：Name_Not_Found mailto:sage [2008/07/19(土) 02:08:06 ID:???] プログラマは頭がカタい 294 名前：Name_Not_Found mailto:sage [2008/08/06(水) 01:00:15 ID:???] あああああああああああああああ あああああああああああああああ 　　いいいいいいいいいいいいい（改行）<!-- 先頭2文字分あき --> 　　いいいいいいいいいいいいい（改行） 　　　　ううううううううううう（改行）<!-- 先頭4文字分あき --> 　　　　ううううううううううう（改行） こういうのが作りたいんですが、p ではなくspanでできないでしょうか。 p.3 { margin-left: 3em } 295 名前：Name_Not_Found mailto:sage [2008/08/06(水) 02:04:37 ID:???] >>294 padding 296 名前：Name_Not_Found [2008/08/07(木) 19:44:51 ID:fv5MkkX5] 画像をセンタリングするのに２時間かかってもできないのです・・・ 初心者な質問すぎて申し訳ないです！ （テンプレも読んだのですが上手く行かず） <div style="text-align: center;"><img ほにゃ/></div> ならうまくいくのですが、CSSを別ファイルにして test.css: .centering{text-align: center;} test.html: <div class="centering"><img ほにゃ/></div> とすると左寄せになってしまいます。centering クラスの中に margin: 0px auto; display: block; やら何やらいろいろ足してみてもだめです・・・何が間違っているのでしょうか？ 297 名前：Name_Not_Found mailto:sage [2008/08/07(木) 20:06:02 ID:???] >>296 ・text:alignはインライン要素に有効 ・imgはインライン要素 ・divはブロックレベル要素 ・IEは糞 298 名前：Name_Not_Found [2008/08/07(木) 21:08:13 ID:fv5MkkX5] >>297 お返事ありあとうございます！ 上３つはわかったのですが、 一番したの「IEは糞」というのは・・・？ バグが多いと聞いたことがありますが、そういうことでしょうか。 もう３時間以上この問題で右往左往して疲れてしまったので、 作業は明日にします・・・ああ、どうして画像を中央に持ってくるだけで こんなに面倒くさいのか・・・<center>タグとか<div align>とか 使いたいなあ、正直・・・ 299 名前：Name_Not_Found mailto:sage [2008/08/07(木) 22:18:42 ID:???] わかるタグを使えばいいのです。 背伸びしても仕方ないのです。 300 名前：Name_Not_Found [2008/08/07(木) 22:53:10 ID:fv5MkkX5] >>299 非推奨のタグって使っても大丈夫なんですかね？ ある日からポンと使えなくなりそうで怖いです・・・ （現実問題大丈夫なんでしょうけどねー） 301 名前：Name_Not_Found mailto:sage [2008/08/07(木) 23:11:10 ID:???] >>300 まず標準モードにしてみたらどうかな 302 名前：Name_Not_Found mailto:sage [2008/08/07(木) 23:34:21 ID:???] バグも多いし仕様もおかしい。 303 名前：Name_Not_Found mailto:sage [2008/08/10(日) 02:10:30 ID:???] 外部cssから全てのdivにフィルタ filter:Alpha(opacity=70) をかけているんだけど、 divの中の画像にはかからないようにするにはどうすれば良いですか？ 304 名前：Name_Not_Found mailto:sage [2008/08/10(日) 02:25:24 ID:???] >>303 img { position: relative; } 305 名前：Name_Not_Found mailto:sage [2008/08/10(日) 02:32:20 ID:???] >>303 そんなのはIE独自プロパティでCSSじゃねえよスレチ。 306 名前：Name_Not_Found mailto:sage [2008/08/10(日) 02:52:42 ID:???] >>304-305 解決しました。 即答ありがとう、すれ違いごめん 307 名前：Name_Not_Found [2008/08/11(月) 20:27:54 ID:CNc3/M+W] a:link { color: --- }やa:visited { color: --- }など、リンク色を変えるのは、 外部スタイルシートから呼び出すことはできないんですか？ 目的のhtml文書のbodyに組み込むしかないんでしょうか。 308 名前：Name_Not_Found mailto:sage [2008/08/11(月) 20:57:47 ID:???] >>307 外部スタイルシートから呼び出せるよ。 うまくいかないとしたら、どっか記述間違ってるんじゃないかな。 309 名前：Name_Not_Found mailto:sage [2008/08/11(月) 21:22:19 ID:???] >>308 回答ありがとうございます。安心しました。 どっか間違ってないか見直してきます（｀・ω・´） 310 名前：Name_Not_Found [2008/08/14(木) 13:00:42 ID:r25rewuU] 質問です。 box1(div)のheightに固定値を指定すると「余白」の色が box1で指定した背景色（仮に青とする）になるのですが、 autoにすると、青になったり白(box2とbox32の背景色）に なったりします。 高さ以外に違いがないと思われるページで、違う色になります。 高さが関係するのかと思って調べたのですが、 高さの関係が、ｘ>ｙ>ｚになるｘとｚが青で、ｙが白になるので 関係ないような気がしています。 table1とbox31の高さは常に同じで、table1の高さの方がbox31の 高さより大きく、box32の高さが可変です。 どういう原因が考えられるのでしょうか。 　ｂｏｘ１ 　　ｔａｂｌｅ１　ｂｏｘ２ 　　　　　　　　　　　ｂｏｘ３１ 　　　余白　　　　　　ｂｏｘ３２ よろしくお願いします。 311 名前：Name_Not_Found [2008/08/14(木) 13:05:21 ID:r25rewuU] ↑補足します。 ｔａｂｌｅ１とｂｏｘ２はｂｏｘ１の要素です。 ｂｏｘ３１とｂｏｘ３２はｂｏｘ２の要素です。 312 名前：Name_Not_Found mailto:sage [2008/08/14(木) 13:19:51 ID:???] ・floatやpositionした要素に高さは無効 ・boxの挙動がおかしいと思ったら、borderを付けて確認するのが基本 ・ソース出せ馬鹿 313 名前：Name_Not_Found mailto:sage [2008/08/14(木) 13:20:16 ID:???] ソースをよこせ 314 名前：Name_Not_Found mailto:sage [2008/08/14(木) 16:15:03 ID:???] そーだよそーだよソースだよ 315 名前：Name_Not_Found mailto:sage [2008/08/15(金) 15:18:57 ID:???] テーブル全体をリンクに使用したいしたいのですが 現在は onclick="window.open('view/research_capital_view.html')" を使用しています。 これをスタイルシートで実現する方法はないのでしょうか JAVAScriptで行うとHover設定がまったく反映されないのと 構造が綺麗にならない点が不満です。 316 名前：Name_Not_Found mailto:sage [2008/08/15(金) 16:47:37 ID:???] >>315 JSだとかCSSだとか以前の問題だ tableをaの中に入れるのは間違い 317 名前：Name_Not_Found mailto:sage [2008/08/15(金) 18:06:57 ID:???] >>316 それは、分かっているから、JAVAScriptでやっているわけでして とはいえIE、Opera、FireFoxで挙動は全然違いますが、 aの中にTableを無理やりぶち込んだほうが、 まだ求めている物に近い動作はするですよね。 特にFireFoxはそのものズバリの動作をしてくれてしまいます。 318 名前：Name_Not_Found mailto:sage [2008/08/15(金) 19:18:44 ID:???] スレ違いということも分からないのに分かってるとかｗ 319 名前：Name_Not_Found mailto:sage [2008/08/15(金) 21:58:42 ID:???] そもそもこのスレが質問スレではない件 320 名前：Name_Not_Found [2008/08/17(日) 21:12:57 ID:+JE4P2wV] >>318 CSSで細工して、そのように動かすことが出来ないか？ という質問なのですが ここはCSSの質問スレではないのですか？ 321 名前：Name_Not_Found mailto:sage [2008/08/17(日) 23:16:51 ID:???] >>320 htmlにはa要素にtarget属性がありますが、HTML4.01で非推奨、 xhtml1.1では廃止されました。 cssで動的な指定はできません。 322 名前：Name_Not_Found [2008/08/18(月) 11:29:53 ID:AufoEyIv] >>321 Hover以外に動的な細工をする方法はないんですね trやtdには出来てもTable自体にHoverが有効でない以上 手法はなしという事なんですね ありがとうございました 323 名前：Name_Not_Found mailto:sage [2008/08/18(月) 21:29:37 ID:???] 馬の耳に念仏 324 名前：Name_Not_Found [2008/08/19(火) 13:14:57 ID:WaoB7Y1R] <div class="box1"> 　<table class="box2"> 　　<tr class="box3"> 　　　　・・・・ って構造だとbox1にfont-size指定してもbox3内には利かない？ 325 名前：Name_Not_Found mailto:sage [2008/08/19(火) 15:27:46 ID:???] フツーdivにtableなんて入れないけど、利かないブラウザあんの？ 326 名前：Name_Not_Found mailto:sage [2008/08/20(水) 15:05:37 ID:???] >>325 えっ 327 名前：Name_Not_Found mailto:sage [2008/08/20(水) 19:40:50 ID:???] おっ 328 名前：Name_Not_Found mailto:sage [2008/08/20(水) 23:43:10 ID:???] ぱ 329 名前：Name_Not_Found mailto:sage [2008/08/20(水) 23:47:06 ID:???] っ 330 名前：Name_Not_Found mailto:sage [2008/08/20(水) 23:49:04 ID:???] ぴー 331 名前：Name_Not_Found mailto:sage [2008/08/22(金) 04:26:23 ID:???] >>316 tableをaの中に入れてはいけないのか…。 table全体をa nameで囲んだりよくするのだけど。 332 名前：Name_Not_Found mailto:sage [2008/08/22(金) 04:57:40 ID:???] この場合a hrefと言いたいんじゃないかと a nameならcaptionやhxに付けた方がスマートではないかと 333 名前：Name_Not_Found [2008/09/02(火) 11:19:17 ID:lN/qnR2r] 印刷するときに、css を使って印刷するページごとに ヘッダやフッタを付けたいのですが可能ですか？ 334 名前：Name_Not_Found mailto:sage [2008/09/02(火) 22:47:31 ID:???] 余計な事すんな 335 名前：Name_Not_Found mailto:sage [2008/09/03(水) 01:39:29 ID:???] >>333 <link rel="stylesheet" type="text/css" href="print.css" media="print"> printcssは印刷のときだけ適用される。 336 名前：Name_Not_Found mailto:sage [2008/09/24(水) 06:16:35 ID:???] >>332 a hrefだろうがa nameだろうが インライン要素でブロック要素を囲むな 337 名前：Name_Not_Found mailto:sage [2008/09/24(水) 07:34:11 ID:???] 他にもつっこみどころ満載 HTMLから勉強してこい 338 名前：Name_Not_Found mailto:sage [2008/09/24(水) 16:49:23 ID:???] ﾌﾟ 339 名前：Name_Not_Found mailto:sage [2008/09/24(水) 20:11:22 ID:???] 質問失礼します。 web初心者スレでも質問させていただいたのですが あちらなんだか荒れてるみたいでスルーされてしまったので こちらでも質問させていただく失礼をお許しください。 <STYLE TYPE="text/css"> <!-- TABLE {font-weight:bold;} --> </STYLE> でページ全体の文字を太くしたのですが、一部分だけ細字に戻すことはできますか？ よろしくおねがいします。 340 名前：Name_Not_Found mailto:sage [2008/09/24(水) 21:36:47 ID:???] >>339 細くしたい部分に font-weight:normal;を指定 341 名前：Name_Not_Found mailto:sage [2008/09/24(水) 22:12:29 ID:???] >>340 できました！ありがとうございます！ スタイルシートの効果を部分キャンセルする方法ばかり考えていました…。 342 名前：Name_Not_Found mailto:sage [2008/10/08(水) 17:39:05 ID:???] floatしたボックスをネガティブマージンで重ねた場合の重なり順序は、 後続が絶対上にしかならないのでしょうか？ <!-- 例HTML --> <div id="satou"> 　<div id="sio"></div> 　<div id="solt"></div> </div> /* 例CSS ++++++++++++++++ */ #satou{ 　width:45px; } #sio{ 　float: left; 　width: 100%; 　height:30px; 　margin-bottom: -15px; 　background-color: #FFF; } #solt{ 　float: left; 　width: 100%; 　height:30px; 　background-color: #000; } というコードの時の、重なり方についてです。 #FFFが15px+#000が30px、#FFFが30px+#000が15pxとコントロールできないのでしょうか？ 343 名前：Name_Not_Found mailto:sage [2008/10/08(水) 19:13:40 ID:???] >>342 position+z-indexで可能 344 名前：Name_Not_Found mailto:sage [2008/12/26(金) 15:32:30 ID:???] W3CのCSSチェックかけると 「padding-leftとかpadding-rightの値にautoとかねーよw」とか言われる…。 これって廃止になったの？使わない方がいいんだろうか？ 345 名前：Name_Not_Found [2008/12/26(金) 23:14:43 ID:h+SjkvEv] 説明しにくいのですが、画面いっぱいに表示するメニューに div style="overflow:auto"を使って、サイドバーのようなものを作りたいのですが、 下のようにしたとき、 IEなら画面を小さくして、div.sidebarの中身がはみ出るときちんとスクロールバーが出るのですが、 firefoxで表示させると、divの中身が全部表示できるだけ大きくなってしまいます(スクロールしない) うまくfirefoxで表示できる方法はありませんか? <html><body> <table style="width:100%;height:100%;"> <tr> <td colspan="2" style="height:1;background-color:#f00">　</td> </tr><tr> <td style="width:20%;background-color:#ff0"> <div id="sidebar" style="overflow:auto;height:100%;"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br> </div> </td> <td rowspan="2" style="background-color:#f0f">　</td> </tr><tr> <td style="height:1;background-color:#0ff">a</td> </tr></table> </body></html> 346 名前：Name_Not_Found mailto:sage [2009/01/03(土) 02:14:06 ID:???] css初心者です 作った（といっても改変可サンプル変更）のおかしな部分を実際見てもらって 間違いの質問をしても大丈夫でしょうか？ もし、もっとふさわしいスレがあったら誘導して頂けるとありがたいです… 質問は、IEでは出るのにサファリ、火狐ではでないスクロールバーについてです 347 名前：Name_Not_Found mailto:sage [2009/01/19(月) 02:19:38 ID:???] リスト化したメニューにそれぞれ画像を張り付けているんですが、 hoverで別の画像を表示したいのですがうまくいきません。 ご教示ください。 html <div id="header"> <ul> <li><a href="#"><img src="image/home.gif" alt="ホーム" name="home" width="160" height="50" id="home" /></a></li> <li><a href="#"><img src="image/profile.gif" alt="会社概要" width="160" height="50" id="profile" /></a></li> <li><a href="#"><img src="image/service.gif" alt="提供サービス" width="160" height="50" id="service" /></a></li> <li><a href="#"><img src="image/faq.gif" alt="FAQ" name="faq" width="160" height="50" id="faq" /></a></li> <li><a href="#"><img src="image/contact.gif" alt="お問い合わせ" width="160" height="50" id="contact" /></a></li> </ul> #header ul li a#home:hover という感じでそれぞれ指定するだけではダメなのでしょうか？ 348 名前：Name_Not_Found mailto:sage [2009/01/19(月) 14:59:19 ID:???] >>347 a#homeなんかどこにも存在してないだろ 349 名前：347 mailto:sage [2009/01/19(月) 15:57:08 ID:???] これ以外にいくつか試したんですがうまくいきません。 id="home"を#homeで指定してもダメでした。 #header ul li #home:hover、#header ul li #home a:hoverも同じく・・・orz 350 名前：Name_Not_Found mailto:sage [2009/01/22(木) 09:56:37 ID:???] みんな、固定レイアウトの時ってフォントサイズどうしてる？ 可変？それとも固定？ 351 名前：Name_Not_Found mailto:sage [2009/01/24(土) 16:01:46 ID:???] 絶対値指定はしない。ここでいう絶対値指定っていうのはピクセルとかじゃなくてミリメートルとかインチとかのこと。 352 名前：Name_Not_Found mailto:sage [2009/01/25(日) 05:29:25 ID:???] ピクセルもやめとけ 353 名前：Name_Not_Found mailto:sage [2009/01/25(日) 16:09:11 ID:???] www.free-css-templates.com/ が見れなくなってるよー 354 名前：Name_Not_Found mailto:sage [2009/01/28(水) 21:08:15 ID:???] >>347 根本がおかしいだろ。なんで画像にID振ってるんだ。 javascriptの画像切り替えと混同してないか？ 普通は <ul id="Menu"> <li id="Test"><a href="#"><span>TEST</span></a></li> </ul> てな感じでタグ書いてcssは #Menu ul li a { display:block; width:200px; height:30px; } #Menu ul li span { display:none; } li#Test a:link,li#Test a:visited { background:url("test1.gif") no-repeat 0 0; } li#Test a:hover,li#Test a:active { background:url("test2.gif") no-repeat 0 0; } CSSの画像切り替えは普通背景でやる。 347みたいにデフォ画像を画像タグでやるんなら マウスオン時にデフォ画像をvisibilityで隠すなりして背景にマウスオン画像を敷く、でいけるかも。 どっちにしろ画像じゃなくliかaにid振るべき。 355 名前：Name_Not_Found mailto:sage [2009/02/10(火) 05:57:39 ID:???] ちょっと質問 <meta http-equiv="Content-Style-Type" content="text/css"> これが記入されていれば <link rel="stylesheet" href="hogehoge.css"> <style>〜</style> これでかまわない。 <link rel="stylesheet" type="text/css" href="hogehoge.css" /> <style type="text/css">〜</style> やはりこう書かないとだめだ。 さて、どっちが正しい？ 356 名前：Name_Not_Found mailto:sage [2009/02/10(火) 08:57:40 ID:???] コンテントタイプの意味を考えればわかるだろ 357 名前：Name_Not_Found mailto:sage [2009/02/10(火) 16:46:54 ID:???] imgをくくってるdivの背景画像を、imgの上に重ねることは不可能ですかね？ <div class="box"> <a href="test.html"><img src="test.gif" ></a> </div> div.box { background-image:url(test2.gif); z-index:2; } img { z-index:1; } 358 名前：Name_Not_Found mailto:sage [2009/02/16(月) 18:48:10 ID:???] >>348 divの中にある以上無理だろ。 z-indexは同階層のものに対して使う。親子関係に口は挟めない。 なんでそもそもそんな馬鹿げた事やろうとしてんだ。 divの中の画像を消してdivの背景出したいならvisibility:hiddenで消しゃいいだろ。 359 名前：Name_Not_Found mailto:sage [2009/02/18(水) 21:29:08 ID:???] 高さが可変のブロックAの中に、ブロックB、ブロックCが入っています。 こんな感じです。 <div id="A"> 　 　<div id="B">hoge</div> 　 　<div id="C">moge</div> </div> ブロックBの高さを100px、 ブロックCを残りの長さ(ブロックAの高さから100pxを引いた値)にしたい場合、 CSSではどのように指定したら良いでしょうか？ 360 名前：359 mailto:sage [2009/02/18(水) 22:35:37 ID:???] （モダンブラウザのみですが）自己解決しました。スレ汚し失礼しました。 div#A{ 　 　height:80%; } div#B{ 　 　height:100px; } div#C{ 　 　position: absolute; 　 　top: 100px; 　 　 bottom: 20%; } 361 名前：Name_Not_Found mailto:sage [2009/03/03(火) 16:15:15 ID:???] <li>や<dd>のリストをfloat:leftで横並びにするとき、 最後の属性だけfloat:noneを指定すれば、親ブロックにその分の領域が発生する （全部floatだとheightがゼロになって背景などが描画されないので） ……と期待するのだけど、Firefoxなどで表示すると、まるでclear:leftが指定されたかのように、 そのブロックが右に流し込まれずに下に落ちてしまいます。 <ul><li>hoge</li><li>hoge</li><li>hoge</li><li class="end">hoge</li></ul> li{width:100px; float:left;} li.end{float:none;} これは、ただしい描画なのでしょうか？　また、どういう解釈になるのでしょうか。 362 名前：Name_Not_Found mailto:sage [2009/03/03(火) 18:07:24 ID:???] >>361 ブロック要素はfloatしない限り基本的に横に並ぶことはない。 なのでfloat:noneを指定されれば下に落ちるのは当然のこと。 363 名前：Name_Not_Found mailto:sage [2009/03/03(火) 19:26:15 ID:???] 「リストが終わったら周り込み解除」ではなく「最後のリストだけ周り込み解除」になる。 だからそれで問題ない。 <div class="hogehoge"> <ul> <li>hoge</li><li>hoge</li><li>hoge</li><li class="end">hoge</li> </ul><span class="end"> </span> </div> .hogehoge { background:#fcc; } li {width:100px; float:left; background:#ffc; } span.end { display:block; height:1px; width:1px; overflow:hidden; clear:left; margin-top:-2px; } 364 名前：Name_Not_Found mailto:sage [2009/03/05(木) 10:47:38 ID:???] この記述は正しいの？ body{border:5px solid; border-color:#000000 #0000ff;} div{border:solid #000000; border-width:5px 3px;} 365 名前：Name_Not_Found mailto:sage [2009/03/05(木) 13:47:43 ID:???] >>364 特に間違いは見当たらないが 何が問題なんだろうか 366 名前：Name_Not_Found mailto:sage [2009/03/05(木) 16:00:44 ID:???] borderの一括設定とborder-widthを同時にやってるって点だろ。 正しいかどうかはワカラン。別に問題は無さそうだけどな。 個人的には一括設定のトコでborderのtyoeの前にwidthが来てるトコとかが気になるがw 367 名前：Name_Not_Found mailto:sage [2009/03/05(木) 17:27:04 ID:???] >>366 >borderの一括設定とborder-widthを同時にやってる 線の太さや色をtop、bottomなどで変えたいときはむしろ今回のように別に指定しなければならない >一括設定のトコでborderのtyoeの前にwidthが来てるトコとかが気になる 値さえ合っていれば、順番はどちらでも大丈夫 368 名前：367 mailto:sage [2009/03/06(金) 08:54:42 ID:???] >>366 あーごめんなさい、しなければならないはちょっと言い過ぎ ベースをborderで指定して個別に上書きというやり方も可 369 名前：Name_Not_Found [2009/06/02(火) 06:25:13 ID:7YwK8DI7] <table border="1" style="border-collapse:collapse;"> 　<tr> 　　<td style="width:10px;">aaa</td> 　　<td style="width:10px;">bbb</td> 　　<td style="width:10px;">ccc</td> 　　　・・・・ ってやると5個目のセルくらいからセルの左端の座標が1pxくらいズレ出すんだけど borderのせい？ セルの左端の座標を全部正確に10の倍数にするにはどうしたらいい？ 370 名前：Name_Not_Found mailto:sage [2009/06/03(水) 07:25:30 ID:???] 多分改行のせい 371 名前：Name_Not_Found mailto:sage [2009/06/03(水) 07:50:05 ID:???] ここは質問スレじゃないのに質問してるせい 372 名前：Name_Not_Found mailto:sage [2009/06/07(日) 01:49:07 ID:???] pタグで改行しない方法ってありますか？\ 373 名前：Name_Not_Found mailto:sage [2009/06/07(日) 03:42:34 ID:???] display:inlineか display:inline-block あまりオススメはしないが、 状況によっては使い道もあるかもな 374 名前：Name_Not_Found mailto:sage [2009/06/07(日) 09:41:21 ID:???] だからここ質問スレじゃないっつーの 375 名前：Name_Not_Found mailto:sage [2009/06/07(日) 22:31:58 ID:???] >>374!!!!!!!!!!!!!!!!!!３７４！！！！！三七四！！！！！！！！！！！！！！ なんでお前がしきってるんだよおおおお！！！ ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！ 376 名前：Name_Not_Found mailto:sage [2009/06/07(日) 23:06:25 ID:???] ﾂﾏﾝﾈ 377 名前：Name_Not_Found [2009/06/20(土) 11:44:10 ID:PTFkUzz8] id・classの使いまわしをするとMarkup Validation Serviceでしかられます。 仕方なく、id・classの名称を変えて二度書、三度書きをしています。 Markup Validation Serviceでエラーを出すことなく、効率よく書く方法が あるのでしょうか。 378 名前：377 mailto:sage [2009/06/20(土) 12:51:19 ID:???] idとclassが混ざってました。レス汚しですみません。 379 名前：Name_Not_Found mailto:sage [2009/06/20(土) 22:40:36 ID:???] それ以前にここはネタスレであって質問スレじゃない 380 名前：Name_Not_Found mailto:sage [2009/07/05(日) 06:50:53 ID:???] >>379!!!!!!!!!!!!!!!!!!３７９！！！！！三七九！！！！！！！！！！！！！！ なんでお前がしきってるんだよおおおお！！！ ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！ 381 名前：Name_Not_Found mailto:sage [2009/07/05(日) 12:49:27 ID:???] >>380 ﾂﾏﾝﾈ 382 名前：Name_Not_Found mailto:sage [2009/07/08(水) 03:52:06 ID:???] 110のランキング表作っているのですけど 10のいちが各ブラウザ安定しません 各<li>タグににパディングをいてれ調節しているのですが・・ テーブルのしかできませんか？ 383 名前：Name_Not_Found mailto:sage [2009/07/09(木) 02:14:38 ID:???] スレ違い以前に日本語でおｋ ここネタスレだから 384 名前：Name_Not_Found mailto:sage [2009/07/11(土) 02:18:16 ID:???] >>383!!!!!!!!!!!!!!!!!!３８３！！！！！三八三！！！！！！！！！！！！！！ なんでお前がしきってるんだよおおおお！！！ ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！ 385 名前：Name_Not_Found mailto:sage [2009/07/11(土) 03:02:24 ID:???] ﾂﾏﾝﾈ 386 名前：Name_Not_Found [2009/07/11(土) 05:07:29 ID:QTq+57Lo] 他人のｃｓｓ見て勉強中なんだけど、全体幅に780pxが多いのは何か理由があるのかね？ ちょっと気になったもんで 387 名前：Name_Not_Found mailto:sage [2009/07/11(土) 07:08:52 ID:???] 多いのはリキッド 388 名前：Name_Not_Found mailto:sage [2009/07/11(土) 07:42:46 ID:???] >>386 > 他人のｃｓｓ見て勉強中なんだけど、全体幅に780pxが多いのは何か理由があるのかね？ > ちょっと気になったもんで IE6の標準設定でギリギリA4縦に収まる幅が770〜780px 389 名前：Name_Not_Found mailto:sage [2009/07/11(土) 13:39:48 ID:???] >>388 そういうことだったのか！？ ありがと 390 名前：Name_Not_Found mailto:sage [2009/07/11(土) 21:01:44 ID:???] >>389 無視すんなよ 391 名前：Name_Not_Found mailto:sage [2009/07/13(月) 13:32:54 ID:???] 1024幅のモニタでお気に入り出したままで サイドバーの幅はデフォなら 横スクロール出ず全部入るのが790pxくらいまで 392 名前：NAME IS NULL mailto:sage [2009/07/14(火) 15:08:06 ID:???] 希望している動作はCSS無しで書くと、↓こんな感じの動作を希望しています。 <table border="1" cellspacing="0" cellpadding="20"><tr><td>あ</td> <td><table border="1" cellspacing="0" cellpadding="0"><tr><td>あ</td></tr></table></td> </tr></table> <table border="1" cellspacing="0" cellpadding="0"><tr><td>あ</td> <td><table border="1" cellspacing="0" cellpadding="20"><tr><td>い</td></tr></table></td> </tr></table> それで↓のようにしたのですが ■CSS .hoge { border: 1px solid black; border-spacing:0; border-collapse:collapse; } .hoge td { border: 1px solid black; padding:20px; } .hage { border: 1px solid black; border-spacing:0; border-collapse:collapse; } .hage td { border: 1px solid black; padding:0px; } ■HTML <table class="hoge"><tr><td>あ</td> <td><table class="hage"><tr><td>あ</td></tr></table></td> </tr></table> <table class="hage"><tr><td>あ</td> <td><table class="hoge"><tr><td>あ</td></tr></table></td> </tr></table> テーブルの中のテーブルのpaddingが上位のpaddingが優先されてしまうみたいなんですけど どうすれば良いのでしょうか？ 393 名前：Name_Not_Found mailto:sage [2009/07/14(火) 20:39:21 ID:???] >>392 だからここ質問スレじゃねーっての 394 名前：Name_Not_Found mailto:sage [2009/07/15(水) 20:24:35 ID:???] >>393!!!!!!!!!!!!!!!!!!３９３！！！！！三九三！！！！！！！！！！！！！！ なんでお前がしきってるんだよおおおお！！！ ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！ 395 名前：Name_Not_Found mailto:sage [2009/07/15(水) 20:36:38 ID:???] しつこい奴だな>>394 396 名前：392 mailto:sage [2009/07/16(木) 08:39:49 ID:???] 質問スレじゃなかったんですね。 他のスレに移動します。 スレ汚して、申し訳ありませんでした。 397 名前：Name_Not_Found [2009/09/15(火) 15:55:20 ID:GZqjI6jH] a { 〜 } a:hover { 〜 } のように書いて、マウスが乗ったときに色かえたりできますけど、これを <a style="〜">のように<head></head>に書かないでやることはできますか？ 398 名前：Name_Not_Found mailto:sage [2009/09/15(火) 16:35:29 ID:???] だから質問スレじゃ（ｒｙ 399 名前：Name_Not_Found mailto:sage [2009/09/15(火) 19:45:59 ID:???] >>397 .css 外部ファイル 400 名前：Name_Not_Found mailto:sage [2009/09/15(火) 22:34:23 ID:???] マルチ乙 401 名前：Name_Not_Found [2009/09/15(火) 22:57:38 ID:Eb4QiI20] www.dotup.org/uploda/www.dotup.org145707.lzh.html ↑のファイルの中の「index.html」の右側のサイドメニューの横幅をかえたいんですが、 「style.css」の /*サイド（一番右側）コンテンツ ------------------------------------------------------------------*/ #side { float: right; width: 176px; margin-left: 8px; padding: 10px; この部分のwidth: 176px;の176pxの値を大きくすると大きくはならず、 形が崩れてしまいます。 どうすればサイズ変更できるでしょうか？ 402 名前：Name_Not_Found mailto:sage [2009/09/15(火) 22:59:18 ID:???] ttp://www.nttdocomo.co.jp/ の上にあるボタンみたいに、開いたページに対応した所だけを変化させるにはどうすればいいのでしょうか？ 403 名前：Name_Not_Found [2009/09/16(水) 00:24:12 ID:oqGyqT1l] こんにちは。FireBugをカンでいじってCSS組んでいます。 fukia.6.ql.bz/ 上記のサイトを作っているんですが、IEで見てみると、下のbottomの部分がなくなってしまいます。 どうしたらよいのでしょうか？ 404 名前：Name_Not_Found mailto:sage [2009/09/16(水) 08:17:07 ID:???] ここは質問スレじゃねーっての スレも読めない奴は仕様書でも読んでろ 405 名前：Name_Not_Found [2009/09/16(水) 14:58:43 ID:3rcpibgk] >>404 どこが質問スレなんですか？ 406 名前：Name_Not_Found mailto:sage [2009/09/16(水) 15:50:29 ID:???] 「CSS」でスレ一覧を検索 407 名前：Name_Not_Found mailto:sage [2009/09/16(水) 17:24:07 ID:???] 了解しました>>403は無視してください 失礼しました 408 名前：Name_Not_Found mailto:sage [2009/09/26(土) 16:44:58 ID:???] CSSを使用してリスト内の文字の上下間隔を狭めるにはどうすれば良いでしょうか？ (上下の文字と文字の間隔を5pxや10pxと指定したいと思っています。) <ul> 　　<li>あ</li> 　　<li>い</li> 　　<li>う</li> </ul> 409 名前：Name_Not_Found mailto:sage [2009/09/26(土) 16:48:19 ID:???] >>408 ですが自己解決しました。 410 名前：Name_Not_Found mailto:sage [2009/09/27(日) 02:11:53 ID:???] 自己解決したときはちゃんと書くように ・li内部の行間を調整するのは li {line-height:xx } →単位無し整数指定が推奨 ・li同士の間隔を調整するのは li {margin-bottom:xx} li {padding-bottom:xx}　→px指定が安定だがemでもよい 411 名前：Name_Not_Found mailto:sage [2009/09/27(日) 13:46:12 ID:???] >>410 推奨も何もない 用途によって変えなきゃならないに決まってるだろ 412 名前：Name_Not_Found mailto:sage [2009/09/27(日) 22:02:23 ID:???] >>411 > 推奨も何もない > 用途によって変えなきゃならないに決まってるだろ line-heightに関しては「推奨」です line-height の値には単位なしが良いとされる理由 - lucky bag www.lucky-bag.com/archives/2006/04/unitless-line-heights.html 413 名前：Name_Not_Found mailto:sage [2009/09/27(日) 22:16:23 ID:???] 割と一般的に知られてる話だと思ってたが。＞line-heightには単位なし 行間(行の高さ)を調節するなら単位はナシで - ［ホームページ作成］All About allabout.co.jp/internet/hpcreate/closeup/CU20070222A/index.htm line-heightに関しては、用途によって変えなきゃならないケースが ほとんどないからな。pxでガチガチにデザイン決めたい場所でも font-sizeの方でpx指定してそれに無単位でline-heightしておけばいいわけで。 414 名前：Name_Not_Found mailto:sage [2009/09/27(日) 22:17:48 ID:???] >>410 >単位無し整数指定が推奨 整数？ 415 名前：Name_Not_Found mailto:sage [2009/09/27(日) 22:21:12 ID:???] 整数じゃないな　すまん 416 名前：Name_Not_Found mailto:sage [2009/09/28(月) 02:02:47 ID:???] >>412 そこの管理人が推奨してるとWeb全体に推奨なんてことはないｗ 理屈は知ってるが、知ってればこそ用途によって変えるべき 417 名前：Name_Not_Found mailto:sage [2009/09/28(月) 05:29:55 ID:???] というかその人も「行ボックスの高さが意図していないものになってしまう可能性がある」 から推奨と言ってるだけで、常に推奨とは言ってないじゃん。 逆に言えば意図があれば別のものを使うという話をしてるだけだろ、 なのにその推奨を布教されてもその管理人に迷惑なだけと思うが。 418 名前：Name_Not_Found mailto:sage [2009/09/28(月) 12:22:20 ID:???] 本人だったら問題ないんじゃね？ｗ 419 名前：Name_Not_Found mailto:sage [2009/09/28(月) 13:51:24 ID:???] お前が本人か 420 名前：Name_Not_Found mailto:sage [2009/09/28(月) 16:10:13 ID:???] 俺がガンダムだ 421 名前：Name_Not_Found mailto:sage [2009/09/28(月) 17:45:15 ID:???] そこの管理人はそこまで馬鹿じゃないだろｗ 422 名前：Name_Not_Found mailto:sage [2009/09/28(月) 20:52:52 ID:???] 知り合いかよ 423 名前：Name_Not_Found mailto:sage [2009/10/19(月) 13:40:12 ID:???] tableでカレンダーを作りたいのですが、縦(日曜・土曜)の文字に色を適用する方法で悩んでます。 www.d-spica.com/designcatalog/table/table211.html 上のページだと縦列の背景色に<col class="xxx">、<th scope="col">などとして一括設定していますが 背景色の変わりにcolor:red;などとしても文字色が変わりません。 （td全体なら文字色変更できましたが。） 上の方法だと文字色指定は無理なのでしょうか？ また別の方法があるのでしょうか？ 最悪、該当セル全てにclass指定するつもりですができればやりたくない・・・ 424 名前：Name_Not_Found mailto:age [2009/10/31(土) 14:19:34 ID:???] 良スレage 425 名前：Name_Not_Found mailto:sage [2009/11/05(木) 09:30:25 ID:???] >>423 自動で振り分けさせる。 ttp://gihyo.jp/design/serial/01/jquery-site-production/0001 それが嫌なら全部にclass書いてやるしかない。 ちなみにcolはfontまわりのスタイルはいじれない。 426 名前：光 mailto:sage [2009/11/05(木) 21:21:25 ID:???] <select>の<option>に個別に設定したスタイルシート(色変え等は)はブラウザ依存なのでしょうか？ SH903iのiﾓｰﾄﾞﾌﾙﾌﾞﾗｳｻﾞでは正常に動作したものの SH-06Aのiﾓｰﾄﾞﾌﾙﾌﾞﾗｳｻﾞでは効きません ブラウザ依存なら対象方法としてはJavaScript/onChangeで<select>ごとスタイルシートを変えるくらいしかないでしょうか？ 427 名前：Name_Not_Found [2009/11/17(火) 13:57:40 ID:ifxZIQ60] IE8, Windows7です。 下線がボックス幅を超えて描かれます。どうしてなのでしょうか？ 幅240pxのサイドメニューボックスの中に下記のmenu_leftボックスを設け、 menu_leftボックスの中に、menu_titleを入れています。 下記の定義でmenu_titleの下線(border-bottom)が、menu_title幅(200px)をはみ出して（右側に20px）描かれます。 menu-tileの幅もmenu_leftのマージン幅も200pxなのに、なぜはみ出すのでしょうか？ .menu_left { margin: 0px 20px 0px 20px; padding: 0px 0px 20px; } .menu_title { text-align:left; color:#fff; font-size:12px; font-weight:bold; background-image:url(hogehoge.com/sTitle.gif); background-position:top left; background-repeat:no-repeat; border-bottom: 1px solid #961585; /*この下線が右にはみ出す*/ margin:25px 0 0 0; padding: 6px 12px 2px 30px; height: 25px; width:200px; } 428 名前：Name_Not_Found mailto:sage [2009/11/18(水) 16:58:31 ID:???] -webkit-border-radius: 4px; -webkit-ってなんだろー 429 名前：Name_Not_Found mailto:sage [2009/11/19(木) 13:05:22 ID:???] 独自拡張のプロパティに付けるベンダ接頭辞 430 名前：Name_Not_Found [2009/11/20(金) 16:39:48 ID:mUHXNI5N] 質問です。 リンク文字にマウスを重ねた時に、背景色（ボックス形）を表示するようにしたいのですが、 背景ボックスの高さが変更できません。指定方法を教えて頂けませんでしょうか。 今のソースとスタイルシートは以下の通りです。よろしくお願いします。 （「HOGEmail」と「HOGEｕｒｌ」のところの背景色の高さです） ≪ソース≫ <ol class="ct_container"> <li><p class="ct_header"><a href="mailto:hoge1">HOGEmail</a> | <a href="hoge2.com">HOGEurl</a> |  <p class="ct_title"><a id="comment3" name="comment3"></a>タイトル</p> <div class="ct_body">内容</div> <div class="cnt_date">YYMMDD</div></li> <li>/*次のタイトル、内容等*/</li> </ol> ≪スタイルシート≫ .ct_header a , .ct_header a:visited { color:#666; text-decoration:none; line-height:28px; /*(1)ここを変えても変わらない*/ padding:0.2em 0.5em; border:1px dotted #fff; } .ct_header a:hover { color:#444; /* (2)ここにline-heightを追加して変えても変わらない*/ border: 1px solid #ccc; background:#f5f5f5; } /* (3)下記を追加して変えても変わらない li {　line-height:28px;　}*/ 431 名前：Name_Not_Found mailto:sage [2009/11/21(土) 18:21:50 ID:???] 質問です。 横一列のメニューリンクテキストを右詰めで、<ul><li>タグを使って再現したい。 ブラウザではきちんと表示されるが、DreamWeaverのデザイン表示が妙なことになる。 （5つのメニューが、途中3つで改行され2段表示。 　うち1つはテキスト自体も4文字が全て改行され縦4文字に並んでしまう。） テキストボタンでなく画像ボタンならば<li>にwidthを指定することで 回避できるのですが、テキストなのでwidth指定はしたくない。 また、納品後はクライアントが更新作業を行っていく体制を取るので DreamWeaverのデザイン表示を混乱の少ない状態に整える必要がある。 432 名前：Name_Not_Found mailto:sage [2009/11/21(土) 18:23:24 ID:???] >>431の続き これは仕方のないことなのでしょうか？ 現在は<li>タグにfloat: leftを指定して横一列に表示しています。 これをやめて<li>タグにdisplay: inline;を指定すると DreamWeaver上では改行無しで表示されるのですが、 ブラウザ上でトップマージン指定や背景画像の位置指定が効かなくなります。 何か解決策が分かりましたら教えてください。 433 名前：Name_Not_Found mailto:sage [2009/11/21(土) 18:51:49 ID:???] DWの表示が完全だという前提になってますね こういう人多いのかなあ今 434 名前：Name_Not_Found mailto:sage [2009/11/22(日) 21:08:43 ID:???] まったくだ。ローカルの1制作ソフト上での見た目なんてどうでもいい。 どうせ各ブラウザで確認するんだし、WYSIWYGの見た目なんて違って当然。 435 名前：Name_Not_Found mailto:sage [2009/11/22(日) 21:42:26 ID:???] というかDWもWebKit採用してくれればいいのになー 俺はhtmlもCSSもエディタでハンドコーダー派なんだけど DWしかわからない子たちが「○○さんのデザイン崩れます」て言ってくる IE・FF・Safari・Opera，全部検証してるっつの！ 436 名前：Name_Not_Found mailto:sage [2009/11/22(日) 21:44:22 ID:???] CS4からはプレビューはWebKit対応になってるらしいよ。 437 名前：Name_Not_Found mailto:age [2009/11/23(月) 08:03:01 ID:???] トゥギャザーしようぜ！ 438 名前：Name_Not_Found mailto:sage [2009/11/23(月) 12:21:28 ID:???] >>436 だね あんまり意味ないんだけどね IE9はまた独自仕様になりそうでこわいなあｗ IEは6789でチェックとか、もうやめて＞＜ 439 名前：Name_Not_Found [2009/11/26(木) 21:02:04 ID:FzH8K/lF] 質問スレなんだから、まじめに回答しろ！ 440 名前：Name_Not_Found [2009/12/01(火) 12:27:45 ID:Mkuhgcka] HTMLの中で以下のようなレイアウトを作ろうとしています。 This is a [pen]. 　　　　　 ↑black [pen]を基準にして「↑black」の位置を決めるにはどうすればいいですか？ positionというのを使うのかな、、と試しましたがよくわかりませんでした。 よろしくお願いします。 441 名前：Name_Not_Found mailto:sage [2009/12/06(日) 02:18:57 ID:???] >>440 .pen { position: relative; display: inline-block; } .black { position: absolute; top: 1em; left: 0; } <p>This is a <span class="pen">[pen]. <span class="black">↑black</span></span></p> 442 名前：441 mailto:sage [2009/12/06(日) 02:37:42 ID:???] って5日も前のレスだったか…もう解決してるかな 443 名前：Name_Not_Found [2009/12/08(火) 11:25:26 ID:spDDXc55] >>441 ありがとうございます。 とても助かりました。^^ 444 名前：Name_Not_Found mailto:age [2009/12/10(木) 19:10:32 ID:???] もうすぐ三周年　トゥギャザー 445 名前：Name_Not_Found mailto:sage [2009/12/26(土) 01:26:25 ID:???] jsだとオライリーのサイ本がバイブルっぽいですが、CSSでそういった書籍ってありますか？ もちろん一冊で完結する訳はないんですが、皆さんどんな本で勉強されたのかなと。 446 名前：Name_Not_Found [2010/01/11(月) 02:32:45 ID:QmXP9yD9] CSSで、この画像のような構造のサイトを作りたいと考えています。 ttp://imagepot.net/view/126314455414.jpg 今このようなCSSを組んでいるのですが、実際には以下の画像のような表示になってしまいます。 imagepot.net/view/126314476261.jpg div#content { position: relative; width: 900px; margin-left : auto; margin-right : auto; top: 40px; text-align: left; bottom: 40px min-height: 90%; height: auto !important; height: 90%; } div.nakami { background:#fff1c3; border:solid 10px #c96c29; overflow:scroll; padding:30px; position: absolute; bottom: 71px; left: 0px; top: 72px; right: 0px; z-index: 11; } <続きます> 447 名前：446 [2010/01/11(月) 02:34:08 ID:QmXP9yD9] <続きです> div.copyright { display: block; position: absolute; bottom: 0px; left: 0px; right: 0px; background-image: url(images/copyright_2010.png); background-repeat: no-repeat; background-position: right bottom; } 検索しているのですが、どうしてもわかりません。 どなたか、何が悪いか、御指南ください。お願いします。 それから、position="relative"にしておくと、margin-bottomは適用されないのでしょうか？ 448 名前：Name_Not_Found mailto:sage [2010/01/11(月) 02:46:17 ID:???] >>447 cssに html,body { height: 100%; } を書いてなさそう？ 449 名前：446 mailto:sage [2010/01/11(月) 05:20:52 ID:???] >>448 レスありがとうございます！ 今急いで追加してみたんですが、変化なしでした。 どこか他におかしい所はないでしょうか？ 450 名前：446 mailto:sage [2010/01/11(月) 05:32:46 ID:???] HTMLの方はこうなっています。 <div id="content"> <div id="menucontainer"> メニュー </div> <div class="nakami"> テストテスト </div> <div class="copyright"> </div> </div> 451 名前：Name_Not_Found mailto:sage [2010/01/11(月) 11:41:54 ID:???] >>450 >>446-448と>>450コピペしてやってみたけど、div.copyrightを下に固定？することは出来たよ 452 名前：446 mailto:sage [2010/01/12(火) 00:30:03 ID:???] できました！ ありがとうございました。 453 名前：Name_Not_Found mailto:sage [2010/01/12(火) 12:50:53 ID:???] ここはネタスレであって質問スレは別にあるだろボケ 454 名前：Name_Not_Found mailto:sage [2010/01/16(土) 12:03:39 ID:???] 定期的に書いておかないと駄目か ここは質問スレじゃないぞ 455 名前：Name_Not_Found [2010/03/19(金) 15:28:56 ID:uF0/sJns] Adobe Spryのアコーディオンで、 クリックするとSarariで青い枠線が出ます。 Abobeのサイトのサンプルでも出るもの、出ないものがあります。 この違いは何なのでしょうか？ また消すためには、どう指定すれば良いのでしょうか。 お教えください。 ttp://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample.html 456 名前：Name_Not_Found mailto:sage [2010/03/30(火) 12:19:19 ID:???] a:link { color: white; } a:visited { color: white; } a:hover { color: red; } いくら指定してもブルーのまま。 試しに<head>内をいろい消しても変わらず・・・ ドキュメント宣言とか文字コードとかも関係アルのかな？？ 457 名前：Name_Not_Found mailto:sage [2010/03/30(火) 12:20:21 ID:???] 検証もしてないし根拠もないがoutlineとかは？ 458 名前：Name_Not_Found mailto:sage [2010/03/30(火) 13:12:11 ID:???] >>457 outlineはどこも設定してません・・ 全てを消して a:link { color: red; } 未訪問リンク a:visited { color: red; } 訪問済みリンク a:hover { color: blue; } マウスカーソルを乗せたリンク 書いてみたけどマウス載せても色が変わらない・・ 459 名前：Name_Not_Found mailto:sage [2010/03/30(火) 14:15:46 ID:???] a:hover { color: red; } <body link="white" vlink="white" alink="white" > <a href=" ">リンク</a> 結局これで解決・・・なんでできないんだろう。。 460 名前：Name_Not_Found mailto:sage [2010/03/30(火) 14:54:55 ID:???] >>457は>>455へのレスなんだけど、 クリックしたとき出る枠線ってのはoutline:noneで消せたはず、と思って。 >>456は>>455ではないよな？ CSSだけだされても誰もわからんと思うよ。 461 名前：Name_Not_Found mailto:sage [2010/04/02(金) 09:06:49 ID:???] だからここはネタスレだと何度

---

---

[ 新着レスの取得/表示 (agate) ] / [ 携帯版 ]

read.cgi ver5.27 [feat.BBS2 +1.6] / e.0.2 (02/09/03) / eucaly.net products.
担当:undef