/* CSS・スタイルシート質問スレッド【22】 */
/* CSS・スタイルシート質問スレッド【22】 */
- 1 名前:Name_Not_Found :03/08/14 22:57 ID:???
- CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
■■■■■ 質問のしかた ■■■■■
・基礎は解説サイト(>>4・かなりわかりやすい)で勉強してください。
・質問の前に【FAQ】(>>5-7)を参照して、既出の再掲を避けてください。
・【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。
WinIEの場合は、[Ctrl+F]で検索できます。
・ブラウザによって対応していないプロパティーやバグがありますので、
【解説など】(>>4)の対応表や「CSSバグリスト」に目を通しておきませう。
・土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
正当(valid)なHTMLを心がけてください。
初心者の疑問は大抵ここまでで解決します。
・OSやブラウザの種類とヴァージョンについては必ず明記してください。
特にNetscapeは、ver.4までと6以降でまったく別物です。
・「環境を書け」とか「ソースは?」と求められたら応じませう。
回答が早く得られます。説明不足な質問文で解決を期待されても困ります。
・間違った用語は混乱を招きます、用語の確認をしてから質問してください。
過去スレや関連リンクは>>2-10
【過去ログ】>>2
【関連スレ】【仕様書】【CSS検証】>>3
【解説など】>>4
【FAQ】>>5-7
cf. http://web2ch.s31.xrea.com:8080/index.php?CSSFAQ
http://nira.s25.xrea.com/FAQCSS/ls_00.html
- 2 名前:Name_Not_Found :03/08/14 22:57 ID:???
- 【過去ログ】
http://mentai.2ch.net/hp/kako/974/974934062.html
http://natto.2ch.net/hp/kako/984/984113434.html
http://natto.2ch.net/hp/kako/992/992992981.html
http://pc.2ch.net/hp/kako/996/996828258.html
http://pc.2ch.net/hp/kako/1005/10050/1005047493.html
http://pc.2ch.net/hp/kako/1011/10113/1011358982.html
http://pc.2ch.net/hp/kako/1015/10154/1015474859.html
http://pc.2ch.net/hp/kako/1019/10198/1019881572.html
http://pc3.2ch.net/hp/kako/1025/10253/1025346520.html
http://pc3.2ch.net/hp/kako/1028/10286/1028646616.html
http://pc3.2ch.net/hp/kako/1031/10317/1031773943.html
http://pc3.2ch.net/hp/kako/1034/10349/1034922586.html
http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html
http://pc2.2ch.net/hp/kako/1041/10416/1041641395.html
http://pc2.2ch.net/hp/kako/1045/10451/1045124732.html
http://pc2.2ch.net/hp/kako/1047/10471/1047154499.html
http://pc2.2ch.net/hp/kako/1048/10487/1048775997.html
http://pc2.2ch.net/hp/kako/1050/10500/1050086156.html
http://pc2.2ch.net/test/read.cgi/hp/1053619342/l50
http://pc2.2ch.net/test/read.cgi/hp/1055536413/l50
【前スレッド】
http://pc2.2ch.net/test/read.cgi/hp/1057860130/l50
- 3 名前:Name_Not_Found :03/08/14 22:58 ID:???
- 【関連スレッド】
・CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
・* CSS[適用="2ch"]{ イケてるスタイルを:"作れ"}
http://pc2.2ch.net/test/read.cgi/hp/1038678267/l50
・代替スタイルシートに萌え〜
http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50
・CSSでイケてるデザインサイト 15
http://pc2.2ch.net/test/read.cgi/hp/1056190919/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.csce.kyushu-u.ac.jp/man/rec-css1/rec-css1.html
・CSS2の仕様書の邦訳(日本規格協会訳/個人訳)
http://www.y-adagio.com/public/standards/tr_css2/toc.html
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html
【CSS検証】
・W3C CSS 検証サービス
http://jigsaw.w3.org/css-validator/
- 4 名前:Name_Not_Found :03/08/14 22:59 ID:???
- 【解説など】
・ごく簡単なHTMLの説明
http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
http://www.zspc.com/stylesheets/
・K@tsukun's PAGE! > CSS Reference
http://hp.vector.co.jp/authors/VA022006/css/index.html
・とほほのスタイルシート入門
http://tohoho.wakusei.ne.jp/wwwcss.htm
・ばけらの CSS リファレンス
http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・Academic HTML::CSS2
http://www.tg.rim.or.jp/~hexane/ach/
・『スタイルシートWebデザイン』ボランティアHTML化版。
http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
・ZSPC - CSS2対応状況ガイド
http://www.zspc.com/documents/css2/
・CSS対応状況表
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS1テストスイート http://www.doraneko.org/css1test/
・ブラウザのHTML4/CSS対応度テスト
http://homepage1.nifty.com/emk/moz/browsertest.html
・CSS Laboratory対応表・一覧
http://is.vis.ne.jp/charts/index.xhtml
・CSSバグリスト@CSSバグ辞典スレッド
http://cssbug.tripod.co.jp/index.html
・Web標準普及プロジェクト (特に「HTML/CSSのよくある誤解・ミス」)
http://www.mozilla.gr.jp/standards/index.html
・ブラウザによる振り分け (JavaScriptを使用しない方法)
http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
・( ´∀`)< CSS でイケてるデザインサイトリンク集2
http://www.geocities.co.jp/SiliconValley-SantaClara/1308/
- 5 名前:Name_Not_Found :03/08/14 23:00 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: text-align:center;を指定しても Netscape6(or7)ではtableなどブロック要素がセンタリングできません。IEでは中央寄せになるのに……
A2: IEの実装の誤りです。詳しくは下記(特に4.)をご覧ください。
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.ブロックレベル要素をセンタリングする方法
http://www.mozilla.gr.jp/standards/webtips0004.html
- 6 名前:Name_Not_Found :03/08/14 23:01 ID:???
- 【FAQ】
Q3: CSSで擬似フレームってどうやるの?
A3: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
http://alt.s31.xrea.com/overflow.html
http://alt.s31.xrea.com/files/frame.html
overflowを用いた擬似フレーム
http://www.fromdfj.net/html/overflow.html
Q4: CSSで段組するには?
A4: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラム・デザインを実現する方法
http://www.motchie.com/article/multicolumn.html
tableを使はない段組:CSSによるマルチカラムデザインについての考察
http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
http://members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html
スタイルシートでマルチカラムデザインの実現
http://shiten.s9.xrea.com/etc/stylesheet/multi_column.htm
段組れいあうとてすと (floatによる段組の例)
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
なかよしぱれっと (ネスケ4でも崩れない段組みの実例)
http://village.infoweb.ne.jp/~fores/
- 7 名前:Name_Not_Found :03/08/14 23:05 ID:???
- 【FAQ】
Q5: なんかフロートの表示が崩れるみたいなんですけど?
A5: floatさせる要素にはwidth指定が必須(img要素以外)。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
http://cssbug.tripod.co.jp/detail/winie/b079.html
http://pc2.2ch.net/test/read.cgi/hp/991666454/683n
Q6:画面中央に配置するにはどうすれば?
A6:左右(水平方向)のセンタリングはA2に既出。垂直には色々な方法があります。
「スタイルシート 縦中央(垂直中央)」参照のこと。
http://www.parkcity.ne.jp/~chaichan/qanda/qa3558.htm
Q7:背景画像を二つ指定するにはどうするか。
A7:background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。
Q8.いままでHTMLでやってた××をCSSでやるにはどうすればいい?
A8.下記に書いてあります。テーブル・レイアウトは段組のFAQ(A4・>>6)をご覧あれ。
「いままでの 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
- 8 名前:Name_Not_Found :03/08/14 23:13 ID:???
- >>1
乙華麗
- 9 名前:hegth :03/08/15 00:19 ID:???
- 【hegth】
456 名前:Name_Not_Found sage 投稿日:03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 10 名前:Name_Not_Found :03/08/15 00:22 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 11 名前:初心者 :03/08/15 01:44 ID:???
- hegthって、なんですかぁ〜〜〜〜〜〜?
- 12 名前:Name_Not_Found :03/08/15 01:54 ID:???
- ヘグスっ
- 13 名前:Name_Not_Found :03/08/15 11:07 ID:???
- >>9-12
面白いか?
- 14 名前:Name_Not_Found :03/08/15 11:08 ID:???
- もう秋田
- 15 名前:Name_Not_Found :03/08/15 11:12 ID:H9b++bZj
- もう強制IDにしてくれ
- 16 名前:Name_Not_Found :03/08/15 11:29 ID:???
- hegthとか書いている奴は、アホですね。
- 17 名前:Name_Not_Found :03/08/15 11:35 ID:???
- >>16 まったくだ。>>9-10のことだろ?
- 18 名前:Name_Not_Found :03/08/15 11:41 ID:???
- 違います。
456 名前:Name_Not_Found sage 投稿日:03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
この456のことです。
- 19 名前:Name_Not_Found :03/08/15 11:59 ID:???
- 粘着うざっ。前スレのネタいつまでも引きずるなよ。
- 20 名前:Name_Not_Found :03/08/15 12:03 ID:???
- 18は、アホですね。
- 21 名前:Name_Not_Found :03/08/15 12:22 ID:???
- >>13>-15>>17>>19-20
いちいちレスしてるお前らも同罪。
- 22 名前:Name_Not_Found :03/08/15 12:26 ID:???
- それはさておき・・・
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 23 名前:Name_Not_Found :03/08/15 12:55 ID:???
- つまらん。
質問をどうぞ。
- 24 名前:山崎 渉 :03/08/15 15:16 ID:???
- (⌒V⌒)
│ ^ ^ │<これからも僕を応援して下さいね(^^)。
⊂| |つ
(_)(_) 山崎パン
- 25 名前:Name_Not_Found :03/08/15 22:03 ID:???
- くだらん。
ハイ次の方、ご質問は?
- 26 名前:Name_Not_Found :03/08/15 22:59 ID:???
- 質問も来ないし・・・
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 27 名前:Name_Not_Found :03/08/15 23:02 ID:???
- 馬鹿はおまへだ。>>26
- 28 名前:Name_Not_Found :03/08/15 23:06 ID:???
- hegthだもんな がははははははははははははははははははは
- 29 名前:Name_Not_Found :03/08/15 23:10 ID:???
- つまらんよ。一人で笑って、楽しいか?
- 30 名前:Name_Not_Found :03/08/16 00:20 ID:???
- >>29
楽しいからやってるんだろ。ほっといてあげなさい。
- 31 名前:Name_Not_Found :03/08/16 00:37 ID:???
- 誤字以外にツッコミたくてもツッコメないんだろ
- 32 名前:Name_Not_Found :03/08/16 06:50 ID:???
- 質問なのですが、今XHTMLとCSSでHPを作ってるんですね、そして
W3CのエラーチェックするとXHTMLの方はValid(正式な)XHTMLで書かれている
と出るのですが、cssの方のチェックがどうしても引っかかります。
原因が、外部cssファイルなんです。
どうも<link rel="stylesheet"type="text/css"href="top.css"/>らしい
のですが、最初<省略〜top.css">で閉じていたらどうも<link>に対する
</>が無いみたいなエラーが出て、色々サイトを見ているとどうも
<〜"top.css"/>で皆さん閉じているようなのでやってみてらXHTMLは通る
ようになりましたがcssではずっとエラーが出ます。
どうすればエラーが出なくなるかお解りの方いらっしゃいましたら教えて
いただけませんか?
- 33 名前:あぼーん :あぼーん
- あぼーん
- 34 名前:Name_Not_Found :03/08/16 07:26 ID:???
- cssで<img src="hogehoge.gif">などした時他様のサイトを見ていると
<img src="img/hogehoge.gif">などとなっていることが多いのですが、
私がやるとその画像が表示されません。
どうなっているのしょうか?
- 35 名前:>>2ちゃんねらーの皆さん :03/08/16 07:27 ID:???
- 2ちゃんねらーなどの間で、人気のある御尊像が有ります。
これらの御尊像を手に入れて、金運向上等を祈願しましょう。(爆)
http://www.butsuzou.com/jiten/sanmen.html
http://www.butsuzou.com/list1/sanmen2.html
http://www.butsuzou.com/list1/sanmen3.html
http://www.butsuzou.com/keitai/sanmen-kz.html
- 36 名前:Name_Not_Found :03/08/16 10:32 ID:???
- >>32
cssでエラーが出てるのに「<〜"top.css"/>で皆さん閉じているようなのでやってみてら」とxhtmlファイルを修正しようとしてるのがおかしいと思うんだけど。
cssのエラーはなんて出てる?
- 37 名前:Name_Not_Found :03/08/16 13:48 ID:???
- >>34
質問のご趣旨がわかりません。
- 38 名前:Name_Not_Found :03/08/16 14:54 ID:???
- >>34
37と同じく趣旨がわかりません
(以下仮説)
34はcssのあるディレクトリに画像を入れているから
<img src="hogehoge.gif">としている。
そして他サイトで<img src="img/hogehoge.gif">という表記を見たので、
自分も同じようにcssを書き換えたら、表示されなくなった?
他サイトはcssのあるディレクトリの中にimgという名前のディレクトリを作って
そこに画像を置いて呼び出しているんだと思うんですが。
34はimgというディレクトリを、要素かなんかと勘違いしているのではないかと。
- 39 名前:Name_Not_Found :03/08/16 15:34 ID:???
- >>34は説明下手の初心者って事で暖かく見守っててやれ
- 40 名前:Name_Not_Found :03/08/16 16:43 ID:???
- 一番下と一番上のboxのサイズを固定して残りの領域は
真ん中のBOXが占めるスクロールバーなしのレイアウトを作りたいのですが
macNN7だと正しく表示されるけどIE5だと表示されなかったり
スクロールバーのバグが出てしまったりします。
またwindowsではposition:fixedが使えないこともあるので
いっそのことテーブルにしてしまうほうがいいでしょうか?
macOS9で作業してます。何か他にいい方法はありますか?
- 41 名前:Name_Not_Found :03/08/16 18:00 ID:???
- >>40
サイズを固定しても縦横がある。
意味がまったくわかんない
- 42 名前:Name_Not_Found :03/08/16 18:25 ID:IoFHYEwz
- 質問です
スクロールバーの色の変更なんですが
scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #808080;
↑のように記述するとアローだけグレーになると思うんですが
全て真っ白になってしまいます。
アローのみ別の色にしようとするとダメみたいなんですが
原因の方を教えて下さいませ。よろしくお願いしまつ
- 43 名前:Name_Not_Found :03/08/16 18:30 ID:???
- >>42
しまつでつか。スクロールバーの色を変えるのは厨房でつよ
- 44 名前:Name_Not_Found :03/08/16 18:31 ID:???
- >>42
画面がスクロールするほど内容あるの?
- 45 名前:Name_Not_Found :03/08/16 18:37 ID:???
- このスレの人達には答えられない質問をしてしまった
みたいですね。もうちょっとレベルの高い人達に聞く事にします
難しい質問してしまってすみませんでした
- 46 名前:Name_Not_Found :03/08/16 18:38 ID:???
- >>45
ばい。バイバイ。
- 47 名前:Name_Not_Found :03/08/16 18:48 ID:???
- >>45
質問する時間帯間違ってるから、みんな答えないんだよ
ホラこの時間帯の奴らは(ry
- 48 名前:Name_Not_Found :03/08/16 18:53 ID:???
- すいません原因が分かりました
どりきゃすで見てました
- 49 名前:40 :03/08/16 19:03 ID:vHORZRMH
- >>41
やりたいことはこれの応用型のようなもので、
できるだけスクロールバーの出ないようにしたいと思っています。
<!--
body{ margin: 0 }
div{font-weight: bold;position: fixed}
#slider{ top: 0;right: auto;bottom:100px;left: 0;width: 200px;height: auto;background-color: #ff99ff}
#main{top: 0;right: 0;bottom: 100px;left: 200px;width: auto;height: auto;background-color: #ff9933}
#footer{top: auto;right: 0;bottom: 0;left: 0;width:100%;height:100px;background-color: #ffff00}
-->
これはCSS辞典という本にのってた配置なのですがIEでは全然表示されず
他の方法を試してみたりしたのですが
macNN、macIE、winいずれかの状況で崩れてしまうので
テーブルにするしかないのか?という疑問だったのです。
意味不明の説明ですいません。。
- 50 名前:Name_Not_Found :03/08/16 19:06 ID:???
- >>49
>意味不明の説明ですいません。。
適当に説明したのかよ!
きちんと説明しておくれ。
- 51 名前:49 :03/08/16 19:19 ID:vHORZRMH
- すいません。簡潔にわかりやすく説明するようにがんばってるんですけど
全然通じてないですねすいません(;´Д`)説明不足を追加します。
>>49のcssに以下のhtmlがつきます。
<body>
<div id="slider">slider</div>
<div id="main">main</div>
<div id="footer">footer</div>
</body>
これってwinでもmacIEでも表示できないですよね?
他の方法でこういうのはどう実現すればいいでしょうか?
やっぱりテーブルなのでしょうか?
- 52 名前:あぼーん :あぼーん
- あぼーん
- 53 名前:>>2ちゃんねらーの皆さん :03/08/16 19:25 ID:???
- ( ´Д`)/< 先生!!こんなのを見つけました。
http://www.hokekyoji.com/
http://www.yakuyoke.or.jp/
http://members.tripod.co.jp/hossyoji/index/
http://www.maap.com/tanjoh-ji/
http://www.honmonji.or.jp/
http://www.maap.com/tanjoh-ji/
http://www.kuonji.jp/
http://www.butsuzou.com/jiten/sanmen.html
http://www.butsuzou.com/list1/sanmen2.html
http://www.butsuzou.com/list1/sanmen3.html
http://www.butsuzou.com/keitai/sanmen-kz.html
- 54 名前:Name_Not_Found :03/08/16 19:26 ID:???
- IEはposition: fixed使えない。
- 55 名前:Name_Not_Found :03/08/16 19:32 ID:???
- IEってホント糞だよね
- 56 名前:Name_Not_Found :03/08/16 19:43 ID:???
- あくまでIEは「普通」であり「標準」。
IEに無い機能を持っているブラウザの方が異端。
- 57 名前:Name_Not_Found :03/08/16 19:44 ID:???
- 太公望がやってきました
- 58 名前:Name_Not_Found :03/08/16 19:45 ID:???
- >>56
対義語じゃない。
- 59 名前:Name_Not_Found :03/08/16 19:52 ID:???
- >>56
「普通」だとは思うが「標準」じゃないと思う
- 60 名前:Name_Not_Found :03/08/16 19:59 ID:???
- >>59
ディファクトスタンダードだよ。
- 61 名前:Name_Not_Found :03/08/16 20:03 ID:???
- CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
- 62 名前:Name_Not_Found :03/08/16 22:25 ID:???
- >>36 レスありがとうございまいた。すいません遅れましたが、
Target: http://www.○○○.com/index.html
Please, validate your XML document first!
Line 7
Column 23
Element type "link" must be followed by either attribute specifications, ">" or "/>".
ってゆうエラーがずっと出ます。これってようは<link>に対して</link>
が無いですよみたいなエラーですよね~?
でもこの場合<link>に閉じる</>は必要ないですよね〜
どうすればよいのでしょうか?
- 63 名前:Name_Not_Found :03/08/16 22:28 ID:???
- 上の追記ですが、
一応 <link rel="stylesheet"type="text/css"href="top.css"title="top" />
こうゆう記述をしております。
私のHPのエラーの出る7行目です。
- 64 名前:昔の人 :03/08/16 22:29 ID:???
- >>49 >>54
position:fixed;に對應してないWinIEのために
overflowプロパティーを應用した疑似フレームが編み出されてるんですよ。
FAQのA3(>>6)を見たまへ。
- 65 名前:Name_Not_Found :03/08/16 22:31 ID:???
- >>63
誤>="stylesheet"type
正>="stylesheet" type
以下同様。
- 66 名前:Name_Not_Found :03/08/16 22:39 ID:???
- 昔の IE って、TD/TH が親要素のスタイル (font-size とか) を
継承しなかったよね。
どのバージョンから変わったの?
- 67 名前:Name_Not_Found :03/08/16 22:44 ID:???
- >>66 バグ辞典を引け。
http://members.tripod.co.jp/cssbug/detail/winie/b023.html
今でも互換モードでは継承しない。Mozilla5.0系互換モードやOperaでも。
あと、px単位でなければ大丈夫。サイズ固定やめろ。
- 68 名前:Name_Not_Found :03/08/16 23:11 ID:???
- ほへー
- 69 名前:Name_Not_Found :03/08/16 23:26 ID:???
- >>65 解決いたしました。ありがとうございました。
記述にスペースが入って無いだけでエラーってでるんですね〜。
大変勉強になりました。ありがとうございました。
ところで思ったのですが、みなさんどこまでW3Cのチェックって行っていますか?
以外に厳しいですよね〜?これって完璧になるまでやるべきなのでしょうか?
- 70 名前:Name_Not_Found :03/08/16 23:40 ID:???
- あげます
- 71 名前:Name_Not_Found :03/08/17 00:01 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 72 名前:あぼーん :あぼーん
- あぼーん
- 73 名前:Name_Not_Found :03/08/17 00:30 ID:???
- すいません質問です。
http://cgi.2chan.net/up/src/f15654.jpg
のように赤い部分が二つの左上と右下にあらわれるには
どんなソースをくめばいいでしょうか。
右下は
<!--
BODY{
background-image:url(*****.jpeg);
background-repeat : no-repeat;
background-attachment : fixed;background-position : 100% 100%;
}
--!>
でまず一つ現れますが、
二つ目の左上もふたつ、表示させるCSSはないでしょうか。
教えてください
- 74 名前:Name_Not_Found :03/08/17 00:33 ID:???
- div.hoge{
width: 620px;
margin-left: auto;
margin-right: auto;
}
こんな感じで書くと、NN7.1、Opera7.11では
ウィンドウの真ん中に表示されますが
IE6だと左詰めになります
IEでも常に真ん中に表示させるようにするには
どうすればいいでしょうか?
- 75 名前:Name_Not_Found :03/08/17 00:42 ID:???
- >>73
>>7
>background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。
>>74
標準準拠モードにする。詳しくは>>5
- 76 名前:Name_Not_Found :03/08/17 00:43 ID:???
- >>74 FAQなので>>5-7を読め。
- 77 名前:73 :03/08/17 00:50 ID:???
- >>75
はげしくがいしゅつだったのですね
ありがとうございました。
- 78 名前:74 :03/08/17 01:13 ID:???
- >>75-76
申し訳ない
FAQ見て勉強します
ありがとうございました
- 79 名前:Name_Not_Found :03/08/17 04:26 ID:YMREjYsm
- http://www.muji.co.jp/
↑のように、左側にメニューをウインドウの上から下まで並べたいと思っています。
同様のデザインのサイトをいくつか見たのですが、全てTABLEを使っていました。
TABLEを使うと描画速度が遅くなると聞いたので画像やリンクつきの画像を<BR>
で改行して縦に並べ、下詰にしたい画像はスタイルシートのpositionで配置して
上詰と下詰の画像の間は、画像全てをDIVで1まとまりにしてそのbackground-color
を設定してやることで解決しようと思ったのですが、ウインドウの縦方向のサイズを
小さくした場合、下詰の画像が、上詰の画像に重なって表示されてしまうことがあります。
いい解決方法はないでしょうか?
下記のようなHTML・cssを書きました。
▼HTML
<DIV CLASS="menu">
<IMG SRC="img/logo.gif" ALT="LOGO" WIDTH="160" HEIGHT="160" BORDER="0"><BR>
<A HREF="index.html"><IMG SRC="img/home.gif" ALT="ホーム" WIDTH="160" HEIGHT="24" BORDER="0"></A><BR>
(中略:上のようなリンクがいくつか)
<IMG style="position:absolute;bottom:48px" SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
</DIV>
▼css
DIV.menu{
color:#FFFFFF;background-color:#000000;float: left;WIDTH:160px;HEIGHT:100%
}
とりあえずまだ、IE6でしかチェックはしていません。
- 80 名前:Name_Not_Found :03/08/17 04:30 ID:nzE7qAN6
- 男優さんのチンチンにまたがりガンガンと腰を振る少女。
挿入部のアップは見応え十分ですよ。
締まりのよさそうなオマンコが男性自身をくわえ込み,
ギュウギュウ締め付けている感じが映像からも伝わってきます。
セーラー服美少女のお宝映像を無料でどうぞ。
http://www.pinkschool.com/
- 81 名前:Name_Not_Found :03/08/17 06:17 ID:???
- プルダウンメニューの
┌─────┬─┐
| h.ogehoge | ▼. |
└─────┴─┘
↑ここの部分を画像にする、
あるいは色を変えるというのは
CSSではできないのでしょうか。
- 82 名前:あぼーん :あぼーん
- あぼーん
- 83 名前:Name_Not_Found :03/08/17 10:13 ID:dbtke82+
- display: none;とvisibility: hidden;の違いがわかりません。
IE5ではどちらも指定した部分が非表示になるのですが。
- 84 名前:Name_Not_Found :03/08/17 10:38 ID:???
- >>83
仕様書見て。
- 85 名前:Name_Not_Found :03/08/17 10:43 ID:???
- >>79
http://www.muji.co.jp/ は「上から下まで並べ」てなんかないぞ。
単に上から下に列べてるだけ。当然、ウィンドウ・サイズを大きくすれば下は空く。
世の中には樣々な窓サイズで見る閲覧者がある。height:100%;の実数値もも樣々だ。
その辺、考慮してね。
メニューの一番下にだけ画像を配置するのは、background-positionでもできる。
>>81
できません。
cf. http://cssbug.tripod.co.jp/detail/winie/b112.html
>>83
高さと幅のある要素に対して指定して試してごらん。差が出るよ。
- 86 名前:Name_Not_Found :03/08/17 10:49 ID:???
- >>85
「見えない」と「ない」の違いですね。
- 87 名前:Name_Not_Found :03/08/17 10:58 ID:???
- html 要素の style 属性は無意味と言うか、そんなものは無いから外せ。
バグ辞典スレにも "html 要素の高さ" なんて言ってる馬鹿がいるけど、
実際に CSS が適用されるのは body 要素とそれに含まれるものだけ。
( ´,_ゝ`)
- 88 名前:Name_Not_Found :03/08/17 11:03 ID:???
- >>87
ハア?
- 89 名前:Name_Not_Found :03/08/17 11:37 ID:???
- >>49
そもそも、ブロック要素自体の基本的な概念を理解する。
position: fixed は固定することだが、この例では通常の配置関係と
同じようなこと、又、使用の仕方が間違い。
- 90 名前:Name_Not_Found :03/08/17 12:25 ID:???
- html 要素に高さって無かったんだぁ。。。勉強になるなぁ
- 91 名前:Name_Not_Found :03/08/17 13:08 ID:???
- >>90 阿呆を相手にしてはいけません。
- 92 名前:Name_Not_Found :03/08/17 13:17 ID:???
- <DIV CLASS="*"><H2>
<P>あああああ</P>
</H2></DIV>
こういうのって文法的におかしいですか?
- 93 名前:Name_Not_Found :03/08/17 13:19 ID:???
- html要素に高さって無かっt(ry
>>92
下手なネタですね。
なんで見出しの中に段落があるんですか。
- 94 名前:Name_Not_Found :03/08/17 13:21 ID:???
- どう考えてもhn下にpはおかしいだろ
- 95 名前:Name_Not_Found :03/08/17 13:38 ID:???
- >>92 そもそもHTMLのことはスレ違ひ。
- 96 名前:393 :03/08/17 13:52 ID:???
- >>85
>height:100%;の実数値
意味不明。実数値とは少数点を含む数値のこと。
算出値(Computed values)だったら意味が通る。
もしくは、算出値の近似値である実効値(Actual values)。
- 97 名前:96 :03/08/17 13:58 ID:???
- ↑レス番号リセットするの忘れた。鬱だ氏のう…
- 98 名前:Name_Not_Found :03/08/17 15:07 ID:???
- 79>>85
「上から下まで」と書いたのはメニューのボタンがという意味ではなくて
メニューがウインドウの上下を途中で途切れたりすること無くという意味です。
で、ご指摘の通り、窓のサイズを小さく表示される方もいるので、上手く表示
する方法が知りたかったのです。
>>79にも書きましたが、>>79だと窓の上下のサイズを小さくした場合、
下詰にした画像が、上から順に並べた画像にかぶることがあります。
それではもちろんよくないのでいい方法を教えて欲しいのです。
background-position試してみましたが上手くいかないようでした。
- 99 名前:Name_Not_Found :03/08/17 16:04 ID:???
- >>98
>background-position試してみましたが上手くいかないようでした。
それではわかりません。どう試してどう駄目だったのか、書くこと。
>メニューがウインドウの上下を途中で途切れたりすること無く
左メニュー部はbodyの地色を生かせば? そして右のメインはdivをかぶせる、と。
- 100 名前:Name_Not_Found :03/08/17 16:17 ID:???
- >>79
body {background-color:#e6c691;}
div.contents { float:left; width:30%; margin-top:0; background-color:transparent;}
div.honbun { margin-left: 31%; background-color:#fff;} /*↑の横幅が30%ゆえに */
div.footer { clear: left; }
<body>
<div class="content">
メニュー
</div>
<div class="honbun">
<p>本文</p><p>本文</p><p>本文</p><p>本文</p>……
</div>
<div class="footer">footer</div>
- 101 名前:Name_Not_Found :03/08/17 16:41 ID:???
- >>99
>>79の
<IMG style="position:absolute;bottom:48px" SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
の部分を
<IMG style="background-position;bottom" SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
にしても上手くいきませんでした。(アキの大きさは画像で調整するつもりでした。)
また、背景としてこの部分の画像を入れてしまうと、窓の上下巾が小さくなったとき
メニューボタンなどの画像が上にかぶってくることになると思います。(たぶん)
>メニューがウインドウの上下を途中で途切れたりすること無く
については>>85さんによく伝わってなかったようなので補足したのですが
>>79でも書いてるように、
>画像全てをDIVで1まとまりにしてそのbackground-colorを設定してやることで解決しようと思ったのですが
>DIV.menu{background-color:#000000;}
で上手くいってるつもりです。(メインとメニューが逆ですが)
- 102 名前:Name_Not_Found :03/08/17 16:47 ID:???
- 79>>100
その場合だと、メニュー・本文部分がともに小さい場合、footer部分が下詰に
ならないと思うのですが、間違ってたらすみません。
それと、無印のサイトを参考に出したので、申し訳ないのですが、
レオアウトとしては↓のようにしたいと思っています。(本文の長さにもよりますが)
メニュー|本文
メニュー|本文
メニュー|本文
メニュー|本文
ア キ|本文
ア キ|本文
下詰画像|本文
- 103 名前:Name_Not_Found :03/08/17 17:19 ID:???
- >>101
><IMG style="background-position;bottom" SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
……思った以上にひどい。初心者とは思ったがここまでとは。
background-position;について勉強してから出直してらっしゃい。
http://msugai.fc2web.com/web/CSS/back.html
>>102
いいから試してごらん。もちろん、本文は充分な高さになるだけの量でね。
- 104 名前:Name_Not_Found :03/08/17 18:04 ID:???
- >>103
>>102はもちろん試しました。
本文部分が十分な高さにならないこともありますし、
またその十分な高さも閲覧者の窓や文字の大きさに依存するものだと思うのですが。
ソースを既に上書きした後だったので、間違ってた部分もあるとは思うのですが
<IMG style="background-position:left bottom" SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
あるいは
<DIV style="background-position:0% 100%">
<IMG SRC="img/mailto.gif" ALT="mail" WIDTH="160" HEIGHT="39" BORDER="0">
</DIV>
にしてもダメでした。
なんだか根本的に間違ってるようなきもするのですが、
>>103のページを見てもわかりませんでした。
- 105 名前:Name_Not_Found :03/08/17 18:10 ID:???
- 正直、いろいろやってもわからないので聞いてるんだけどな。
じらされてばっかり。
- 106 名前:Name_Not_Found :03/08/17 18:49 ID:???
- background とはその要素の背景を指定するもの,というのは理解していらっしゃいますか?
それをわからずに「いろいろ」やっても無意味です.
<img ... は img 要素の背景を指定しているのだからやりたいことではない
<div ... は(以下同様)
で >100 の何が不満なんでしょう?
メニューと本文が短いときに footer が「ブラウザの一番下」に来ないこと?
だとしたら >6 の擬似フレームあたりを参考にすればよいかと
- 107 名前:Name_Not_Found :03/08/17 18:54 ID:???
- >>106
ありがとうございました。
- 108 名前:Name_Not_Found :03/08/17 18:56 ID:???
- もしかして、>>79=>>105だと思われてるのかな?
まあ、トリップつけてなかったし、仕方がないか。
- 109 名前:Name_Not_Found :03/08/17 21:01 ID:???
- >>104
>本文部分が十分な高さにならないこともありますし、
>またその十分な高さも閲覧者の窓や文字の大きさに依存するものだと思うのですが。
それはそもそも>>79が手本にした http://www.muji.co.jp/ でも同じことのはず。
改行しなさい。<br>多用でなく<p>とか<div>で括ってね。
まあ、根本的に間違ってますよ、いまのところ。>>4で勉強しませう。
- 110 名前:Name_Not_Found :03/08/17 21:09 ID:???
- http://www.muji.co.jp/job/index.html
- 111 名前:hegth :03/08/18 00:00 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 112 名前:Name_Not_Found :03/08/18 00:58 ID:???
- 今Topのページのcssを
div.colorname {background-color: gray}
body {background-color: orange;
color: gray}
a {text-decoration: none}
a:link {color: #f4a460}
a:visited {color: #f4a460}
a:active {color: #f4a460}
a:hover {color: #f4a460}
li {color: #f4a460;
margin-left: 10px;
margin-right: 20px;
font-size: 20px;
font-family: cliQue;
word-spacing: 80px;
display:inline}
div {color: gray}
こうしているのですが、liの所のword-spacing がうまく動作しておらず
80pxも間隔があきません。
以前はうまくいっていたのですが、この書き方では間違っているのでしょうか?
- 113 名前:Name_Not_Found :03/08/18 01:01 ID:???
- ↑は外部cssファイルで top.cssとしております。
コピペした関係で文字と文字の間の間隔が空いていないように見えますが
実際のファイルではもうちょっと整列しております。
すいません 訂正しないままUPして
- 114 名前:Name_Not_Found :03/08/18 01:06 ID:???
- すいません質問ですが、W3Cによると
Line : 1 Level : 1 指定された背景色(background-color)に対応する前面色(color)が指定されていません : div.colorname
Line : 5 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : a:link
Line : 6 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : a:visited
Line : 7 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : a:active
Line : 8 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : a:hover
Line : 9 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : li
Line : 13 font-family: 一般フォントファミリー名(generic font family)を最後の選択肢として付け加えておく事を推奨します
Line : 16 Level : 1 指定された全面色(color)に対応する背景色(background-color)が指定されていません : div
これだけの警告がでるのですが、スタイルシートとしては認められているようなのですが、
これって全部訂正しないとだめですか?
- 115 名前:Name_Not_Found :03/08/18 01:07 ID:???
- >>112
そのcssを
<body>
<ul>
<li>hello world</li>
<li>hello world</li>
<li>hello world</li>
</ul>
</body>
に適用したら、hello と world の間ちゃんと開いてるけど
一体どんなHTML書いてるの?
ちなみにWinXP IE6、Opera7、Mozilla1.3で確認
- 116 名前:Name_Not_Found :03/08/18 01:12 ID:???
- 通常より間隔は空いてるけど80pxまではいかないってことか。
em単位で指定が個人的にはいいと思うけどそれはともかく。
とりあえずどのブラウザで見たのか教えて欲すぃ
- 117 名前:Name_Not_Found :03/08/18 01:20 ID:???
- >>115 >>116 すいません。IE6で確認しております。
- 118 名前:Name_Not_Found :03/08/18 01:24 ID:???
- >>114
div.colorname{
color : transparent;
}
a:link, a:visited, a:active, a:hover, li, div {
background-color : transparent;
}
- 119 名前:Name_Not_Found :03/08/18 01:26 ID:???
- 当方の環境はWinXPでIE6です。以前は50PXにしていてそれが本当は
ちょうどデザインや見やすさ的にも気に入っておりまして、本当は
50pxぐらいで設定したいのですが、分かりやすくするため80pxに
しても変化がありませんでした。
別にpxにはこだわっておりませんが、cmよりわかりやすかと思い
pxをえらびました。
- 120 名前:Name_Not_Found :03/08/18 01:28 ID:???
- >>115様 ってことは特に間違ってはいないとゆうことなのでしょうか?
- 121 名前:Name_Not_Found :03/08/18 01:33 ID:???
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>無題ドキュメント</title>
<style type="text/css">
<!--
body {
width: 400px;
}
-->
</style>
</head>
<body>
あああああああああああああああああああああああああああああああああああああああああああああ
</body>
</html>
bodyに対して横幅を定義したんですがIEでは反映されないみたいです
バグなのでしょうか
- 122 名前:Name_Not_Found :03/08/18 01:36 ID:???
- >>121
マルチは止めろ。
- 123 名前:Name_Not_Found :03/08/18 01:49 ID:???
- >>118 せっかく教えていただいてあれなのですが・・・
教えていただいたことを記載してUPすると
行番号: 2 コンテキスト : div.colorname
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 10 コンテキスト : a:link
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 13 コンテキスト : a:visited
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 16 コンテキスト : a:active
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 19 コンテキスト : a:hover
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 28 コンテキスト : li
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
行番号: 31 コンテキスト : div
次のプロパティが正しくありません : colortransparent は color で利用できる値ではありません : transparent
こんなエラーがでるのですが・・・
- 124 名前:あぼーん :あぼーん
- あぼーん
- 125 名前:Name_Not_Found :03/08/18 01:55 ID:???
- >>123
:がなくなってないか?
- 126 名前:Name_Not_Found :03/08/18 01:58 ID:???
- >>123
すまん。colorには適応できないな。
div.colorname だけcolorしてやってくれ。
あとのはそれで行けるはず。
- 127 名前:Name_Not_Found :03/08/18 01:59 ID:???
- >>123
div.colorname {
color : inherit;
}
a:link , a:visited , a:active , a:hover , li , div {
background-color : transparent;
}
これでいける。
- 128 名前:Name_Not_Found :03/08/18 02:24 ID:???
- リンクテキストの表示色をclassで変えたり、個別に変える方法ってありますか?
- 129 名前:Name_Not_Found :03/08/18 02:25 ID:???
- >>128
リンクテキストの表示色をclassで変えたりすればええやん
- 130 名前:Name_Not_Found :03/08/18 02:35 ID:???
- background-color : transparent;
と
background-color : inherit;
の違いが判りません。
transparentでも親要素の色を敬称するんじゃないんですか?
- 131 名前:Name_Not_Found :03/08/18 03:02 ID:???
- transparent 透過色
inherit 継承 (親要素を明示的に継承する
対応
transparent IE4 IE5 IE5.5 IE6 N6 N7 O6 O7
inherit N6 N7 O6 O7
- 132 名前:Name_Not_Found :03/08/18 03:06 ID:???
- >>131
いや、意味は分かってるんだけど、結果は同じじゃないか?と訊いたんです。
- 133 名前:Name_Not_Found :03/08/18 03:06 ID:???
- あとはしらん
- 134 名前:Name_Not_Found :03/08/18 03:07 ID:???
- div.colorname {
color : inherit;
}
a:link , a:visited , a:active , a:hover , li , div {
background-color : inherit;
}
でいいということになるな。
- 135 名前:Name_Not_Found :03/08/18 03:13 ID:???
- transparent は必ず指定しなきゃいけないんじゃなかったっけ?
- 136 名前:Name_Not_Found :03/08/18 03:15 ID:???
- >>135
?
- 137 名前:Name_Not_Found :03/08/18 09:47 ID:???
- inheritはIEで無効だけどね。
- 138 名前:Name_Not_Found :03/08/18 11:52 ID:???
- >>132
div{
background-image : url(hoge.png);
background-color : #ff0000;
}
p{
background-color : inherit;/*これのあるなしを比べろ。*/
}
<div><p>hogehoge</p></div>
- 139 名前:Name_Not_Found :03/08/18 13:59 ID:???
- >>138
なるほど。試してないけど意味わかったす。
- 140 名前:hegth :03/08/19 00:00 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 141 名前:Name_Not_Found :03/08/19 01:35 ID:???
- 背景画像を一部だけ(左上に1個だけ)表示
したいのですが、どのようにしたらそう
表示できるでしょうか?
- 142 名前:Name_Not_Found :03/08/19 01:41 ID:???
- 繰り返しをたて座標、横座標ともに一回だけ
- 143 名前:Name_Not_Found :03/08/19 04:14 ID:???
- >>141
左上に表示したい画像のある幅100000pixel高さ100000pixelの画像を作る
- 144 名前:Name_Not_Found :03/08/19 04:24 ID:???
- >>143
hagedou!!!!!!!!!!!!
- 145 名前:49 :03/08/19 19:43 ID:???
- overflowで考えてみました。(64さんアドバイスありがとうございました)
しかしfloat:bottomというものは実在しないので、
スクロールしても常に画面下の配置方法をどうすればいいのか考え付きません。
希望する配置はこういうものですが、テーブルを使わずに実現するにはどうすればいいでしょうか?
<style type="text/css">
<!--
body{ margin: 0 }
table{margin-left:auto; margin-right:auto}
-->
</style>
<body>
<table cellpadding="0" cellspacing="0" border="1" width="400px" height="100%">
<tbody>
<tr><td height="20px"><br></td></tr>
<tr><td>test</td></tr>
<tr><td height="50px">test</td></tr>
</tbody>
</table>
</body>
- 146 名前:Name_Not_Found :03/08/19 21:53 ID:jXGXVcCQ
- age
- 147 名前:Name_Not_Found :03/08/19 22:21 ID:???
- <div style="height:100%;">
テキスト
<img src="gazou.jpg">
</div>
で、テキストは上揃え、画像を下揃えにするにはどうしたらいいでしょうか?
今はこう↓しているんですが、もっといいやりかたがあれば教えてください。
<div style="height:100%;">
<div style="height:80%;">テキスト</div>
<img src=gazou.jpg>
</div>
- 148 名前:Name_Not_Found :03/08/19 22:24 ID:???
- >>147
それでええやん
- 149 名前:147 :03/08/19 22:47 ID:???
- あ、そうですか?
ではこのままにしておきます。
ありがとうございました。
- 150 名前:Name_Not_Found :03/08/20 00:04 ID:???
- >>147
もっといいやり方と言うより、正しいやり方を勉強することだな
出直しておいで
- 151 名前:Name_Not_Found :03/08/20 00:07 ID:???
- >>145
FAQのリンク先は見たのですか。
疑似フレームのフッターを作る要領です。
http://www.fromdfj.net/html/sample/overflowsample03.html
- 152 名前:Name_Not_Found :03/08/20 00:10 ID:???
- >>145
そもそも正式にはtableタグにheight属性なぞあり得ないんだがね。
http://www.ne.jp/asahi/minazuki/bakera/html/reference/table#table
- 153 名前:Name_Not_Found :03/08/20 00:15 ID:???
- >>150
具体的にどんなやり方が適切なのか示してあげないとわかるまいよ。
- 154 名前:Name_Not_Found :03/08/20 00:22 ID:???
- >>152
「tableタグ」って、、、、お前も勉強して来い。
- 155 名前:Name_Not_Found :03/08/20 00:51 ID:???
- tableタグにheight属性とは、<table height="〜">のこと。
なんかヘンか? >>154
- 156 名前:Name_Not_Found :03/08/20 03:18 ID:nKFTRcB2
- >>151
それ見ました。高さを%で区切るのなら簡単なのですが
ヘッダーとフッター部分はピクセルで高さを決めて、
表示されている画面のheightからヘッダーとフッター部分を引いた高さをコンテンツ部分に指定したいのです。
- 157 名前:Name_Not_Found :03/08/20 04:01 ID:???
- >>156
http://pc2.2ch.net/hp/kako/1055/10555/1055536413.htmlの35に既出。
高さ100%からヘッダ・フッダをピクセル値で引くなんて、できません。
単位が異なるんですから引算になりません。換算してどちらかの単位に統一しませう。
まあIE独自拡張のダイナミック プロパティことexpression()関数を応用するんならともかく。
http://www.microsoft.com/JAPAN/developer/library/jpwebwk/author/dhtml/dude061198.htm
あと、>>152は了解したかい?
- 158 名前:Name_Not_Found :03/08/20 04:06 ID:???
- >>156
上下をの縦幅を固定してコンテンツのheightをautoにするとコンテンツ部分が少ない時にフッター部分が上に上がっちゃうてこと?
- 159 名前:Name_Not_Found :03/08/20 04:07 ID:???
- px単位は画像関係だけにしてくれ。なるべくem単位を使ってほしい。
- 160 名前:Name_Not_Found :03/08/20 04:16 ID:???
- >>156
http://homepage.mac.com/mikihiro/md/web/model/index.html
↑ここの製作中のモデルでどうよ
- 161 名前:Name_Not_Found :03/08/20 08:06 ID:???
- >>155はこれ以上恥を晒す前に勉強しなおせ
- 162 名前:Name_Not_Found :03/08/20 08:06 ID:???
- > 高さ100%からヘッダ・フッダをピクセル値で引くなんて、できません。
出来たらイイナァとか稀に思う。
- 163 名前:Name_Not_Found :03/08/20 09:58 ID:???
- >>161
こういっちゃ悪いが「この程度のこと」でそこまで反応している君も
- 164 名前:Name_Not_Found :03/08/20 10:02 ID:???
- hegth、 hegthってうるせーヨ!
- 165 名前:Name_Not_Found :03/08/20 11:52 ID:???
- table「タグ」にheight属性って…確かにあり得ないんだがねw
- 166 名前:Name_Not_Found :03/08/20 12:42 ID:???
- このスレの連中は総じてくどいな
- 167 名前:Name_Not_Found :03/08/20 12:42 ID:???
- >>161
ごめん、僕もどこが間違ってるのかわからん。こっそりご教示くだされ。
ソース中の<table></table>をtableタグと呼ぶのはいいんだよね?
- 168 名前:Name_Not_Found :03/08/20 12:48 ID:???
- 同じことだろ。
TABLE 要素には height という属性はありません。
TABLE タグには height 属性は書き込めません。
- 169 名前:Name_Not_Found :03/08/20 12:54 ID:???
- >>168
最近table「要素」を覚えたばっかりのお子様だ。放置しる。
- 170 名前:Name_Not_Found :03/08/20 13:29 ID:???
- お子様=>>154・>>161・>>165 で、いいか?
次の方、質問をどうぞ。
- 171 名前:Name_Not_Found :03/08/20 13:36 ID:???
- >>160
フッタを「スクロールしても常に画面下」に配置したいって>>145で言ってるから、それだとダメ。
- 172 名前:Name_Not_Found :03/08/20 13:41 ID:???
- うん、WinIE6だとfixed効かんからね
- 173 名前:Name_Not_Found :03/08/20 14:29 ID:???
- タグと属性と要素がごっちゃになっちゃったんだね。
- 174 名前:Name_Not_Found :03/08/20 14:47 ID:???
- タグに属性などありませんが。
- 175 名前:Name_Not_Found :03/08/20 14:53 ID:???
- ハァ?
- 176 名前:Name_Not_Found :03/08/20 15:31 ID:???
- それはもういいから解ってない奴は放置しる!
- 177 名前:Name_Not_Found :03/08/20 15:50 ID:???
- HTMLの話はスレ違い
- 178 名前:Name_Not_Found :03/08/20 17:05 ID:???
- >>152が第二のhegthにならないことを祈るばかりだ。
- 179 名前:Name_Not_Found :03/08/20 17:31 ID:???
- 画像にリンクしたときに、画像の周りに出るボーダーをCSSを使って消すことは出来ないでしょうか?
教えてください。
- 180 名前:Name_Not_Found :03/08/20 17:36 ID:???
- >>179
>>4
- 181 名前:145=156 :03/08/20 18:36 ID:???
- >>152
む。heightも指定するものと勘違いしてました。
ますますテーブル使いたくない。。。。
>>157
上のリンクに
>WinIEならダイナミック プロパティことexpression()関数を利用して、できる。
>document.body.clientHeightを弄って。
>http://www.microsoft.com/JAPAN/developer/library/jpwebwk/author/dhtml/dude061198.htm
とありました。この下のリンクはなくなっていて見ることができないので
ググってみたのですが例文のようなものも出てきませんでした。
これってjavascriptを使うということですか?
だとしたら広告うざい→javascriptOFFにしてる人は見れなくなるという諸刃の剣?
(こういう設定にしてるwinIEユーザーって多いのでしょうか?)
position:fixedが使えれば済む話なのにexpression()とやらを使わなければいけないとはトホホ。。。
>>145の例のあり得ない属性で指定してるけどなぜか表示できてしまうテーブルレイアウトで妥協するか
javascript?expression()のお勉強をするかなのですね。。。
アドバイスをくださった皆様ありがとうございました。
- 182 名前:Name_Not_Found :03/08/20 21:00 ID:???
- >>181
<body style="overflow:hidden;margin:0px;">
<div style="height:100%;overflow-y:scroll;">
<div style="height:1000px;">
本文
</div>
</div>
<div>
<div style="position:absolute;bottom:0px;height:40px;">
menu
</div>
</body>
できたぞ。ただしIE限定
- 183 名前:182 :03/08/20 21:02 ID:???
- 7行目のdivはミス
消してくれ
- 184 名前:Name_Not_Found :03/08/20 21:32 ID:???
- >>182
惜しい。
menuを含むdiv要素に、background-color:#ccf;width:100%;を追加したらわかるけど
(ていうか、追加しなくても本文を増やしたらわかるか)、本文がフッターと被る。
本文を直接含むdiv要素にmargin-bottom:40px;を追加したらいい感じ。
あとoverflowはautoの方がいいかも。
Opera7用。
<div id="header">
<p>へっだー</p>
</div>
<div id="content">
ほんぶん。
</div>
<div id="footer">
<p>ふったー</p>
</div>
body{margin: 0; padding: 0; background: #ccf}
#content{position: fixed; top: 20px; bottom: 50px; width: 100%; overflow: auto; background: #fff;}
#footer{position: absolute; bottom: 0; width: 100%; height: 50px; overflow: auto;}
- 185 名前:184 :03/08/20 21:56 ID:???
- あ〜、opera用のは、本文のpositionはabsoluteでもいいっぽい。
あとieのは、margin-bottomだけじゃなくてやっぱり背景色も指定しないとだめだわ。
でも背景色指定するとスクロールバーが隠れるんだよな……。
- 186 名前:Name_Not_Found :03/08/20 22:41 ID:???
- http://screenshot030720.easter.ne.jp/faketextarea.html
MacIE5で擬似フレームを中央に寄せたいのです。Mozillaでは思い通りの配置に
なっています。どのような記述を行えばよいでしょうか。
- 187 名前:Name_Not_Found :03/08/20 22:45 ID:???
- >>185
fixedを指定する意図がわからんし margin:0 てなんだよw
- 188 名前:184 :03/08/20 22:47 ID:???
- >>185
<div style="position:absolute;bottom:0;right:16px;height:40px;background:#ccf;width:100%;padding-left:16px;">
menu
</div>
とするとスクロールバーが隠れなくてよい。
- 189 名前:Name_Not_Found :03/08/20 23:03 ID:???
- >>187
一応IEで見てもmarginが入らないように。
まあopera用だけど完全に切り捨てるのはおかしいさ?
- 190 名前:Name_Not_Found :03/08/20 23:32 ID:???
- >>189
padding:0てなによ
- 191 名前:Name_Not_Found :03/08/20 23:42 ID:???
- ツマンネ
- 192 名前:hegth :03/08/21 00:00 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 193 名前:Name_Not_Found :03/08/21 00:37 ID:???
- >>190
オペーラだとpaddingが入るんだよ。いちいち訊くな。自分で確認しる。
- 194 名前:Name_Not_Found :03/08/21 00:56 ID:???
- >>193
paddingに整数値って指定できるのかー
( ´_ゝ`)つ〃∩ フーンフーンフーン
- 195 名前:Name_Not_Found :03/08/21 01:08 ID:???
- 普通、0は単位付けないんじゃないか?
- 196 名前:Name_Not_Found :03/08/21 01:08 ID:???
- >>194
値が0の時は単位が省略できますが?
- 197 名前:Name_Not_Found :03/08/21 01:16 ID:???
- (´-`).。oO(>>152=>>194かな…?)
- 198 名前:Name_Not_Found :03/08/21 01:37 ID:???
- >>187で頓珍漢な突っ込みやってる段階で気づいてやれよ
- 199 名前:Name_Not_Found :03/08/21 04:00 ID:???
- むしろ>>154=>>194かと。
- 200 名前:Name_Not_Found :03/08/21 07:43 ID:???
- 1フーン=10ヘェを知らない香具師らハケーン
- 201 名前:Name_Not_Found :03/08/21 09:15 ID:???
- <dl>
<dt>てへてへ</dt><dd>ほげほげ</dd><dd>ほにゃらら</dd>
<dt>てへてへ2</dt><dd>ほげほげ2</dd>
<dt>てへてへてへてへてへてへ3</dt><dd>ほげほげ3</dd>
---↑これを----------------------------------
てへてへ ほげほげ
ほにゃらら
てへてへ2 ほげほげ2
てへてへてへてへてへてへ3
ほげほげ3
---↑こんな風に------------------------------
昔の<dl compact>のように並べる方法はありますか?
<li>を使うのは、なんか違う気がしたので
dt{
float:left;
width:45%;}
dd{
float:right;
width50%; }
とやってみましたがどうも上手くいきません
誰か助けて
- 202 名前:Name_Not_Found :03/08/21 09:17 ID:???
- 訂正 で、</dl>を付けといてください、あとイメージは
てへてへ ほげほげ
ほにゃらら
てへてへ2 ほげほげ2
てへてへてへてへてへてへ3
ほげほげ3
です。<dd>要素の頭をそろえてやりたいんです
- 203 名前:Name_Not_Found :03/08/21 09:21 ID:???
- >>202
三番目の dt の長さは dd に食い込むってこと?
っつかもうちょっと別の文章とか入れてくれ、わかりづらいw
- 204 名前:Name_Not_Found :03/08/21 09:28 ID:???
- >>200
( ´_ゝ`)つ〃∩ フーンフーンフーン
- 205 名前:Name_Not_Found :03/08/21 10:17 ID:???
- >>203
わかりにくくてすいません
そうです、そういう感じなんです。
http://tohoho.wakusei.ne.jp/html/dl.htm
↑とほほさんのコンパクト表示のところです
これがやりたいんですけど廃止されたみたいで
例えば、dtの長さが6em以下ならddはdtと同じ行に
dtが6emを超えたらddは一行下に表示され
なおかつ ddが連続した場合は ddの文頭はすべて6emのmarginがとられているような状態です
>>201のようにfloatを使ったら連続したddの文頭がずれるんです
- 206 名前:Name_Not_Found :03/08/21 10:19 ID:???
- >>203
compact属性は定義語が短い場合、自動的に定義説明が
定義語と同じ行に表示されるようにするもの。
要するにdt要素の文字列長がdd要素の左マージンより
短かったら改行しないで表示すると。
- 207 名前:Name_Not_Found :03/08/21 12:53 ID:???
- >>205
>>201のままならddのwidthを50%より大きくすればずれない。
ただこのままだと、compact属性をエミュレートできないから、
dtのwidth指定を外して、ddのwidthを90%ぐらいにすれば……。
それからddの左マージンは0にした方がいい。
あとdtにclear:bothを加えれば、IE以外、operaとかでなら
ほぼ期待通りに動作するはず。
IEだと2番目以降のdtがdd1つ分上にずれるのと、dtにwidthが
指定されてないと勝手に縮小されるからだめだな。
- 208 名前:Name_Not_Found :03/08/21 14:33 ID:???
- >>201
何で、3行目の<dd>を右寄せにしたいのかな?
dt {
float:left;
width: 30%;
clear: both;
}
dd {
margin-left: 30%;
}
単純にこれでいいんじゃないの
- 209 名前:Name_Not_Found :03/08/21 14:42 ID:???
- >>208
>201のやりたいのはそういうのじゃないんだよ。
IEで<dl compact="compact">ってやって表示してみれ。
- 210 名前:201 :03/08/21 15:50 ID:???
- >>206
そうなんです
>>207
ありがとうございます、やってみました
もじらでも見てみました上手くいってました
しかし閲覧者の大半がIEなんでIEで表示がずれてしまうのは正直キツイです
10%の80%でやったら長いdtが折り返されちゃって
>>208
右寄せと言うか>>209の言ってる通りなんです
今まで dl compactで幸せだったんですけど
今回ソースの整形するのに外部スタイルシートに display: compactとしてみたら
廃止されてるみたいでIEもNNも対応していないそうなんです
それで、どうにかしてまったく同じように再現できないものかと昨日から悩んでるんです
- 211 名前:Name_Not_Found :03/08/21 15:58 ID:???
- >>210
display:compact;は廃止されたのではなくて、Operaしか対応していないだけ。
- 212 名前:186 :03/08/21 22:02 ID:???
- >>186です。
http://screenshot030720.easter.ne.jp/faketextarea.html
一部更新しました。ただ単に擬似フレームを中央寄せにすることは
左右にmarginを取ることでできそうなのですが、そうすると横幅指定が
効かなくなります。MacIE5でdivにoverflow:visible;以外を指定すると
margin:auto;が無効になるようなのです。横幅を保ったまま
中央揃えになるような記述はないでしょうか。
- 213 名前:Name_Not_Found :03/08/21 22:51 ID:???
- >>212
Macじゃないから確認できん。
このスレに186以外のマカーいるのか?
- 214 名前:Name_Not_Found :03/08/21 23:18 ID:???
- 漏れはマカーだが、今は別の板で祭りが開催されているのでこの板まで手が回らない。スマソ
- 215 名前:hegth :03/08/22 00:00 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 216 名前:Name_Not_Found :03/08/22 00:47 ID:???
- name属性が含まれているもの、とか
name属性へのリンク、とかをセレクタにできますか?
クラス指定しないと無理ですかね。
- 217 名前:216 :03/08/22 00:48 ID:???
- 補足
ページ内リンクをわかるようにしたいんです。
- 218 名前:Name_Not_Found :03/08/22 00:49 ID:???
- >>216
属性セレクタがあるじゃないか。対応状況は別として…
- 219 名前:216 :03/08/22 00:50 ID:???
- >>218
属性セレクタですか。
調べるキーワードがわからなかったので困ってました。
仕様書見てきます。有難う御座いました。
- 220 名前:216 :03/08/22 01:09 ID:???
- >>218
おっしゃるとおり、対応状況が芳しくないようですね。
他の案を考えることにします。
有難う御座いました。
- 221 名前:181 :03/08/22 02:18 ID:???
- >>182,184
margin-bottom:40px;を追加してみたのですが
本文とかぶる状況は打破できません。
winIEは大丈夫なのでしょうか?macIEではダメぽです。
っていうかふたつめの<div>がなくても本文は同じように表示できるのに
なぜ<div>を入れ子にするのか、なぜheight:1000px;なのか理解できないでいます。
ここ最近この一連の問題に悩み過ぎて頭はあまり働かない状況なのですが
この意味を教えていただけないでしょうか?
- 222 名前:Name_Not_Found :03/08/22 03:33 ID:???
- >>220
未対応ブラウザなんか窓から投げ捨てろ!
って訳にも行かないよな・・・
- 223 名前:Name_Not_Found :03/08/22 04:16 ID:???
- >>221
> なぜ<div>を入れ子にするのか、なぜheight:1000px;なのか理解できないでいます。
スクロールバーを表示させるため。<div>のかわりに好きなものいれたらよろし。
> 本文とかぶる状況は打破できません。
当たり前。背景でも指定しとけ。
- 224 名前:Name_Not_Found :03/08/22 07:10 ID:???
- CSSでこのような下図のような段組をしたいのですが、
┌────┬────┐
│ │ │
│ .box1. │ .box2. │
│ │ │
├────┼────┤
│ │ │
│ .box3. │ .box4. │
│ │ │
└────┴────┘
どうにも解説サイトを渡り歩いてもレイアウトできません。
floatプロパティとclearプロパティを使っているのですが・・・
<div style="width:20%; float:left; height:150px">1</div>
<div style="width:20%; float:left; height:150px">2</div>
<div style="clear:left; margin:0px;">
<div style="width:20%; float:left; height:150px">3</div>
<div style="width:20%; float:left; height:150px">4</div>
</div>
- 225 名前:224 :03/08/22 07:11 ID:???
- (途中送信してしまったので続き)
なんだか目茶苦茶div使いまくりな上に、上側と下側にIEだと隙間ができます・・・。
何かいい方法ありましたらご教授ください。
- 226 名前:Name_Not_Found :03/08/22 07:47 ID:???
- >>224
<div style="width:20%; float:left; height:150px">1</div>
<div style="width:20%; float:right; height:150px">2</div>
<div style="width:20%; clear:left; height:150px">3</div>
<div style="width:20%; float:right; height:150px">4</div>
</div>
じゃだめなの?
<div style="clear:left; margin:0px;"> はなに?
- 227 名前:Name_Not_Found :03/08/22 07:58 ID:???
- >>226
それだとboxが左右にわかれますよね。
boxをみんな隣接した状態にしたいもので・・・。
widthを50%にすれば隣接するにはするんですが、都合上それじゃ厳しいので。
><div style="clear:left; margin:0px;"> はなに?
box1とbox2をfloatプロパティを使用して段組に。
box3とbox4も同様にして段組に。
その後box3とbox4をさらに回り込ませてみたんです。
あとはマージンをとって隙間をなくそうと踏んだのですが、無意味でした。
どうもやり方が下手糞です・・・。
- 228 名前:Name_Not_Found :03/08/22 08:38 ID:???
- margin-left使ったら?
- 229 名前:Name_Not_Found :03/08/22 08:46 ID:???
- >>227
<div style="width:20%; float:left; height:150px">1</div>
<div style="width:20%; margin-left:20%; height:150px">2</div>
<div style="clear:left; width:20%; float:left; height:150px">3</div>
<div style="width:20%; margin-left:20%; height:150px">4</div>
で、いいはずだが。
cf. http://cssbug.tripod.co.jp/detail/winie/b093.html
http://cssbug.tripod.co.jp/detail/opera/b044.html
- 230 名前:Name_Not_Found :03/08/22 09:10 ID:dR0m7LyG
- ●●●●●●●●●●●●●●●●●●●●●
● ● ●
● ● ●
● ● ●
● ● ●
● ● ●
● ● ● __( "''''''::::.
● ● ● ● ____,,,,,,---'''''''"""" ヽ ゛゛:ヽ
● ● ● ●:"""" ・ ・ . \::. 丿エ〜デルワ〜イス エ〜デルワ〜イス
● ● ● ●::: ・......::::::::::::彡''ヘ::::....ノ
● ● ::::::::::;;;;;,,---"""
●●●●●
- 231 名前:Name_Not_Found :03/08/22 09:40 ID:???
- >>229
IEやOperaにそんなバグがあったんですね。
そのソースだとIEじゃ左右でboxの幅が違うけど・・・。
これが一番妥当でしょうか。
- 232 名前:Name_Not_Found :03/08/22 16:42 ID:???
- <html><head><title>質問</title><style>
body { background:#9cf; }
pre { background:#ccc; color:#000;}
</style></head><body>
<pre>
あるスレを見て気になったんだが、このHTMLをIE,Moz,Operaで横幅を狭くして
見てみたところ、IEとMoz/Operaで表示のされ方が違うのが気になりました。
■質問 IEとMoz/Operaではどちらが仕様に正しいんですか?
#もしもbodyのbackgroundがpreのcolorと同じだったら、
#同じでなくても、見た目が悪いですよね。
</pre>
</body></html>
- 233 名前:Name_Not_Found :03/08/22 17:15 ID:???
- >>232
次からは、どう違うのか具体的に書いてから質問してくれ。
いちいち相違点を探すのに手間がかかる。
仕様に忠実なのはOpera/Mozの方。
MSIEはoverflow:visibleの実装がおかしい。
http://www.mozilla.gr.jp/standards/webtips0020.html
- 234 名前:Name_Not_Found :03/08/22 18:52 ID:???
- >>233
thax 下手に説明するよりHTMLはったほうが良いかと思ったので、スマソ
- 235 名前:186 :03/08/23 00:49 ID:???
- >>186>>212です。
212,213両氏、ご返答ありがとうございます。ひとつ方法を見つけました。
http://screenshot030720.easter.ne.jp/faketextarea.html
一部更新しました。overflow:auto;を指定したdivを更にdivで囲い、
外側のdivに指定することでwidthを保ったまま中央揃えできました。
この方法は正直恥ずかしいです。もっとスマートな方法をご存じの方、お教えください。
あとOpera7.xの方にお聞きしたいのですが、
http://screenshot030720.easter.ne.jp/macopera603.html
7.xではこんな酷い表示にはならないですよね? 8/20に発表されたばかりの
Mac版6.0.3ではこの有様だったのです。
- 236 名前:Name_Not_Found :03/08/23 01:05 ID:???
- >>235
確認しておきたいのだけど、Mac IEのみを対象とした実験?
Win IE 6.0だと入れ子divもセンタリングできてないんだけど。
- 237 名前:186 :03/08/23 01:22 ID:???
- >>236
ご意見ありがとうございます。WinIEだと無理なのですか。
入れ子div「も」、ということは1番目も3番目もセンタリングされないと
いうことでしょうか。
http://screenshot030720.easter.ne.jp/index.html
上記からIE5.1.7とMozilla1.3.1とOpera6.0.3(すべてMac)の
スクリーンショットにリンクしていますが、どの表示に近いのでしょうか。
私が方法を誤っているということであれば、正しい記述を教えていただけると嬉しいです。
- 238 名前:Name_Not_Found :03/08/23 01:31 ID:???
- >>237
WinIE6.0 では、MacMoz に一番近いと思う。
- 239 名前:186 :03/08/23 01:54 ID:???
- >>238
ご返答ありがとうございます。今一度確認します。
WinIE6.0では1番目から3番目まですべて中央寄せされているということで
正しいでしょうか。4番目はスクリーンショットに写っていませんが右寄せに
しているつもりです。
- 240 名前:Name_Not_Found :03/08/23 02:40 ID:???
- >>239
真ん中・真ん中・真ん中・右端になってるよ。
幅固定・幅可変・幅固定・幅固定。
- 241 名前:236 :03/08/23 03:17 ID:???
- >>239
ごめん。proxomitoronが変な動作してた。
Winだと、NC7.1、IE6.0、Opera7.11で4つとも正常表示。
3つがセンタリング・4つ目が右寄せとして。
- 242 名前:186 :03/08/23 10:57 ID:???
- >>240>>241
ご返答ありがとうございます。ではMacIE特有の問題なのですね。
とするとそのためだけにマークアップを曲げるのがますます心苦しくなりました。
デザインを最優先させるときのみ入れ子にして、それ以外の時は表示が食い違っても
やむなし、と考えています。MacのOperaは7になるまで考慮しないことにします。
ご協力に感謝します。
- 243 名前:Name_Not_Found :03/08/23 13:26 ID:???
- 中央寄せならこれの所為でないの?
Internet Explorer (MacOS) CSSバグリスト
http://cssbug.tripod.co.jp/detail/macie.html
marginプロパティで値を一括指定すると無視される(4.1/5.0)
http://cssbug.tripod.co.jp/detail/macie/b022.html
- 244 名前:186 :03/08/23 13:47 ID:???
- >>243
ご指摘ありがとうございます。
http://screenshot030720.easter.ne.jp/faketextarea.html
こちらに示したcss記述の通り、margin-left:auto;margin-right:auto;と
別々に記述しております。ちなみにご指摘のバグはMacIE5.1.xで解消されています。
- 245 名前:Name_Not_Found :03/08/23 13:50 ID:???
- >>244
是非こちらに報告して!
CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
- 246 名前:Name_Not_Found :03/08/23 13:57 ID:???
- これとも違ってるな。
overflowプロパティにvisible以外の値が指定された要素が表示されない(5.x)
http://cssbug.tripod.co.jp/detail/macie/b013.html
- 247 名前:186 :03/08/23 14:35 ID:???
- >>245
ご紹介ありがとうございます。要点を整理してから伺います。
>>246
ご指摘ありがとうございます。このバグがあるためpre要素で擬似フレームが
出来ないのです。ユーザースタイルシートにhtml,h1,h2,h3,h4,h5,h6,p,pre,center,dl,blockquote,form,address,noscript,noframes{overflow:visible!important;}
と記述して回避しています。
- 248 名前:Name_Not_Found :03/08/23 14:37 ID:???
- ユニバーサルセレクタ(*)は、使わないほうがいいのでしょうか?
- 249 名前:Name_Not_Found :03/08/23 15:47 ID:???
- >>248
そんなことないと思うよ。
- 250 名前:Name_Not_Found :03/08/23 16:38 ID:???
- >>248
全ての要素に適用させるのは、良くない。
なぜならば、img要素にも、fontプロパティが
当てられることになるでしょ。
適切じゃない。
- 251 名前:Name_Not_Found :03/08/23 16:43 ID:???
- >>250
全ての要素に適用できるプロパティしか使わなければ問題ないじゃん
- 252 名前:Name_Not_Found :03/08/23 17:06 ID:???
- >>250
適用できないプロパティは無視されるんだし。
- 253 名前:Name_Not_Found :03/08/23 17:06 ID:???
- >>251
それだと、そもそもユニバーサルスタイルを使わないんじゃないのかな。
>>248は、ブラウザのデフォルトのスタイルを無効にしたいんだろう。
- 254 名前:Name_Not_Found :03/08/23 17:10 ID:???
- >ブラウザのデフォルトのスタイルを無効に
そんなことしちゃったら大変じゃないか?
CSS2ではformまわりのスタイルを再現しきれないじゃん
- 255 名前:Name_Not_Found :03/08/23 18:21 ID:???
- 見出し(hX)に自動でナンバリングを入れたいのですができますか?
- 256 名前:Name_Not_Found :03/08/23 18:30 ID:???
- できますが、あの素晴らしい人類最高の成果物と言わざるを得ないIEは
対応できていないのでやめましょう
- 257 名前:Name_Not_Found :03/08/23 18:35 ID:???
- >>255
http://tohoho.wakusei.ne.jp/css/reference.htm#counter-reset
- 258 名前:Name_Not_Found :03/08/23 19:34 ID:???
- divでくくった要素をfloatで左に寄せてheight:100%とするとウィンドウの上端から下端までの長さになってしまいます。
ドキュメントの上端から下端まで指定するにはなにを使えばいいんでしょうか。
- 259 名前:Name_Not_Found :03/08/23 20:07 ID:???
- >>258
どういうこと?
- 260 名前:Name_Not_Found :03/08/23 20:30 ID:???
- >>259
height:100%とするとスクロールする前はウィンドウの上端から下端まで表示されるんですが、
少しでも下にスクロールすると隙間ができるんです。
このスレで言えば1から1001まで帯状に表示したいんです。
- 261 名前:Name_Not_Found :03/08/23 20:32 ID:???
- bodyとhtmlの差異を理解しなさい。仕様書読むべし。>>258
- 262 名前:Name_Not_Found :03/08/23 20:57 ID:???
- >>261
何言ってるのか、チンプンカンプン。
- 263 名前:Name_Not_Found :03/08/23 21:07 ID:???
- >>262 そんなあなたに。
閲覧領域と包含ブロック
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/visuren.html#q2
高さの算出法
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/visudet.html#q17
あと
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/visuren.html#floats
>浮動体は通常フローに属していないので、その前後に生成される位置指定されて
>いないブロックボックスは、浮動体が存在しないかのように流し込まれる。
- 264 名前:Name_Not_Found :03/08/23 21:20 ID:???
- >>263
何言ってるのか、チンプンカンプン。
- 265 名前:254 :03/08/23 21:56 ID:???
- >>256-257
遅ればせながらありがとうございました。
- 266 名前:255=265 :03/08/23 21:57 ID:???
- >>265
失礼。
×254
○255
- 267 名前:Name_Not_Found :03/08/23 22:30 ID:???
- 隙間ができるって?
- 268 名前:hegth :03/08/24 00:00 ID:???
- http://pc2.2ch.net/test/read.cgi/hp/1055536413/456
456 名前:Name_Not_Found sage 03/06/25 (水) 18:20 ID:???
自分の馬鹿さを晒し上げているスレはここですか?
hegth:100px; → これを実数値(正確には実数値+単位)という
hegth:100%; → これを割合値という
- 269 名前:Name_Not_Found :03/08/24 00:40 ID:???
- >>268
何言ってるのか、チンプンカンプン。
- 270 名前:Name_Not_Found :03/08/24 10:14 ID:???
- >>271
何言ってるのか、チンプンカンプン。
- 271 名前:Name_Not_Found :03/08/24 10:50 ID:???
- 今、俺は、女の子とメッセで話している夢を見たような気がしてならないのだが…。
その時隣の部屋から「誰か今夜、カラオケOFFやろうぜ!!」という
楽しげな声が聞こえてきたが、自分には電話すらかかってこない訳で…。
「お母さん、俺、大学辞めて代アニ通うことにするよ」
なんてことをいう決断力があるわけもなく、結局家の中でいつものように、
しこしこといつ終わるともわからないおなにーをしながら自分の運命を呪い、
スレに何か新しい書き込みが無いかと今日も今日とてチェックをかかさなかった。
そんな自分が嫌になったが練炭を買おうにも金がなく、炭火で焼こうと思い買った鰻だけが残った。
その鰻は微笑み、こう言った。「お前もめぽ、俺を食べたら、もっともめぽ」
ところで何が変わるでもなく、絶望した私は回線を切って首を吊って逝った。
- 272 名前:Name_Not_Found :03/08/24 11:05 ID:???
- よし、すべからくわかったべし
- 273 名前:Name_Not_Found :03/08/24 14:35 ID:???
- <INPUT>でradioやtext、buttonごとに別の設定をCSSファイルに
記述したいのですが、出来るのでしょうか?
出来るとしたらどう書くのですか?
今は例えばこんな風に書いているのですが、
input {
hoge: xxx;
}
ほんとはこんな風に分けたいんです。
text{
hoge: xxx;
}
button{
hoge: yyy;
}
radio{
hoge: zzz;
}
どなたか教えてください。宜しくお願いします。
- 274 名前:Name_Not_Found :03/08/24 15:58 ID:???
- >>273
属性セレクタを使えばできる。
input[type="text"] {
hoge: xxx;
}
という感じで。
けど残念ながらIEが対応していないので、クラス分けするかid振るしかないです。
- 275 名前:Name_Not_Found :03/08/24 16:46 ID:???
- IEが対応してないなら非標準も同然
- 276 名前:Name_Not_Found :03/08/24 16:49 ID:???
- >>275
何が?
- 277 名前:Name_Not_Found :03/08/24 17:18 ID:???
- css3の縦書きは世界標準
- 278 名前:273 :03/08/24 19:55 ID:???
- >274
属性セレクタっていうものがあるんですね。
知らなかったです。
ありがとうございました。
それにしてもM$め…
- 279 名前:Name_Not_Found :03/08/24 20:04 ID:???
- >>278のレベルが1あがった。
- 280 名前:Name_Not_Found :03/08/24 20:53 ID:???
- CSSの利便性がわかってくるとM$が憎くなってくるんだよね
- 281 名前:Name_Not_Found :03/08/24 21:36 ID:???
- >>275
同然ではなくて真に非標準。
IEが対応してるのはW3C製でなくても絶対的な標準。
- 282 名前:Name_Not_Found :03/08/24 21:56 ID:???
- その程度のブラウザを標準としてしまう世界もどうかと
- 283 名前:Name_Not_Found :03/08/24 22:01 ID:???
- >>282
じゃお前が何とかしたれや
- 284 名前:Name_Not_Found :03/08/24 22:09 ID:???
- >>283
なぜそんなに必死なんだ?(ぴゅあ
- 285 名前:Name_Not_Found :03/08/24 22:20 ID:???
- http://that.2ch.net/test/read.cgi/gline/1039358238/120
- 286 名前:Name_Not_Found :03/08/25 02:52 ID:???
- お知恵をお貸し下さい。
table-td内に<ul><li>で箇条書きしたテキストの行間を空けたいと思い、
td.text{line-height : 150%;}と書きました。
NetscapeとOperaでは意図通りに表示されますが、IEではいくつかの行間のみ
意図通りに空きません。
<li>の先頭を画像で表したいのですが、Netscapeではその画像とそれに続く文章の
水平中心線(?)が合うのですが、IEとOperaでは画像が上にずれてしまいます。
(青○黄色△三角☆の、文字の高さより少し低い高さの画像です。)
table-td内の<ul>と<li>の位置というか、tdの枠線に対しての余白(?)が、
IE・Netscape・Operaで、あまりにも違いすぎます。
<ul>と<li>のそれぞれの、paddingやmarginをいろいろいじってみましたが、どのブラウザでも
ちょうどよい余白になる設定が見つけ出せません。(あちらを建てればこちらが建たず状態)
- 287 名前:Name_Not_Found :03/08/25 03:02 ID:???
- >>286
> table-td内に<ul><li>で箇条書きしたテキストの行間を空けたいと思い、
> td.text{line-height : 150%;}と書きました。
ここはliに行間指定するべきではないの?
- 288 名前:Name_Not_Found :03/08/25 04:52 ID:???
- >>287
ご忠告の通り直してみましたが、うまくいきませんでした。
例えば、
<li>11111222223333</li>
となっていて、五文字でtd幅いっぱいになって3行に渡る場合、
22222と33333の行間は意図通りに150%になってるんですが、
11111と22222の行間が詰まってる(100%?)になってるんですよ。
NetscapeとOperaではどれも同じ行間になってるのに・・・
- 289 名前:Name_Not_Found :03/08/25 04:58 ID:???
- >>288
ああ、いや、こうすれば直るよ、じゃなくって
マークアップの意義的にはこうするべきなんじゃないの?って意味で。
私もリストでのIEの挙動に悩んでる。
#正しい記述で入れ子にすると変な余白ができる
- 290 名前:Name_Not_Found :03/08/25 10:07 ID:???
- なんか思いっきりテーブルレイアウトだしなァ・・・
- 291 名前:Name_Not_Found :03/08/25 10:12 ID:???
- IEってのは、テーブルレイアウトを蔓延させるために作られてると思うほどだ
- 292 名前:Name_Not_Found :03/08/25 10:25 ID:???
- >>290
>286さんのことなのかな?
表の中にリスト入れる必要性はよくあると思うけど。
それとも>289さんが言うような意味でなのかな。
>>291
mozillaもテーブルレイアウトの普及活動は忘れてないですよ。
がんばります!
http://www.mozilla.org/
- 293 名前:Name_Not_Found :03/08/25 10:37 ID:???
- >>288
フォントによって誤差がでやすいんのではないか?
頭をひねって、<li>に padding でいいだろうね
- 294 名前:Name_Not_Found :03/08/25 10:49 ID:???
- operaはcssレイアウトなんだな
http://www.opera.com/
- 295 名前:Name_Not_Found :03/08/25 12:11 ID:???
- ブロックの真ん中寄せで、
body { text-align:center }
div { margin-left:auto; margin-right:auto; text-align:left; width:500px; }
と書いてみました。
これを NN7.01 で表示した場合、ウィンドウ幅を500px 以上にした場合には
普通に真ん中寄せになるのですが、ウィンドウ幅を縮めて横スクロールバーが
出た状態になったとき、スクロールバーを動かしても、ブロック(この場合は
div)の左端に到達できませんでした。
バグ辞典には特に書いてなかったですが、これって、周知のバグでしょうか?
- 296 名前:Name_Not_Found :03/08/25 14:09 ID:???
- >>295
右端にも到達できなくない?
marginは負の値もとる。
- 297 名前:295 :03/08/25 14:27 ID:???
- >>296
当方、右端には行けました。
ソースは次にて。
- 298 名前:295 :03/08/25 14:27 ID:???
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html dir="ltr" lang="ja-JP">
<head>
<meta http-equiv="Content-type" content="text/html; charset=EUC-JP">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>centering</title>
<style type="text/css">
body { margin: 0px; text-align: center; background-color: #999999; }
div,td { text-align: left; width: 500px; margin-left: auto; margin-right: auto; background-color: #ffffff; }
</style>
</head>
<body>
<!--/header-->
<h1>Netscape7.01 と横スクロール</h1>
<hr>
<div>div要素です。左にずぶずぶめり込んで(?)いきます。div要素です。左にずぶずぶめり込んで(?)いきます。div要素です。左にずぶずぶめり込んで(?)いきます。div要素です。左にずぶずぶめり込んで(?)いきます。</div>
<hr>
<table cellspacing="0" cellpadding="0" border="0" align="center"><tr><td>table要素(とその仲間たち)です。左端で止まります。</td></tr></table>
<hr>
<p>何故に?</p>
</body>
</html>
- 299 名前:295 :03/08/25 14:31 ID:???
- うpしました。
http://up.isp.2ch.net/up/5463c570586b.html
- 300 名前:Name_Not_Found :03/08/25 15:03 ID:???
- div,tdをdiv,tableに書き換えると右端を突き抜けるようになるけど、左端で止まるのはそのままだ。
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.5b) Gecko/20030824 Mozilla Firebird/0.6.1+
- 301 名前:295 :03/08/25 15:25 ID:???
- >>300
当方
Mozilla/5.0 (Windows; U; Windows NT 5.0; ja-JP; rv:1.0.2) Gecko/20021120 Netscape/7.01
です。table が左に突き抜けないのは、table がブロックじゃないから、かな?
右も左も突き抜けるのは、margin が負になったと解釈すれば、正しい挙動だと思います。
でも、スクロールバーを動かして左端に到達できないのは、ブラウザ固有のバグと
判断してよいものですかね。
- 302 名前:295 :03/08/25 16:22 ID:???
- どうやらそういうものみたい。
バグ辞典スレに逝ってきます。
- 303 名前:Name_Not_Found :03/08/26 13:20 ID:???
- ふとした疑問なんですけど、
line-heightプロパティなどを使って行間を取ると、マーカーに画像を使った場合ずれますよね。
Mozilaだとそれなりにあってくれるんですけど、Operaなんかだと酷いことになります。IEは微妙。
そこで、マーカーの位置を文章に合わせるにはどのような工夫をすればいいんでしょう。
- 304 名前:Name_Not_Found :03/08/26 14:27 ID:???
- >>303
li {
margin:0;
padding:画像に合わせて適当に;
background-image:url("marker.png");
background-position:left center;
background-repeat:no-repeat;
list-style-type:none;
}
- 305 名前:Name_Not_Found :03/08/26 14:31 ID:???
- 画像表示についての質問です。
* {
-moz-box-sizing : border-box;
}
img{
padding: 5px;
border: 1px;
}
とした時に、表示させる画像サイズが100px 100pxだとして
<img src="/hoge/hoge.jpg" alt="〜" width="100" height="100">
とすると、IEではそのまま表示されますがMozillaだと画像がpaddingの分だけ縮んでしまいます。
paddingを諦める、width/heightの記入をしない以外に上手い解決法はありますでしょうか?
- 306 名前:Name_Not_Found :03/08/26 15:18 ID:???
- >>305
まーじんじゃあかんの?
- 307 名前:Name_Not_Found :03/08/26 15:26 ID:???
- >>306
paddingとborderを使って写真のフチみたいにしてるんです。
imgの背景に白を入れてborderで影をつけてます。
元画像にフチ付けろというのは無しでどうにかならないでしょうか。
- 308 名前:Name_Not_Found :03/08/26 15:32 ID:???
- >>307
自転車で150km/h出せるようにしたいです。原動機付けるとかはなしで。
- 309 名前:305 :03/08/26 15:37 ID:???
- できました!!
imgに
-moz-box-sizing : content-box;
追加で行けました!!
お騒がせしました。
- 310 名前:Name_Not_Found :03/08/26 16:29 ID:???
- >>305
お喜びのところすまないが、
-moz-プロパティはブラウザ開発者がWebサイトでは使うなっと言っていることをご存知か?
- 311 名前:Name_Not_Found :03/08/27 00:30 ID:???
- そのくらいは知ってて当然だよな・・・
- 312 名前:Name_Not_Found :03/08/27 12:46 ID:???
- マルチカラムデザインについてなんですが
http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
ここで
</div>
<div id="critical">
〜
</div>
<div class="status">
〜
</div>
このidとclassを使い分ける理由ってなんですか?
もう一つ、clearを使わないでfloatだけ作るっていうのはOKなんですか?
- 313 名前:Name_Not_Found :03/08/27 12:48 ID:???
- >>312
その作成者に聞いたらいかがですか?
>clearを使わないでfloatだけ作るっていうのはOKなんですか?
意味不明
- 314 名前:Name_Not_Found :03/08/27 12:56 ID:???
- >>313
そのサイトは例えで出しただけで
ほとんどのサイトでidとclassを使ってました
だから、何か決まりがあるんじゃないんですか?
- 315 名前:Name_Not_Found :03/08/27 13:00 ID:???
- >>314
idとclassの違いを学ぶとよいよ>>1
まあ、「idは一回だけ。classは何度使ってもいい」と覚えておいても取り敢えず問題はないけど。
で、ほとんどがそうしている理由、として考えられるものね
メニュー枠とかは一回しか出てこないけど、本文枠はなんどか出てくるから、とかかな。
- 316 名前:Name_Not_Found :03/08/27 13:07 ID:???
- >>312
id属性とclass属性は根本から違います。
id属性は、その要素を識別するもの。
class属性は、その要素のより細かな分類を示すもの。
なおid属性は「一つのページで複数回同じ型での使用はしてはいけない事になっています。
Googleで検索すれば腐るほど解説サイトがあるので詳細はそちらでどうぞ。
- 317 名前:Name_Not_Found :03/08/27 13:19 ID:???
- >>315
>>316
レスどうもです
idとclassの違いを勉強してきます。
- 318 名前:Name_Not_Found :03/08/27 13:20 ID:???
- >>317
おいおいclearはもういいのか?
- 319 名前:Name_Not_Found :03/08/27 15:46 ID:???
- 外部スタイルシートで
h1,
h2,
{
color:red;
}
って複数の要素に同じ内容入れる事ってできないの?
いま、作成中のサイト用にNNをDLしたらstyleが全く適用されないで、愕然としたんだけど・・・
NN7.1ってこういうの認識しないの?
- 320 名前:Name_Not_Found :03/08/27 15:49 ID:???
- >>319
なんでお前は質問者の分際でタメ口やねん。身の程をわきまえろ下郎が。
- 321 名前:Name_Not_Found :03/08/27 15:51 ID:???
- 御免・・・
複数要素で次が無いのに「,」入れると駄目なのか・・・・
面倒だなぁ・・・
ってかオレのミスか・・・
- 322 名前:Name_Not_Found :03/08/27 15:52 ID:???
- >>320
御免御免。
- 323 名前:Name_Not_Found :03/08/27 15:52 ID:???
- >>321
h1, h2, {
〜
}
セレクタに改行があるからじゃないの?
- 324 名前:Name_Not_Found :03/08/27 15:53 ID:???
- なんか香ばしいのがいるな。
>>319
俺も最初ビックリしたよ。
IE標準に考えると駄目だねぇ。
- 325 名前:321 :03/08/27 15:54 ID:???
- >>323
h1, h2,でも駄目だったのです。
で
h1,h2だと大丈夫みたいっす。
お騒がせごめんなさい。
- 326 名前:325 :03/08/27 15:55 ID:???
- h1, h2,{color:red}
でも駄目だったのです。
に訂正です。
- 327 名前:Name_Not_Found :03/08/27 15:56 ID:???
- *,
{
display:none;
}
これでIEには見えないサイトが出来るわけか
- 328 名前:Name_Not_Found :03/08/27 15:57 ID:???
- 現実でヘコヘコばかりの劣等感満載の人って、こういう場所でしかストレス発散できないんだろうね。
悲しい現実が見えない人って可哀想。
- 329 名前:Name_Not_Found :03/08/27 15:57 ID:???
- つーか CSSのリファレンス読めよ
■レンタルサーバーの新躍動■
http://arigato3.net/
- 330 名前:Name_Not_Found :03/08/27 16:03 ID:???
- >>328
自己紹介おつ
- 331 名前:Name_Not_Found :03/08/27 16:04 ID:???
- >>328
( ゚д゚)
- 332 名前:Name_Not_Found :03/08/27 16:04 ID:???
- しかし、大暴れだな徳
- 333 名前:326 :03/08/27 16:13 ID:???
- 正常な流れに戻ってくだっさいです。
>>324
>IE標準に考えると駄目だねぇ。
思いしったです。
失礼しました。
- 334 名前:Name_Not_Found :03/08/27 19:33 ID:???
- 質問です。
_| ̄ ̄|_| ̄ ̄|_| ̄ ̄|_
このようなタブっぽいデザインを作るにはどうすればいいでしょうか?
<div style="border-style:solid; border-width:0px 0px 1px 0px">
<span style="border-style:solid; border-width:1px 0px 0px 0px">A</span>
<span style="border-style:solid; border-width:1px 0px 0px 0px">B</span>
<span style="border-style:solid; border-width:1px 0px 0px 0px">C</span>
</div>
だと下がずーっと続いてしまうのでなんとか解決したいのですが…。
ていうかspanにborderって使ってよかったですっけ?(汗
- 335 名前:Name_Not_Found :03/08/27 19:49 ID:???
- >>334
http://unraveled.com/projects/css_tabs/
参考になるかもね
- 336 名前:Name_Not_Found :03/08/27 20:42 ID:???
- >>318
floatだけでもなんとかなるんで・・・
まあいっかっと。
- 337 名前:Name_Not_Found :03/08/27 20:54 ID:???
- >>335
ありがとうございます解決できました。
border-bottom-colorを背景色に指定すればよかったんですね。
- 338 名前:Name_Not_Found :03/08/28 00:27 ID:???
- 宜しくお願いします。
<body>
<h1>●○●○●○●</h1>
<div class=box>
・・・・・・・・・
・・・・・・・・
・・・・・・・・・
</div>
</body>
の場合に、boxを600px指定でセンターに配置したいのですが、
ネスケだとうまく表示できません。
どのようにbodyで指定したら良いかご教授下さい。
宜しくお願いします。
- 339 名前:Name_Not_Found :03/08/28 00:33 ID:???
- 既出じゃねーの?
- 340 名前:Name_Not_Found :03/08/28 00:35 ID:???
- >>338
YABOを承知で言わせてもらうが、600px固定はあまり好ましくない。
好ましくないことやるんだったらテーブルでもええやん。どうせ好ましくナインだし。
- 341 名前:Name_Not_Found :03/08/28 00:39 ID:???
- >>338
ボックスのセンタリングならFAQだけど自分はどう書いたの?
>>340
CSSでやるのとテーブルでやるのは全然違うだろ
- 342 名前:Name_Not_Found :03/08/28 00:40 ID:???
- >>341
いや、cssで見栄えを、って意味が分かってるなら
左右のインデントええやん、ってのも判ってくれるかな、っておもて
- 343 名前:Name_Not_Found :03/08/28 00:58 ID:vZEzVG33
- 既出でしたか。すみません。
faq勉強して出直します。
サイトが趣味の物の製造工程を説明するような感じなので、
それほど文字数がなく、写真とか文字とかいろいろありまして、
boxで幅を固定しておいた方が楽かなと思ってです。
600pxじゃなくって、60%なら出来るのですが・・・・
明日にでもじっくり考えます。
- 344 名前:Name_Not_Found :03/08/28 01:02 ID:???
- >>343
60%なら、左右に20%ずつのマージンでええやん。
解像度が高いpcで若干左によっててもなんらおかしくないしね。
- 345 名前:338 :03/08/28 01:06 ID:???
- 344>>
そのとおり、%なら解るんです。
pxだとよくわからないんです。
- 346 名前:Name_Not_Found :03/08/28 01:18 ID:???
- div.box{
width : 600px;
text-align:left;
margin-left : auto;
margin-right : auto;
}
<body>
<h1>test</h1>
<div style="text-align:center;">
<div class="box">
ブロックレベル要素
</div>
</div>
</body>
これで一応IEでもNNでもセンタリングになるよ。
- 347 名前:Name_Not_Found :03/08/28 02:28 ID:???
- >>344
このひと凄い役立たず。
文句言いたいだけなんでしょうね。
だからろくに書き込み読んでない。
- 348 名前:Name_Not_Found :03/08/28 02:37 ID:???
- >>347
読んだ結果のコメントだよ。
よく読めばそれもわかる。
まあ、ヴァカには深遠な思想等汲み取れるはずもないが。
- 349 名前:Name_Not_Found :03/08/28 02:38 ID:???
- >>347
一丁前のことは回答してから言え。
煽り書き込みしかしないならお前も役立たず同然だ。
- 350 名前:Name_Not_Found :03/08/28 02:38 ID:???
- >>347
このひと凄い役立たず。
文句言いたいだけなんでしょうね。
だからろくに書き込み読んでない。
- 351 名前:Name_Not_Found :03/08/28 02:39 ID:???
- (´-`).。oO(>>347はテーブルレイアウトを勧められてお冠です。
- 352 名前:Name_Not_Found :03/08/28 03:14 ID:???
- 結局ご丁寧にソースを載せてくれた>>346はスルーですかお前
- 353 名前:Name_Not_Found :03/08/28 03:14 ID:???
- 寝る前の質問なのでレスは明け方になりますが・・・
position:absolute; を使ってBox(Divとか)を指定すると、そのBoxの底辺がブラウザの下にぴったり付くような感じになりますよね。
その場合marginが効かず、間隔を空けたくても空けられないんですが、どうしたら良いんでしょうか?