CSS初心者スレッド＝10th＝

このエントリーをはてなブックマークに追加
1 ：Name_Not_Found：
CSS初心者の方のための質問スレッドです。
具体的な記述方法がわからない方、基礎知識がない方はこちらでどうぞ。

※気のいい人だけが答えてくれますので、解答はまったり待ちましょう。

《関連スレ》
Webサイト制作初心者用質問スレ Part 224
http://hibari.2ch.net/test/read.cgi/hp/1301891537


《前スレ》
CSS初心者スレッド＝9th＝
http://hibari.2ch.net/test/read.cgi/hp/1287470663/

《過去スレ》
CSS初心者スレッド＝8th＝
http://hibari.2ch.net/test/read.cgi/hp/1273383771/
CSS初心者スレッド＝7th＝
http://pc11.2ch.net/test/read.cgi/hp/1251527427/
CSS初心者スレッド＝6th＝
http://pc11.2ch.net/test/read.cgi/hp/1234355194/
CSS初心者スレッド＝5th＝
http://pc11.2ch.net/test/read.cgi/hp/1228900036/
CSS初心者スレッド＝４ｔｈ＝
http://pc11.2ch.net/test/read.cgi/hp/1218200382/
CSS初心者スレッド＝3rd＝
http://pc11.2ch.net/test/read.cgi/hp/1212198165/
CSS初心者スレッド＝2nd＝
http://pc11.2ch.net/test/read.cgi/hp/1207202319/
CSS初心者スレッド＝1st＝
http://pc11.2ch.net/test/read.cgi/hp/1193327030/
2 ：Name_Not_Found：2011/05/27(金) 19:02:58.22 ID:u3eRIkd5
あ、立てれた。

ということで、前スレは残り少ないのでこちらで質問させてもらいます。
非常に恥ずかしい質問なんですが、外部CSSを一切読み込ませてない状況で
以下のようにしたとき、
<div style="background:#FFCC33;">
　<div style="margin-bottom:20px;">ABC</div>
</div>
<p>XYZ</p>
外側のdivの背景色（オレンジ色）が「ABC」の下に20px分伸びるのかと思ったらそうならず、
XYZの上に白いスペースが20px分できます。

これってこの挙動で正しかったでしょうか？　オレンジ部分が20px伸びるのかと考えていたんですが。
また、外側のDIVにpadding:1px 0px;を指定すると最初思っていたようにオレンジ部分が20px伸びます。
（XYZはオレンジの真下にくっつくように配置されます、当たり前ですが）

なぜpadding:1px 0px;を指定したけっか正常に（？）動くのかもわかりません。

この挙動は正しいのでしょうか？
おかしいとしたら他にCSSは使っていないのですが、どんな原因が考えられるでしょうか？
すみませんが誰かご意見お願いします
3 ：Name_Not_Found：2011/05/27(金) 20:34:12.44 ID:???
すみません、解決しました
マージン相殺って奴だったみたいです、恥ずかしい。はぁー
4 ：Name_Not_Found：2011/05/28(土) 15:00:13.49 ID:???
>>2-3

マージン相殺というのを今日初めて知りましたが、
CSSは何のメリットがあってそういう仕様にしているのでしょうか。
5 ：Name_Not_Found：2011/05/28(土) 23:54:28.57 ID:???
　下記を読むと書いて有るかも・・・

CSS1の仕様書（W3C勧告）
http://www.w3.org/pub/WWW/TR/REC-CSS1
CSS2の仕様書（W3C勧告）
http://www.w3.org/pub/WWW/TR/REC-CSS2
CSS1仕様書の日本語訳（どら猫本舗）
http://www.doraneko.org/webauth/css1/
Positioning（W3Cワーキングドラフト）

　とほほより転載　http://www.tohoho-web.com/css/basic.htm
http://www.w3.org/pub/WWW/TR/WD-positioning
6 ：Name_Not_Found：2011/05/28(土) 23:55:42.80 ID:???
あっ　ごめんにゃ・・・

Positioning（W3Cワーキングドラフト）
http://www.w3.org/pub/WWW/TR/WD-positioning
7 ：Name_Not_Found：2011/05/29(日) 00:14:47.31 ID:???
>>5
とほほ は内容もとほほだからオススメしない方がいいような。
8 ：Name_Not_Found：2011/05/29(日) 00:32:47.75 ID:???
仕様書はとほほと関係ないでしょ ? >7
9 ：Name_Not_Found：2011/05/31(火) 14:17:46.78 ID:???
10px * 10pxの範囲に
3px * 10pxの画像をrepeat-xした場合
12px表示されてはみ出るんでしょうか？
それとも画像が切れた感じで10px分になるんでしょうか？
10 ：Name_Not_Found：2011/05/31(火) 19:52:53.79 ID:???
やってみたらええやん
11 ：Name_Not_Found：2011/05/31(火) 19:55:43.81 ID:???
実際にやってみれば分かることを聞くな
12 ：Name_Not_Found：2011/05/31(火) 20:45:33.63 ID:???
きっと実行結果を見ても信用できないんだろ
筋金入りの他力本願ｗ
13 ：Name_Not_Found：2011/06/08(水) 16:52:53.33 ID:???
IE対応する場合ってIEのみCSSを分けるべきでしょうか？
14 ：Name_Not_Found：2011/06/08(水) 22:07:06.97 ID:f6ICMU0G
リンク付き画像のボーダーを一括で0にしたいのでググったら
a img { border:none} を書けばいいということはわかったのですが
どこに書いたらいいのかわかりません
<head></head>の中に書いたら、文字として出力されてしまいました。
解決策を教えてください。
15 ：Name_Not_Found：2011/06/08(水) 22:31:06.06 ID:???
>>14
ホームページ制作入門的な本を読む
16 ：Name_Not_Found：2011/06/09(木) 00:11:38.73 ID:???
>>13
分けない方がいい
17 ：Name_Not_Found：2011/06/10(金) 19:18:42.61 ID:???
http://10plate.blog44.fc2.com/blog-entry-229.htmlの
img { border-style:none; }を加えたいのですが
「スタイルシート末尾」とはどこになるのでしょうか？
一番下でいいのでしょうか？
18 ：Name_Not_Found：2011/06/10(金) 19:31:18.30 ID:???
<style type="text/css">
<!--
　　・
　　・
　　・
a img { border-style:none; }
-->
</style>

19 ：17：2011/06/10(金) 19:33:28.59 ID:???
>>18
すいません
自己可決しますたすた・・・
20 ：Name_Not_Found：2011/06/10(金) 19:35:17.08 ID:???
回答もらっときながら自己解決って失礼だな
形だけでも礼は言っとくもんだ
21 ：17：2011/06/10(金) 20:06:41.05 ID:???
はい
ありがとうございました
22 ：Name_Not_Found：2011/06/11(土) 11:32:02.85 ID:???
>>18
XHTMLでコメントアウトすんなｗ
23 ：Name_Not_Found：2011/06/11(土) 14:50:28.04 ID:???
全くだ。XHTMLならCDATAだろうが。
IEも対応するなら外部スタイルシートだろうが。
24 ：Name_Not_Found：2011/06/11(土) 19:35:57.76 ID:???
酷い回答だな
25 ：Name_Not_Found：2011/06/11(土) 23:15:58.36 ID:???
どの辺が酷い？
26 ：Name_Not_Found：2011/06/12(日) 05:04:28.79 ID:???
コメアウ
27 ：Name_Not_Found：2011/06/12(日) 05:21:18.52 ID:???
コメントアウトが適切な表現じゃないってこと？
28 ：Name_Not_Found：2011/06/12(日) 11:05:09.54 ID:???
それぐらいわかると思うが、普通はどう表現するんだ？
29 ：Name_Not_Found：2011/06/12(日) 12:26:28.28 ID:???
もうとっくに答えは出てるだろ
30 ：Name_Not_Found：2011/06/12(日) 12:42:59.23 ID:???
少なくとも>>22以降にはないな
31 ：Name_Not_Found：2011/06/12(日) 14:14:27.52 ID:???
またDoCoMoの話かい？
32 ：Name_Not_Found：2011/06/12(日) 15:19:55.43 ID:???
DoCoMoとか関係ないだろ
XHTMLならコメントにしたら動かん
33 ：Name_Not_Found：2011/06/12(日) 18:13:26.68 ID:???
えっ　?
34 ：Name_Not_Found：2011/06/12(日) 18:53:13.24 ID:???
この流れ何度目だろ
非似XHTMLなら動くから勘違いする人が多いんだよな
明確に文法違反なのに
35 ：Name_Not_Found：2011/06/12(日) 19:04:11.98 ID:???
わからない人は Content-Type application/xhtml+xml でぐぐるといい
36 ：Name_Not_Found：2011/06/12(日) 22:58:08.06 ID:???
ドコモはstyle要素を解釈できないって話
37 ：Name_Not_Found：2011/06/12(日) 23:10:49.71 ID:???
それはコメントの話と関係ない
38 ：Name_Not_Found：2011/06/12(日) 23:11:05.12 ID:???
>>35
サーバのヘッダにこれつけないと発生しないからねぇ。
39 ：Name_Not_Found：2011/06/13(月) 00:02:33.39 ID:???
コメントアウトってstyle要素解釈しないブラウザ向けのバッドノウハウじゃないの？

拡張子.xhtmlにしてローカルで開けば、FirefoxとかはXHTMLとして解釈してくれるっぽいよ
MIMEタイプxmlで実際に使うときは拡張子.htmlにしないと、IEでダウンロードされてしまうけど
40 ：Name_Not_Found：2011/06/13(月) 02:36:11.66 ID:???
>>38
動くことと仕様を守ることは話が別
text/html で動けばいいなら空要素を閉じなくていいし、終了タグを省略していいし、属性値をクオートでくくらなくていい。HTML と変わらない。
でもはれは XHTML にする意味がないだろ
41 ：Name_Not_Found：2011/06/13(月) 03:00:20.93 ID:???
>>38は、だから気付かない　って言ってるだけだと思うが
42 ：Name_Not_Found：2011/06/13(月) 14:15:17.95 ID:???
application/xhtml+xml では style要素の内容は #PCDATA、text/html では CDATA、
つまり、マークアップ区切り文字を認識するのかしないのか、違いがある。
ただ、XHTML+text/html の場合、どう考慮するべきかは難しい。
最終的にはブラウザの実装に合わせるしかないのが現状。

どうでもいいけど、XHTMLにする意味は何？
ドコモ対策のみ？
43 ：Name_Not_Found：2011/06/14(火) 01:30:40.05 ID:???
ドコモ対策ならXHTMLにしない方がいいだろ
44 ：Name_Not_Found：2011/06/14(火) 05:06:09.27 ID:???
iモードブラウザ1.0には、CSS無しで対応しろ、と？
ある意味納得。
45 ：38：2011/06/14(火) 06:14:49.74 ID:???
>>40
>>41の言ってるとおりです。
仕様を守らなくていいとかそういう意味じゃないっす。
46 ：40：2011/06/14(火) 20:57:09.47 ID:???
>>45
見当違いだったのか…、すまなかった
47 ：Name_Not_Found：2011/06/22(水) 20:35:30.25 ID:???
よく「W3C勧告に準拠」などと言われる一方で、CSSMANIA等にアップされてるサイトに対して
Web Develperで「CSSファイルの検証」を試みると、エラーがズラリと列挙されるサイトも
少ないないのですが、あまり重要視されていないということでしょうか？
48 ：Name_Not_Found：2011/06/22(水) 20:45:15.57 ID:???
>>47
重視しないサイトもあるとしか
それが多数派かどうかは知らないし、関係ない
49 ：Name_Not_Found：2011/06/23(木) 00:33:50.35 ID:???
多くのブラウザで表示させようとしてハックを使うと、バリデータは通らなくなったりする
50 ：Name_Not_Found：2011/06/23(木) 10:43:13.65 ID:???
横幅を1000pxで作る場合、以下のようなHTMLだったら
#box{width:1000px;}と単純に1000px指定するだけで問題ないですか？
もしboxにborder:1px solid #000000;を書く場合は#box{width:998px;}とborderの太さ分引くべきでしょうか？

<html>
<head>
</head>
<body>
<div id="box">
</div>
</body>
</html>
51 ：Name_Not_Found：2011/06/23(木) 11:47:09.16 ID:???
>>48
お前朝鮮人か？
句読点の位置がおかしいぞ。
52 ：Name_Not_Found：2011/06/23(木) 11:47:54.84 ID:???
>>51
２ちゃん初心者か？まあ肩の力抜けや
53 ：Name_Not_Found：2011/06/23(木) 13:21:15.52 ID:???
>>51
「1番好き」とか「第3者」とか「50歩100歩」よりはまだマシだよｗ
54 ：Name_Not_Found：2011/06/23(木) 19:45:44.12 ID:???
>>50
HTMLの準拠モードによって答えは違う。
55 ：Name_Not_Found：2011/06/23(木) 20:47:35.77 ID:???
54先生どもです
標準モードで作ってます
56 ：Name_Not_Found：2011/06/23(木) 21:53:53.15 ID:???
>>55
borderとmarginとpadding分は引く
57 ：Name_Not_Found：2011/06/23(木) 23:51:50.20 ID:???
質問です。
CSSで背景に画像を指定して、その画像が常に中央に来るようにしたい。
例えば横幅1000pxの画像を指定して、ブラウザを100pxに狭めても画像の中央が常に画面の中央に来るようにしたいと思っています。
この説明でわかるかな？説明が下手ですみませんがよろしくお願いします。
58 ：Name_Not_Found：2011/06/24(金) 01:39:22.48 ID:???
background-positionのこと？
59 ：Name_Not_Found：2011/06/24(金) 02:00:36.75 ID:???
>>57
敬語なのにバカにされてる感じがする
60 ：Name_Not_Found：2011/06/24(金) 02:06:06.17 ID:???
>>59
そう？
61 ：Name_Not_Found：2011/06/24(金) 07:10:09.17 ID:???
>>59
慇懃無礼って奴だな。
62 ：Name_Not_Found：2011/06/24(金) 08:21:13.01 ID:???
>>58
それと calc か
63 ：Name_Not_Found：2011/06/24(金) 09:54:13.97 ID:???
>>56
先生のゆうとおりにやってみます
ありがとうございます
64 ：Name_Not_Found：2011/06/24(金) 16:39:23.84 ID:???
質問
CSSで左側が四角で右側が三角のボックスを作りたい。

┌─
│　　＞
└─
こんな感じ
どうやったらいいですか？
65 ：Name_Not_Found：2011/06/24(金) 17:43:48.64 ID:???
制作会社に依頼したら出来ます
66 ：Nane_Not_Found：2011/06/24(金) 18:57:27.61 ID:???
文章主体のページで、ボディー内の本文に当る部分を#includeするようなことは
出来ないものでしょうか？
もし、できれば、管理しやすいように思うんですが。
インラインフレームじゃなくて
67 ：Name_Not_Found：2011/06/24(金) 19:24:19.48 ID:???
出来るよ
でもCSS関係ないよね
68 ：64：2011/06/24(金) 19:26:16.48 ID:???
>>65
2chでは難しいってことですか
ありがとうございました
69 ：Name_Not_Found：2011/06/24(金) 19:30:02.36 ID:???
そうですね
質問でなく制作依頼を引き受けてくれる人はいないので難しいですね
70 ：Name_Not_Found：2011/06/24(金) 19:50:27.73 ID:???
俺に作らせてよ
71 ：Name_Not_Found：2011/06/24(金) 20:58:47.52 ID:???
>>64
CSSの斜め線はborderの角を使うんだってさ
72 ：64：2011/06/24(金) 22:50:24.10 ID:???
>>70>>71
よろしくお願いします
一応やってみたけどこれが限界でした


/* CSS */
.togatta_kado {
background-color: #999999;
padding: 20px;
-moz-border-radius: 20px 30px 40px 50px / 30px 40px 50px 60px; /* Firefox用 */
-webkit-border-radius: 0px 40px 40px 0px / 0px 40px 40px 0px; /* Safari,Google Chrome用 */
-o-border-radius: 20px 30px 40px 50px / 30px 40px 50px 60px; /* Opera用 */
}

/* HTML */
<div class="togatta_kado">
<p>右だけ尖った角</p>
</div>
73 ：Name_Not_Found：2011/06/25(土) 01:13:36.51 ID:???
border-radiusに接頭辞付けんな
てか三角部分のCSSは？
74 ：Name_Not_Found：2011/06/26(日) 14:17:41.85 ID:???
::selection {
background: #ffb7b7;
}

::-moz-selection {
background: #ffb7b7;
}

このようにして、選択範囲の背景色を変更しようとしています。
が、これだと<input type="text">の入力値の選択範囲には適用されないようです。
<input type="text">にも適用するには、どうしたらいいでしょうか。
75 ：Name_Not_Found：2011/06/26(日) 19:30:14.21 ID:???
使っちゃあかん
76 ：74：2011/06/26(日) 21:01:55.04 ID:???
>>75
input要素の背景色を変更してはいけないということですか？
それとも-moz-selectionだけでなく、selectionもあまり使ってはいけないということなんでしょうか？
77 ：Name_Not_Found：2011/06/26(日) 22:09:44.93 ID:???
草案のセレクタだし、接頭辞ついてるし、>>74の通りブラウザごとに挙動違うし
早いと思う
78 ：Name_Not_Found：2011/06/26(日) 23:39:48.75 ID:???
デザインはオナニーじゃなくて思いやり
79 ：Name_Not_Found：2011/06/27(月) 23:07:53.77 ID:???
>>77
ありがとうございます。
ベース色が暗い色のページを閲覧する際、通常の選択色だととても見難く、解決策として見つけたのが>>74の方法でした。proxiomitronでスタイルを書き換えればいいと。初めに書いておくべきでした。すみません。

-moz-selectionをはずしてFirefoxで確認したところ、スタイルシートで云々しなくても背景が黒っぽいと選択範囲の色が反転色に変わってくれるようなので、今のところは::selectionのみを使うことにします。
あとinputの件はやっぱり無理ですかね？
80 ：Name_Not_Found：2011/06/28(火) 03:12:22.73 ID:AVodAWsP
floatレイアウトでサイドバーを付けてるページがあります。
下のようなイメージです。上下にヘッダ、フッタ(clear:both;)はありますが重要ではありません。

contents　　　　sidebar(幅固定)
　　↓　　　　　　　　↓
「　　　　　　　　　「
　　float:left;　　float:right
　　　　　　　　」　　　　　　」

contentsの中身が文字なら全く問題なくsidebarがサイドバーとして表示されるのですが、
contentsの画面の横幅を超える大きいテーブルだった場合に、サイドバーが右下部分に表示されてしまうようです。
<- 画面幅 ->
「
　　float:left;
　　　　　　　　」
　　　「
　　　float:right　←サイドバーがここに移動
　　　　　　　　」
これではサイドバーでなくフッタ右バーになってしまいます。
・コンテンツが文字列など場合はサイドバーが右端
・テーブルがある場合はサイドバーが画面からはみ出ても構わない
とかするうまい方法はあるでしょうか？
81 ：Name_Not_Found：2011/06/28(火) 03:46:33.77 ID:???
>>80
2つ目の問題がよく分からなかったけど…
サイドバーもfloat:leftにする。
一番いいのはテーブルがはみ出ないようにサイズ指定。
82 ：Name_Not_Found：2011/06/28(火) 06:00:01.95 ID:???
>>81
それだとサイドバーが下に行っちゃいませんか？

テーブルのサイズを小さくするのは無理です。
と、いうよりブラウザの横幅を小さくされたときにサイドバーが下に飛んでしまうのを何とかしたいというのが発端なので。
83 ：Name_Not_Found：2011/06/28(火) 06:22:43.66 ID:???
>>82
もう少し自分で工夫したら？
84 ：Name_Not_Found：2011/06/28(火) 22:19:35.04 ID:???
>>80
floatって単語の意味知ってるの？
85 ：Name_Not_Found：2011/06/28(火) 22:25:45.93 ID:???
浮く　浮かせる(´・ω・｀)
86 ：Name_Not_Found：2011/06/28(火) 23:46:51.25 ID:???
>>85
それを知ってたらどうすればいいかもう分かるよね！(^o^)v
87 ：Name_Not_Found：2011/06/28(火) 23:58:46.41 ID:???
いちごフロートを食べるん ? >>86
88 ：Name_Not_Found：2011/06/29(水) 00:46:57.37 ID:f5DOaIra
質問
UTF-8環境でアスキーアートを表示するための
font-family等の設定はどのようにすると良いでしょうか？
89 ：Name_Not_Found：2011/06/29(水) 15:01:03.98 ID:???
フロートって浮動小数点扱う時の型でしょ
90 ：Name_Not_Found：2011/06/29(水) 19:34:34.53 ID:???
ここで質問していいどうか分かりませんが、一応質問させて頂きます。
初心者でホームページ作成してて、
メニューのとこに小さい線がで来て、それを消したいんですが、
どう直しても消えません。
http://db.tt/EOITpCQ
スクリーンキャプチャで赤丸のとこ
http://db.tt/V9HK4IQ
CSS

#menu a menu a:linkのあたりのCSSが間違ってるでしょうか？
display:inline-block;をblockにすると、メニューの文字が一行ずつズレます。
91 ：Name_Not_Found：2011/06/29(水) 19:42:29.76 ID:???
質問するときにすぐ試せるようにhttp://cssdesk.com/みたいにすぐ確認できるようなとこに張ってもらえると俺は助かる
92 ：Name_Not_Found：2011/06/29(水) 19:45:35.18 ID:???
>>91
ありがとう。出直して来ます。
あとで教えて下さい！！
93 ：Name_Not_Found：2011/06/29(水) 20:53:20.82 ID:???
http://cssdesk.com/ERgqw

出来ました。助けて下さい。
94 ：Name_Not_Found：2011/06/29(水) 21:17:49.73 ID:???
http://phpspot.org/blog/archives/2011/06/csscss_prism.html
見出しタイトルの「CSSのアドレスを入力すると使われている色の一覧をプレビューできる「CSS Prism」」
の部分の文字列が何かかっこいいんですが
これはどうやってるのでしょうか？
95 ：Name_Not_Found：2011/06/29(水) 21:39:20.22 ID:???
>>94
っ 開発ツール
96 ：Name_Not_Found：2011/06/29(水) 22:57:13.82 ID:???
>>91
まだー？
97 ：94：2011/06/29(水) 23:06:30.11 ID:???
こっち沙希にお願いします
98 ：91：2011/06/29(水) 23:14:45.26 ID:???
>>96
うるせーはげ！

#menu a,#menu a:link,#menu a:visited {
font-size: 18px;
text-decoration: none;
color: #b3b3b3;
background-color: transparent;
width: 100px;
height: auto;
text-align: center;
padding: 2px 5px;
display: inline-block;

}
の部分を見直せ！
99 ：Name_Not_Found：2011/06/29(水) 23:21:25.14 ID:???
>>98
見直しても分からないんだよな。
ほぼ本の丸写しなのに、上手く行かなくて涙目。
display: inline-block; ここら辺間違ってると思うが、どうやって直せばいいのかしら
>>96
ありがとう
100 ：Name_Not_Found：2011/06/29(水) 23:52:22.08 ID:???
別ディレクトリに開発環境作ってガシガシやる ! 　って頭は無いのか ?
101 ：Name_Not_Found：2011/06/30(木) 00:47:37.61 ID:???
>>99
お前には無理
102 ：Name_Not_Found：2011/06/30(木) 01:51:09.90 ID:???
>>99
間違ってると思うなら、
色々自分で試すなり、
ググるなり何でしないのかしら。
一発で正解にたどり着こうとは思わないことだね。
103 ：Name_Not_Found：2011/06/30(木) 03:42:55.82 ID:???
色々試した結果で上手く行かないから、聞いてるんですけど………

CSSは挫折して一年ぶり再挑戦だが、やっぱ無理でした＼(^o^)／
iWebで我慢するわ
104 ：Name_Not_Found：2011/06/30(木) 05:29:57.33 ID:???
>>103
そうしてください
105 ：Name_Not_Found：2011/06/30(木) 10:33:05.08 ID:???
めでたしめでたし
106 ：103：2011/06/30(木) 14:53:02.25 ID:???
お前らに聞いたのが間違いだったw
HTMLが間違ってた。クソか
<span></span>消したら治った
107 ：Name_Not_Found：2011/06/30(木) 14:55:23.35 ID:???
負け犬の遠吠えうぜえ
108 ：Name_Not_Found：2011/06/30(木) 18:43:27.98 ID:???
100x100のサイズの透過png、２枚をズレが無く、端が完全に一致するように重ねたいです。
CSSでこれはできるのでしょうか？できるのであれば、教えていただけると助かります。
109 ：Name_Not_Found：2011/06/30(木) 19:49:06.09 ID:???
画像を重ねる方法はまずｇｇったの？
110 ：Name_Not_Found：2011/06/30(木) 19:53:31.71 ID:???
#hoge1 {background:url(hoge1.png); position:absolute; top:0px; left:0px; z-index:1; width:100px; height:100px;}
#hoge2 {background:url(hoge2.png); position:absolute; top:0px; left:0px; z-index:2; width:100px; height:100px;}
111 ：Name_Not_Found：2011/07/02(土) 00:40:13.47 ID:???
>>106
またおまえか
112 ：Name_Not_Found：2011/07/03(日) 22:04:34.21 ID:2Rq9N8sk
ちょっとお聞きしたいんですが、
mac版とwindows版のsafariやfirefoxはcssの解釈の仕方って違うんでしょうか？？
113 ：Name_Not_Found：2011/07/03(日) 22:20:40.30 ID:???
>>112
違いますん
114 ：Name_Not_Found：2011/07/03(日) 23:32:01.72 ID:???
>>113
やっぱり違うものなんですね
macで色々作ってみた後、winで確認したらie以外動作は一緒だったので
winでの検証は必要ないのかなーと思っちゃいました

ありがとうございました
115 ：Name_Not_Found：2011/07/05(火) 11:25:25.42 ID:???
ツイートするボタン、いいねボタン、Google+1ボタンをliタグで横に並べる場合、
ul,liのスタイルはどんな風に指定するのがいいのでしょうか？
display:inline-blockしましたが、ブラウザによっては縦に並んだり、横に余計な空白ができてしまい困ってます。
116 ：Name_Not_Found：2011/07/07(木) 23:28:33.24 ID:IO9NQol+
左にメニューバーA、B、Cがあって、それを押すとメインに画像（Aを押すとAが出る）
という構造にしたいんですが、「擬似フレーム」というのを
使うしかないんでしょうか？

その場合ベースhtmlをコピーして、貼る画像の数だけ増やすと
膨大になりそうなのですがいい方法はありませんか？

それともCSSの#mainでなんとかできますか？

お願いします。
117 ：Name_Not_Found：2011/07/08(金) 02:24:35.76 ID:???
っ ECMAScript or SSI or PHP や Ruby
118 ：Name_Not_Found：2011/07/08(金) 07:47:32.48 ID:???
CSSのプロパティ値に
・コンマ区切り font-family: A, B, C
・スペース区切り background-position: center center
・スラッシュ区切り font: 100%/150% normal
がありますが、使い分けルールや優先順位はありますか
119 ：Name_Not_Found：2011/07/08(金) 08:10:39.42 ID:???
>>118
プロパティごとに違うから仕様書を確認すべし
120 ：116：2011/07/08(金) 17:54:36.74 ID:???
>>117
ありがとうございます
121 ：Name_Not_Found：2011/07/08(金) 18:43:06.12 ID:???
ベンダープレフィックスについて各ベンダーごとの実装状況を知りたいのですが、
参考になるサイトはありますでしょうか。

例えば、あるプロパティについて
webkit系はベンダープレフィックスをつけてもつけなくても動作するが、
moz系はつけないとダメなどの情報が知りたいです。

よろしくおながいします
122 ：Name_Not_Found：2011/07/08(金) 21:47:12.49 ID:???
ベンダー接頭辞は実験的・先行実装を示すものだから
デメリットを理解した上で自分で探すものじゃないの
「つけないとダメ」という発想自体が何かおかしい
接頭辞つきのものは原則として「よく分からないなら使っちゃいけない」
123 ：Name_Not_Found：2011/07/08(金) 22:02:13.05 ID:???
いちおうこういうのもあるけど
http://peter.sh/experiments/vendor-prefixed-css-property-overview/

前、先行実装の-moz-opacityと正式実装のopacityの挙動が違うってことで
問題になってたような記憶があるようなないような

仕様自体がころころ変わって接頭辞付きの方が古い挙動になってることもあるから
俺も先行実装をむやみに使うのはすすめないぜ
124 ：Name_Not_Found：2011/07/09(土) 17:24:12.67 ID:aXaGahbP
なんでブラウザで統一しようとしないんだろうね
実際ブラウザがそれぞれ話し合って、cssについてひとつにまとめるべきでしょ
IEはもちろんだし、firefoxもいつまでもリンク画像に線つけるのやめて欲しい
125 ：Name_Not_Found：2011/07/09(土) 17:35:15.07 ID:???
>>124
ブラウザは一種の宗教だから、そこで統一は無理でしょ。
126 ：Name_Not_Found：2011/07/09(土) 19:00:41.76 ID:???
国際標準とか知らんの？
127 ：Name_Not_Found：2011/07/09(土) 19:58:50.22 ID:???
どうせ弱小サイトなんだから気にすんじゃねえよ
128 ：Name_Not_Found：2011/07/09(土) 20:31:41.90 ID:???
>>124
あのな、なんでもひとつにまとめちゃうとな、新しい技術の開発が無くなるか遅れるの。
いろんなものがあるから進歩すんのよ。

　多様性は進化の母　　な。
129 ：Name_Not_Found：2011/07/09(土) 20:55:20.91 ID:???
>>124
いや、一つにまとまってるからCSSがあるんでしょ
ドラフト仕様に過度な期待は禁物、っていうか仕様が変動する可能性あるんだからベンダープレフィックスつけるんで正しいよ
130 ：Name_Not_Found：2011/07/09(土) 22:05:18.99 ID:???
>>126
その標準とやらも人によって解釈が違うんだよ。
だから余計に宗教臭い。
131 ：Name_Not_Found：2011/07/10(日) 04:17:24.29 ID:???
IEとNNが拡張競争やった反省からベンダー接頭辞が追加されたんだから
むやみに接頭辞付きのを宣伝して他人を巻き込まないでほしい
あれはバグフィクスとか開発者の意見調整用、アルファ版だろ

NN4とIE6の亡霊に悩まされなかった奴だけで遊んでればいいのに
132 ：think49 ◆bKk/qcAKuM ：2011/07/10(日) 09:26:44.58 ID:???
ベンダー接頭辞の意義は CSS3 にあるので一読すると良いかと。
http://www.w3.org/TR/css3-syntax/#vendor-specific
一般に独自拡張は回避すべきですが、独自拡張が便利な状況(実験的, W3C Draft, Candidate Recommendation等)があります。
CSS3 の多くは Recommendation になっていないのでベンダー接頭辞はむしろ使うべきです。仕様にない新しい機能を実装し、CSS に推薦する場合も使うべきです。

opacity を規定する CSS Color Module Level 3 は 2011/06/07 に Recommendation になったのでベンダー接頭辞は不要ですが、Recommendation になる前の段階で実装していたならベンダー接頭辞をつけ、Recommendation になった時点でベンダー接頭辞を外すことになります。
「Recommendation になってるんだからベンダー接頭辞は外しなさいよ」って指摘なら理に適っていると思います。
http://www.w3.org/TR/css3-color/
133 ：Name_Not_Found：2011/07/10(日) 19:38:38.09 ID:???
2.1勧告されたの知らなかった
134 ：Name_Not_Found：2011/07/10(日) 23:33:52.73 ID:???
せっかくcss3でつくりあげたのに
w3cでは「いいんだけど・・・ふーむ」とか
言われちまいました
135 ：Name_Not_Found：2011/07/11(月) 00:41:06.58 ID:???
>>134
何のこと？
136 ：Name_Not_Found：2011/07/11(月) 01:57:54.99 ID:???
http://cssglobe.com/lab/easyslider1.7/01.html
このようなスライダーを作ろうとしています
スライダーの本体部分のul要素で" width:4176px; margin-left:2088px; "が設定されていますが
これはどういう意味なんでしょうか？
137 ：Name_Not_Found：2011/07/11(月) 03:00:59.68 ID:???
jQueryですね
昨今wordpressなんかで流行の
138 ：Name_Not_Found：2011/07/11(月) 03:15:54.80 ID:???
>>132
勧告済みの2.1ではなくドラフトの3を持ってきた意図はわからないが
利用者がベンダー接頭辞をむやみに使ったページを作っていたら
勧告後も接頭辞付きをサポートし続けないといけなくなるだろが

だからMozillaでも-webkit-をサポートすべきだとか
vendor-prefix considered harmfulとか言われてんだよ
本末転倒な話になりつつあんだよ
139 ：Name_Not_Found：2011/07/11(月) 06:21:48.95 ID:???
>>134
ふーむって何だよw
140 ：Name_Not_Found：2011/07/11(月) 11:33:47.16 ID:???
>>136
それスクリプト切ってると悲惨な表示になるけど・・・

Linux Fx5 NoScript
141 ：Name_Not_Found：2011/07/11(月) 19:56:04.14 ID:???
jQueryって何て発音してますか？
142 ：Name_Not_Found：2011/07/11(月) 19:57:12.95 ID:???
じぇーくえりー
143 ：Name_Not_Found：2011/07/11(月) 20:32:50.62 ID:???
>>138
通じあってない気がするなー
144 ：think49 ◆bKk/qcAKuM ：2011/07/11(月) 21:36:48.64 ID:???
>>138
私の意見は「ブラウザは何でベンダー接頭辞つけるの？初めから接頭辞なしで実装すればいいじゃない。」に対する意見であって、多分あなたの意見とそれほどには違いません。
145 ：121：2011/07/11(月) 21:54:03.51 ID:???
すみません。
質問したことをすっかり忘れていました。
教えていただいたサイト、参考にさせていただきます。
ご回答いただいた方ありがとうございました。
146 ：Name_Not_Found：2011/07/11(月) 23:03:16.75 ID:???
>>144
>>138
>ベンダー接頭辞はむしろ使うべきです

開発者と利用者のどっちが？つー部分で誤解を招きそうだったからだよ
CSS2.1には「Authors should avoid vendor-specific extensions」とあるんだから
147 ：Name_Not_Found：2011/07/11(月) 23:30:06.35 ID:???
わざわざCSS3のリンク入れてるんだからそれぐらいわかるだろ
148 ：Name_Not_Found：2011/07/11(月) 23:42:00.00 ID:???
数年前に少しかじって挫折したものです。
再度真剣にCSSを勉強しようと思うのですが、今からだとCSS3をしたほうがよいんでしょうか？
目標はある程度wpのテーマがいじれるです。
149 ：Name_Not_Found：2011/07/12(火) 23:04:05.48 ID:???
今からならCSS2とCSS3を両方。（現時点ではCSS3は半分以上のユーザが非対応なブラウザを使ってることに注意）
150 ：Name_Not_Found：2011/07/13(水) 00:05:52.32 ID:???
>>149
半々ですか…。
それならCSS2をみっちりやってから3にいく感じでやってみます。ありがとうございます
151 ：Name_Not_Found：2011/07/13(水) 07:40:29.71 ID:???
CSS3なんて覚えようとする必要ないよ
CSS2に関してもAptanaやDW使えば、プロパティ選ぶだけだから、判らなければ都度CSSの学習ページ見ればすぐ覚える
152 ：Name_Not_Found：2011/07/13(水) 16:07:50.08 ID:MknxO2g8
勧告された仕様のみを利用するという縛りについての質問です

先日、CSS 2.1 と CSS Color Module Level 3 が勧告されました
CSS 2.1 において、値に <color> が含まれているプロパティに対しては
RGBA color values 等を使っても問題ない。ということであっていますでしょうか
153 ：Name_Not_Found：2011/07/13(水) 21:57:35.01 ID:???
>>152
合ってません。
CSS3 で <color> を指定しているプロパティと組み合わせてください。
154 ：152：2011/07/13(水) 23:46:53.40 ID:MknxO2g8
>>153
ありがとうございます
CSS 2.1 の <color> とは別物として扱うのですね

現在 CSS3 は 一部だけが勧告されている状態ですが
その勧告の color: rgba(0, 0, 0, 0.5) などは現行の CSS 2.1 と一緒に使用しても良いのでしょうか
155 ：Name_Not_Found：2011/07/14(木) 08:23:22.84 ID:???
>>154
CSS2 と CSS3 を組み合わせる事は出来ないと思って下さい。
後方互換性はありますが、仕様は別です。
CSS2 で定義されている仕様は CSS3 で再定義されます。
156 ：Name_Not_Found：2011/07/14(木) 18:10:09.22 ID:???
フルCSSという表現がよくわからないのだが・・・
157 ：Name_Not_Found：2011/07/14(木) 21:09:29.56 ID:???
>>156
CSSを最大活用するぐらいの意味しかない
158 ：Name_Not_Found：2011/07/14(木) 21:09:29.95 ID:???
div厨のことじゃね？
159 ：Name_Not_Found：2011/07/14(木) 22:07:32.09 ID:???
<div class"2年A組み">春 </div>
160 ：Name_Not_Found：2011/07/14(木) 23:17:35.67 ID:???
>>159
整形式違反
161 ：Name_Not_Found：2011/07/16(土) 00:34:41.58 ID:???
解像度変更はありがたいわ
162 ：Name_Not_Found：2011/07/16(土) 23:12:50.77 ID:???
http://www.kanzaki.com/book/css/3-1-6.html#s3-1-6-2
主ブロックボックスの中に直接含まれるは「ブロックボックスのみ、もしくはインラインボックスのみ」
とありますが、こういう仕様だと何かいいことあるんでしょうか？
163 ：Name_Not_Found：2011/07/16(土) 23:24:47.45 ID:???
>>162
決めなかったらブラウザ毎に動作が異なるでしょ
164 ：Name_Not_Found：2011/07/16(土) 23:30:01.66 ID:???
>>162
どこが疑問なのかわからない
こんないい仕様があるよ、とかアイデアがあるの？
165 ：Name_Not_Found：2011/07/17(日) 21:38:01.02 ID:QiofV2a+
tableかdivを下側に表示したいんですが、vertical-alignでbottomを指定しても中身しか下に表示されません。
何か方法はないんでしょうかね？
166 ：Name_Not_Found：2011/07/17(日) 22:20:37.36 ID:???
エスパーすると、position使え
167 ：Name_Not_Found：2011/07/17(日) 22:50:33.90 ID:???
>>166
質問の内容から容易に想像できるし、そんなのエスパーとは言わんｗ
168 ：Name_Not_Found：2011/07/17(日) 23:57:42.24 ID:???
positionアブノーマルを
169 ：90：2011/07/19(火) 19:57:11.55 ID:???
久々また来ました。質問させて頂きます。
まだ一部分しか出来てません。。。

ttp://citywood.web.fc2.com/sites/works/bags01.html

<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">
<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css">

会社のwindows7のIE、スレプニルだとCSS全く反映されません。(プロクシあり)
自宅のMacのOSXで、safari、Chrome、Opera、iPadのSafari、iLunaで問題なく反映されます。
(iPadのOperaは反映されません)

iPad用にCSSしか作ってないのがいけないでしょうか？
170 ：Name_Not_Found：2011/07/19(火) 22:18:16.39 ID:KrhDgo6r
<div id="oya" style="margin-left:10px">
<div id="ko"></div>
</div>

koに親のmarginを無視させたいんですが何か良い方法ってあるんでしょうか？
171 ：Name_Not_Found：2011/07/19(火) 22:22:07.73 ID:???
>>170
<div id="oya" style="margin-left:10px">
<div id="ko" style="margin-left:-10px"></div>
</div>

これでいいか？
172 ：Name_Not_Found：2011/07/27(水) 18:24:57.41 ID:K8T/UJoQ
Ｗｅｂデザインの基金訓練を受講してる人　Part2
http://yuzuru.2ch.net/test/read.cgi/dame/1308059991

>>520

飛び込みはなかったけど、チラシ配りとか。
あとちょっとでも脈ありそうな家に通うとか。住宅営業だった。

WEBの営業となるとHPまだ持ってない企業にアタックして～
って感じなのかな
俺もぶっちゃけ独立考えてるからいろいろ想像してる。
173 ：Name_Not_Found：2011/07/28(木) 06:27:44.45 ID:YHbKR4W+
文字の長さが違う物を同じ幅にしたいのですがどうやればいいのでしょうか？

<div>
<span>ほげ</span><br>
<span>ほげほげほげほげほげほげ</span><br>
<span>This is a pen.</span>
</div>
↓↓↓

ほ　　　　　　　　　　　　　 　げ
ほげほげほげほげほげほげ
T　h　i　s 　i　s　 a　 p　e　n .

こんな感じになってほしいのですが。
174 ：Name_Not_Found：2011/07/28(木) 07:47:05.16 ID:???
>>173
CSSでは無理だと思うな
JSならできそうだけど面倒だな
175 ：Name_Not_Found：2011/07/28(木) 07:59:20.29 ID:???
>>172
勉強が足りんぞ

>>173
letter-spacing　を使いなさい
176 ：Name_Not_Found：2011/07/28(木) 08:02:24.49 ID:???
あっ ・・・
>>174
勉強が足りんぞ

　　俺は2ch修行が足りんな orz
177 ：Name_Not_Found：2011/07/28(木) 08:15:05.98 ID:???
>>176
文字間を均一にすることができる？
178 ：174：2011/07/28(木) 08:48:12.48 ID:???
>>175
出先だから仕様書は読めないんだが、widthやfont-sizeから文字間を計算して固定値を指定することは勿論出来る
だがそんな面倒な作業は現実的でないから出来ないといった
面倒な作業をJSに任せればコーディング以外は楽になる
CSSで簡単な方法があるなら申し訳ない
179 ：Name_Not_Found：2011/07/28(木) 08:57:27.27 ID:???
500px内に収めたい→文字数カウント→500/文字数 pxのletter-spacingを指定
ならわかるけど
letter-spacingは1文字の幅を指定するものだから
単純に20px指定した場合>>173の例だと上から順に40px 240px 280pxになる
つまりletter-spacingは解決策ではない
180 ：Name_Not_Found：2011/07/28(木) 12:24:42.03 ID:???
letter-spacing は1文字の幅じゃなくて、1文字ごとの余白じゃないの？
181 ：Name_Not_Found：2011/07/28(木) 12:50:37.07 ID:???
均等割り付けしたいように見えるけど、CSS3のtext-justify使わないと難しいんじゃないかな
182 ：Name_Not_Found：2011/07/28(木) 13:37:45.66 ID:???
>>178-179
やってみてから言おうな
183 ：Name_Not_Found：2011/07/28(木) 13:52:23.92 ID:???
上から目線もほどほどに
184 ：Name_Not_Found：2011/07/28(木) 13:53:13.77 ID:???
>>173
なげーうんこしてねえで↓にしろ
先ずはとらいあんどえらーで勉強すろ

<div>
<p style="letter-spacing:**px;">ほげ</p>
<p style="letter-spacing:**px;">ほげほげほげほげほげほげ</p>
<p style="letter-spacing:**px;">This is a pen.</p>
</div>
185 ：Name_Not_Found：2011/07/28(木) 14:22:51.08 ID:???
text-justify: *-all-lines みたいな値は草案に無いけど
正式に勧告されたとして、強制改行が入ってる文章の均等割り付けって出来るんだろうか
186 ：Name_Not_Found：2011/07/28(木) 18:09:56.94 ID:???
pxじゃなくてemで指定するほうが環境に優しいと思います
187 ：Name_Not_Found：2011/07/28(木) 18:36:12.57 ID:???
つうか>>184は全然均等にならんぞ
188 ：Name_Not_Found：2011/07/28(木) 18:54:48.97 ID:???
**px これ変えたらなったな
189 ：Name_Not_Found：2011/07/28(木) 18:56:06.65 ID:???
ほ　　　　　　　　　　　　　 　げ
ほげほげほげほげほげほげ
T　h　i　s 　i　s　 a　 p　e　n .

こんなふうになったよ
190 ：Name_Not_Found：2011/07/28(木) 19:16:08.38 ID:???
>>184はブラウザ毎に最適値が変わるけど
191 ：Name_Not_Found：2011/07/28(木) 20:19:34.88 ID:???
HTMLに依存するCSSが使いやすいわけがない
192 ：Name_Not_Found：2011/07/28(木) 21:28:43.85 ID:???
>>184
ウィンドウサイズをトライアンドエラーする訓練ですね、わかります
193 ：Name_Not_Found：2011/07/28(木) 21:53:02.25 ID:???
>>192
今どきそんな物言いするのは情弱の田舎者だけ
194 ：Name_Not_Found：2011/07/29(金) 01:30:06.07 ID:???
もしかして全部同じ数値じゃなくて個別に文字数数えて指定しろとかいうオチ？
195 ：Name_Not_Found：2011/07/29(金) 04:43:59.72 ID:???
* が何を意味するか知らない奴がいたのか・・・
196 ：Name_Not_Found：2011/07/29(金) 04:55:57.40 ID:???
いや俺プログラマーですし
正規表現だってバリバリ書きますよ
動くコードちょうだいよ
197 ：Name_Not_Found：2011/07/29(金) 05:11:35.27 ID:???
プログラマならなおさら**pxと書かれたものが同じ数値とは思わんはずだが ?
198 ：Name_Not_Found：2011/07/29(金) 05:17:27.25 ID:???
え？なんで？
それだけで違う数値なんてわからねえよｗｗ
なんでもいいってことは全部同じでもいいってことだぞ
199 ：Name_Not_Found：2011/07/29(金) 05:25:50.11 ID:???
同じで駄目なら変えてみるってのが人間の常識だよ。
200 ：Name_Not_Found：2011/07/29(金) 05:39:45.73 ID:???
答になってねーｗｗ
結局個別に指定する必要があるならJavaScriptでやれが親切な答えだったな
201 ：Name_Not_Found：2011/07/29(金) 06:39:18.07 ID:???
>>193
わかってないな
ウィンドウサイズが変われば横幅も変化するだろ
202 ：193：2011/07/29(金) 09:33:15.31 ID:???
>>201
白痴かお前は。
俺が言ってるのは後半の9文字のことだ。
203 ：Name_Not_Found：2011/07/29(金) 12:54:22.76 ID:???
言い方一つで情報弱者ってわかるものなの？
204 ：Name_Not_Found：2011/07/29(金) 12:54:35.63 ID:???
>>189はそれぞれの文字の幅を算出して合計したら、ってこと？
205 ：Name_Not_Found：2011/07/29(金) 12:57:35.00 ID:???
俺も>>189のソースを見たいわ
206 ：Name_Not_Found：2011/07/29(金) 14:02:29.18 ID:???
ここは手取り足取りスレかいな・・・
207 ：Name_Not_Found：2011/07/29(金) 14:20:27.39 ID:???
できたっていってソースを出し惜しみする理由がわからないわ
208 ：Name_Not_Found：2011/07/29(金) 17:58:10.22 ID:???
>>184
これはJavaScript使って文字数計算したら完璧か？
209 ：Name_Not_Found：2011/07/29(金) 21:48:37.67 ID:???
ヒントを出したつもりなんだろうが、そのヒントが的外れだからなー
210 ：Name_Not_Found：2011/07/30(土) 01:14:14.31 ID:???
別個に指定するのがめんどくさかったから聞いたんだろうにね
211 ：Name_Not_Found：2011/07/30(土) 08:02:48.26 ID:???
ところで、質問主は逃亡かい ?
212 ：Name_Not_Found：2011/07/30(土) 08:21:18.57 ID:???
こんな流れじゃ逃亡もするわな
213 ：Name_Not_Found：2011/07/31(日) 08:32:24.63 ID:???
聞きたいことくらいちゃんと説明できないのか
214 ：Name_Not_Found：2011/07/31(日) 08:46:27.51 ID:???
>>173見て理解できないならリアル池沼なんじゃないかと思う
215 ：Name_Not_Found：2011/07/31(日) 14:29:27.57 ID:???
（親要素の横幅　－　文字列の横幅）　÷　文字数
を letter-spacing に指定すればいいんかな
216 ：think49 ◆bKk/qcAKuM ：2011/07/31(日) 16:13:58.32 ID:???
string-length (文字数) とすれば、以下のように。

(width - padding-left - padding-right - font-size * string-length) / string-length - 1

CSS のみで定義するなら全ての単位を合わせる必要があります。
JavaScript なら getComputedStyle を使用できるので CSS で指定する単位を気にする必要がありません。
(text-indent も 0 にリセットする必要がありますね。)
http://hp.vector.co.jp/authors/VA022006/css/box.html#introduction-box
http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSview-getComputedStyle

ちなみに、自動改行しないことが前提となります。
JavaScript なら window.onresize のタイミングで再計算させることが可能ですが、筋のいい方法とは思いません。
217 ：think49 ◆bKk/qcAKuM ：2011/07/31(日) 16:29:55.97 ID:???
失礼。>>216の計算式を訂正します。

(width - padding-left - padding-right - font-size * string-length) / (string-length - 1)

# 蛇足。
CSS Text Level 3 の text-justify プロパティは >>173 が求める機能に近いですが、単語単位で均等割付してしまいます。
http://jsfiddle.net/UEjkm/1/
全ての文字を半角スペースで間隔を開ければ期待通りに動作しますが…。
http://jsfiddle.net/UEjkm/3/
218 ：Name_Not_Found：2011/07/31(日) 16:33:24.95 ID:???
その計算式って固定幅フォントが前提じゃない
219 ：think49 ◆bKk/qcAKuM ：2011/07/31(日) 16:55:34.71 ID:???
>>218
CSS のみで実装するならその通りです。基準となる部分全てを固定値で指定しなければなりません。font-size を利用する都合上、固定値を使わざるを得ないので…。
JavaScript の場合は getComputedStyle で取得する単位のデファクトスタンダード(確か実装依存)が px なので固定値でなくても良いです。

>>216でも書きましたが、私は筋のいい方法とは思ってません。Webページの利点を相殺してますからね…。
text-justify と JavaScript を組み合わせる方がまだ現実的だと思います。
220 ：Name_Not_Found：2011/07/31(日) 17:07:54.03 ID:???
強制改行無しなら、text-justify: distribute とかで出来るんじゃないかな
http://www.w3.org/TR/css3-text/#text-justify

>>217の後者（半角スペース挟み）って、IEの互換表示でしか機能しないんじゃない
221 ：think49 ◆bKk/qcAKuM ：2011/07/31(日) 17:07:58.44 ID:???
>>218
あ、プロポーショナルフォントのことですね。すみません誤読です。
プロポーショナルフォントの幅計算は無理なので letter-spacing を使用するなら固定幅フォントを使うしかないんじゃないでしょうか。
目測でトライアンドエラーするのはあまりにも…。
222 ：220：2011/07/31(日) 17:11:00.02 ID:???
あ、削除された値使ってたのか
ごめん何か勘違いしてた
223 ：Name_Not_Found：2011/07/31(日) 17:19:52.36 ID:???
*-all-linesがなくなった？以上、JavaScriptでこんなんするしか無いんじゃないかな
わからんけど

http://jsfiddle.net/MwxG6/

・HTML
>>173

・CSS
div{
width: auto;
float: left;
}
span{
display: inline-block;
}

・JavaScript
var parent = document.getElementsByTagName('div')[0];
var parentWidth = parseInt(document.defaultView.getComputedStyle(parent, '').width);
var lines = parent.getElementsByTagName('span');
for(var i = 0; i < lines.length; i++){
var stringWidth = parseInt(document.defaultView.getComputedStyle(lines[i], '').width);
var stringLength = lines[i].firstChild.length;
lines[i].style.letterSpacing = (parentWidth - stringWidth) / (stringLength - 1) + 'px';
}
224 ：Name_Not_Found：2011/07/31(日) 17:23:32.34 ID:???
最終行での（強制改行ありの文章での）均等割り付けって
使い道なさそうだから消されたんかな？
225 ：think49 ◆bKk/qcAKuM ：2011/07/31(日) 17:24:10.50 ID:???
>>220,222
ああ、いや私も distribute-all-lines が IE の独自拡張と気がついてませんでした。
http://msdn.microsoft.com/ja-jp/library/gg721783%28v=expression.40%29.aspx
>>217は IE8 の標準準拠モードで動作確認済みですが、CSS3 的には distribute-all-lines を distribute に置き換えるべきですね。
distribute を実装しているブラウザがないので将来に期待かな。(GC12, Fx4, Op11.50, IE8 でNG)
http://msdn.microsoft.com/ja-jp/library/gg721783%28v=expression.40%29.aspx
http://jsfiddle.net/UEjkm/4/
http://jsfiddle.net/UEjkm/5/
226 ：Name_Not_Found：2011/07/31(日) 17:29:56.26 ID:???
>>225
もう限界みたいだな。
これ以上ボロ出さんうちに、そろそろ引っ込んだ方がいい。
227 ：Name_Not_Found：2011/07/31(日) 17:34:54.12 ID:???
限界？
228 ：Name_Not_Found：2011/07/31(日) 17:38:08.00 ID:???
>>223
さかのぼってみたけど*-all-linesはもともとないみたい
229 ：220：2011/07/31(日) 17:38:42.02 ID:???
削除じゃなくて独自拡張か
昔のCSS3草案にはあったと勘違いしてた
重ね重ねごめんなさい
230 ：Name_Not_Found：2011/07/31(日) 17:52:11.89 ID:???
いろいろ勉強になった
失敗を恐れず積極的に書き込んでくれると嬉しいな
231 ： 忍法帖【Lv=3,xxxP】 ：2011/08/01(月) 18:16:30.29 ID:???
スレの趣旨から出された課題に対して、例え現実的でなくてもなんとかCSSで解決というのは分かる
しかし、ここで出された回答が表現する上で唯一の手段、正解であると思ってしまうのは非常に危険だと思うし、質問者にもよろしくないと思う
何もすべてCSSで片付けなくてもいいと思うから敢えて言う

画像にしろ
232 ：Name_Not_Found：2011/08/01(月) 18:43:36.48 ID:???
　　　　 ＿＿_
　　　／|∧_∧|
　　　||. (･ω･´| 話は聞いた！
　　　||oと.　 Ｕ|
　　　||　|（__）Ｊ|
　　　||／彡￣ ｶﾞﾁｬ
233 ：Name_Not_Found：2011/08/01(月) 22:05:26.97 ID:aa6NNPYw
位置指定をしてなくてブラウザに配置を任せてる<divid="a">があって、
その<div id="a">に<div id="b">を全く同じ位置、大きさで重ねたいんだけど
どうしたらいい？

JavaScriptで<div id="a">要素取得してtopとかhightを<div id="b">代入しようとしたけど、値はautoだった。
234 ：Name_Not_Found：2011/08/01(月) 22:24:54.44 ID:???
aにabsolute指定してからtopとか取ればいいんじゃね
235 ：Name_Not_Found：2011/08/02(火) 12:21:04.55 ID:???
http://omt.quu.cc/
236 ：Name_Not_Found：2011/08/02(火) 19:26:57.06 ID:NeoNa2dH
<div id="a">にabsolute指定すると表示が崩れちゃう
237 ：Name_Not_Found：2011/08/02(火) 19:38:15.10 ID:???
offsetTop使えば
238 ：Name_Not_Found：2011/08/02(火) 23:35:11.46 ID:UYYP3zLF
質問

divで作ったボックスの中にformのinputタグを入れて
それを縦方向で中央に揃えたいと思いvertical-align:middleを設定しても効きません。
こういう場合どうやって縦方向中央に揃えるのでしょうか？
239 ：233：2011/08/02(火) 23:42:20.56 ID:???
<div id="a">の中に<div id="b">を入れて
position: relative; を指定してtop, leftを相対位置で調節したらできた

>>238
ボックスの高さをline-heightに設定してみるとかは？

240 ：Name_Not_Found：2011/08/03(水) 01:19:02.57 ID:???
>>239
行の高さなのに
241 ：238：2011/08/03(水) 01:21:56.58 ID:???
>>239
できました。ありがとう。
line-heightは必要なかったです。
242 ：Name_Not_Found：2011/08/03(水) 09:28:45.56 ID:???
twitterの背景画像はどうやって設定されてるのでしょうか？
ページを開いてurlでgrepしてひたすらクリックしても関係ない画像ばかり表示されてしまいました
243 ：Name_Not_Found：2011/08/03(水) 09:39:58.56 ID:???
>>242
JavaScriptで書き出してるっぽいな
DOMツリーをみればstyle要素の中にあることがわかる
244 ：Name_Not_Found：2011/08/03(水) 12:07:04.73 ID:???
http://userstyles.org/style_screenshots/18192_after.png
液晶のバックライトが強く目が疲れやすいのでこのような配色にしているのですが
全てのテキストカラーを薄灰色にしてしまうため、例えば通販サイトの「在庫なし」といった
赤文字に気付かずに進めてしまったといった事があります。

それで黒い文字だけをグレーに変更し、それ以外の色はそのままで表示させるには
どのような記述にしたらいいのでしょうか？

今のcssではこのように一括で置き換えるようになっています。
body,span,div,table,tr,th,td,ul,li,a,h1,h2,h3,h4,h5,h6,dd,dt,dl,p,fieldset,form {
background-color:#000!important;
border-color:#222!important;
-webkit-box-shadow:none!important;
color:#999!important;
}
245 ：Name_Not_Found：2011/08/03(水) 13:20:38.99 ID:???
その前に液晶の輝度落とせばいいんでね ?
246 ：Name_Not_Found：2011/08/03(水) 13:32:42.54 ID:???
あ、すみません。モニタ輝度は最低でradeon catalyst CCCでも明るさを下げており
如意スクリーンという、モニタに半透明の黒いフィルタを掛けて輝度を落とすソフトも時には併用してるという状態なんです・・・
247 ：Name_Not_Found：2011/08/03(水) 16:26:07.61 ID:G00vZZBp
①TABLEタグ
<table width="950">
<tr>
<td width="200"></td>
<td align="center"><img src="image.jpg" /></td>
<td width="200">hoge</td>
</tr>
</table>

②CSS
<div style="float:left; width:200px;"></div>
<div style="float:left; width:550px; text-align:center;"><img src="image.jpg" /></div>
<div style="float:left; width:200px;">hoge</div>

①のTABLEタグを②のCSSに置き換えたいと思っています。
しかし最初のdivが空のため？width:200pxが効きません。
どうしたら良いでしょうか？よろしくお願いします。
248 ：Name_Not_Found：2011/08/03(水) 17:08:09.22 ID:???
>>246
部屋の照明をもっと明るくしろ
249 ：Name_Not_Found：2011/08/03(水) 17:09:11.70 ID:???
>>246
虹彩炎かも？
250 ：Name_Not_Found：2011/08/03(水) 17:23:50.11 ID:???
>>244
ユーザCSSでは無理だからユーザJSを使うしかないと思う
251 ：Name_Not_Found：2011/08/03(水) 18:03:28.74 ID:???
>>247
margin
252 ：Name_Not_Found：2011/08/03(水) 18:40:35.50 ID:???
>>250
text-color:black {color: #222} みたいな指定法でもあるのかと思っていました。
無理でしたか、なるほど。
javascriptについて調べてみますね、どうもありがとうございました。
253 ：Name_Not_Found：2011/08/03(水) 21:12:16.34 ID:???
かれこれ1時間半ほど悩んで解決しないのでお願いします。

HTMLが
<h1><a href="../index.html"><img src="../images/logo.gif" alt="xxx" width="150" height="40" id="logo" /></a></h1>

これで場所指定してて
#header #logo {
position: absolute;
left: 20px;
top: 20px;
}

ロゴなのですが、これをロールオーバーで違う画像を表示させたいです。
#header #logo a:hover とか色々試しても全然ダメで。
どうかよろしくお願いいたします。
254 ：Name_Not_Found：2011/08/03(水) 22:59:52.61 ID:???
IEの禁則処理を禁止する方法はないでしょうか？
line-breakを無効にしたいのですが。
255 ：Name_Not_Found：2011/08/04(木) 09:53:38.79 ID:???
>>253
ロゴを画像じゃなく背景にしないとa:hoverで画像は切り替わらないです。
それかjavascriptで画像切り替え。
256 ：Name_Not_Found：2011/08/04(木) 10:18:06.00 ID:???
>>254
word-break
257 ：Name_Not_Found：2011/08/04(木) 12:42:52.46 ID:???
>>255
なるほど！なんとなくわかりました。
ちょっとやってみます。
ありがとうございました。
258 ：Name_Not_Found：2011/08/06(土) 01:05:05.24 ID:jg7MGe1B
a { color:#000000; }
a:hover { color:#ff0000; }

これをタグのstyle=""に直接書くにはどうしたらいいでしょうか？
<a href="a.html" style="ここに直接書きたいです">
259 ：Name_Not_Found：2011/08/06(土) 06:17:32.17 ID:???
>>258
ちょちょちょ
どゆこと?

ぐぐってみたけど答え見付からず…

それと逆に質問なんだけど
<a href="###" style="ココに書く理由">ほげほげ</a>
ってのを教えてほしいです
一箇所だけ色を目立たせたい!ってならclassでイイやんと思うんよ
260 ：Name_Not_Found：2011/08/06(土) 06:57:21.94 ID:???
:hoverをstyleタグで使いたいってことか？

aタグに直接style=""で:hoverをしたいしたい - HTML - 教えて！goo
http://oshiete.goo.ne.jp/qa/2170402.html

結論から言うと「できない」けどこのリンクに書いてあるように代替案はある
classタグを使ってCSSを参照するか、JavaScriptになるがonmouseoverとonmouseoutで対応する手もある
261 ：Name_Not_Found：2011/08/06(土) 11:15:48.74 ID:???
>>260
結論はそれでいいけどclassタグはないよ
class属性ならあるけど
262 ：Name_Not_Found：2011/08/06(土) 13:00:18.05 ID:???
http://www.geocities.jp/horisappu2005/tt.html
IEだとちゃんと表示されるのに
Firefox、Chrome、Operaだと崩れてしまう

みんなちゃんと表示させる方法ありませんか？
263 ：Name_Not_Found：2011/08/06(土) 13:27:15.41 ID:UkfT4Fl8
>>262

ul,li{margin:0;padding:0;}

#link li {
list-style-type:none;
float:left;
}

#link li a {
display:block;
text-decoration:none;
padding:10px;
width:200px;
color:#000;
}

#link li a:hover {
background:#cccccc;
}
264 ：Name_Not_Found：2011/08/06(土) 18:28:50.26 ID:???
ありがとうございます
ホームページビルダーで作るとどうしても
IE以外のブラウザで崩れてしまうんですよね
265 ：Name_Not_Found：2011/08/06(土) 18:34:26.85 ID:UkfT4Fl8
>>264
ビルダーだからってことは無いと思うぞ。
(X)HTMLとCSS理解してれば、エディタやツールなんて自分に合ったもの使えば良いし、
分かってなけりゃ何使ったって躓くことになる。
266 ：Name_Not_Found：2011/08/06(土) 18:48:32.09 ID:???
あれってビルダーで作ったやつなの?
liが閉じてないしcenter使いまくり
シロートな僕が手打ちしたのより酷くてびっくりしたよ
267 ：Name_Not_Found：2011/08/06(土) 18:52:22.32 ID:???
>>267
確認画面でプレビューするとき元の画像が90度回転して表示されてしまいます
元は縦長だった画像が横回転して横長画像として表示されてしまいます
何が原因でしょうか？　何度も質問してすみません
268 ：Name_Not_Found：2011/08/06(土) 18:52:36.72 ID:???
>>264
ビルダーのプレビュー画面を見て作るんじゃなくて作った後、各種ブラウザで開いて確認するんだよ
面倒だと思うかもしれないが、皆そうしてる
269 ：Name_Not_Found：2011/08/06(土) 18:53:22.63 ID:???
>>267
おいアンカーがループしてるぞ
270 ：Name_Not_Found：2011/08/06(土) 18:56:10.21 ID:UkfT4Fl8
>>267
自問自答するのかｗ
271 ：Name_Not_Found：2011/08/06(土) 18:57:01.35 ID:???
>>269-270
http://hibari.2ch.net/test/read.cgi/php/1311803617/268n
272 ：Name_Not_Found：2011/08/06(土) 19:00:45.83 ID:UkfT4Fl8
釣られちまったわｗ
273 ：267：2011/08/06(土) 19:08:37.68 ID:???
白状すると投稿欄にキャッシュが残っていて誤って投稿した
お騒がせして済まない
274 ：Name_Not_Found：2011/08/07(日) 18:17:21.27 ID:pI4wFMsj
http://39kn.com/2009/04/08/1610/
上記ページのDEMO-B「Horizontal Accordion」の複製を1ページ内に縦に２段並べたいのですが巧くゆきません。
（このページの「DEMO-A」「DEMO-B」の様な状態です。）※複製した下段が動作しません。
また上段・下段でスライド方向を逆にしたいと考えています。
以上2点、HTML及びCSSの書き方をご教示願います。
275 ：Name_Not_Found：2011/08/07(日) 19:11:23.49 ID:???
断る !
そこに訊け !
276 ：Name_Not_Found：2011/08/07(日) 19:14:04.07 ID:???
ビクンビクンリストはウザいだけだから止めといたが吉
277 ：Name_Not_Found：2011/08/11(木) 23:23:39.92 ID:???
CSSファイルを別に用意したページを作る際に
サイト全体でその一カ所しか設置しない部品（画像など）の
位置情報等をわざわざCSS側に記述する事は
なにかメリットはあるんでしょうか？

HTMLソース自体はすっきりするかもしれないですが
後々修正するときに見辛い様な気がしてます。
278 ：Name_Not_Found：2011/08/11(木) 23:50:05.42 ID:???
デザインはCSS側に分離するもんです
使用頻度とか関係ないんです
279 ：Name_Not_Found：2011/08/12(金) 02:44:41.37 ID:???
サイト全体に対して
一箇所しか使わないけど画像って事は
そのページの内容に関わる事なのかな?
だったらHTMLに直接でも良いはず
>>277さんが言う様に
デザインだけならcssに書くべきかもね
280 ：Name_Not_Found：2011/08/12(金) 06:13:41.75 ID:???
>>277
絶対にその一箇所だけなら、html内にcssを書くのも有り。
281 ：Name_Not_Found：2011/08/12(金) 12:37:11.96 ID:???
別に効率良く別ファイルにできるだけであって、
>>277がやりやすいようにすればいい
全部のファイルにcssをコピペするのでも間違いではない。
１カ所だけのために別ファイルにcssを書くのも間違いではない。

ただ、手間とか見通しとか考えてやっていくと自然と>>280に形に最終なるとは思うけど。
好きなようにやってれば自然とどれが楽かわかってくる
282 ：Name_Not_Found：2011/08/12(金) 19:42:29.74 ID:???
ルールとしてはHTMLにデザインを含むべきではない
デザインをウリとしてるなら
ドキュメントの一部だから含んでも良いと思う
283 ：Name_Not_Found：2011/08/12(金) 21:04:15.66 ID:???
なんか勘違いしてる人がいるみたいだけどstyle要素の内容もCSSだよ
外部化とスタイル分離を混同してる
284 ：Name_Not_Found：2011/08/12(金) 22:37:13.90 ID:???
夏だからなぁ・・・
285 ：Name_Not_Found：2011/08/12(金) 23:32:58.71 ID:???
style要素の話誰かした？
286 ：Name_Not_Found：2011/08/13(土) 00:09:04.27 ID:???
数千ページの大規模サイトじゃなければ
外部化する必要なんてない
ぶっちゃけどっちでも良い
287 ：Name_Not_Found：2011/08/13(土) 01:49:08.22 ID:???
>>286
大規模サイトならむしろ出来る限り統合するだろ
288 ：Name_Not_Found：2011/08/13(土) 03:48:06.53 ID:???
>>282
style要素使えばいいだけでしょ。
289 ：Name_Not_Found：2011/08/13(土) 05:23:47.04 ID:???
>>282
style要素ならわからないでも無いですが
どうしても画像でオシャレな感じにしたいとなると…
あぁそうか
画像もstyleで指定できるのですね
古い思考なのでimg使いそうになる
290 ：Name_Not_Found：2011/08/13(土) 08:33:04.55 ID:???
CSS：全体
style：個別
291 ：Name_Not_Found：2011/08/13(土) 09:35:53.60 ID:???
？
292 ：Name_Not_Found：2011/08/13(土) 10:59:22.35 ID:???

　　　@@@@@　 ／￣￣￣￣￣￣￣￣￣￣￣￣
　　　(´･ω･`@　＜　全然解ってないのね～
　　　┳⊂　）　 ＼＿＿＿＿＿＿＿＿＿＿＿＿
　　[[[[|凵ノ⊃
　　　◎Ｕ□◎　＝３　ｷｺｷｺｷｺ
293 ：Name_Not_Found：2011/08/13(土) 11:14:06.63 ID:???
CSS = Cascading Style Sheets
全体とか個別とか関係ないただの名前
294 ：Name_Not_Found：2011/08/13(土) 17:59:42.26 ID:???
>>289
前景ならimg要素が適切だよ
295 ：Name_Not_Found：2011/08/13(土) 22:55:41.84 ID:???
外部化しないのは、特殊な場合だけでしょ。
296 ：Name_Not_Found：2011/08/13(土) 23:34:10.40 ID:???
>>295
いや、そういうのは、俺ルールであって、
こうでないといけないなんてのは無いだろ
自分がいいと思うなら全部のタグに一つずつ指定してもいい訳で
297 ：Name_Not_Found：2011/08/14(日) 02:14:09.11 ID:???
何が言いたいのか
style属性自体非推奨だけど

style属性使わないといけないってのは、マークアップがおかしいんじゃないの
298 ：Name_Not_Found：2011/08/14(日) 09:40:35.80 ID:???
>>297
まぁそういうなら、おまえはそうすればいいさ。
非推奨ってのは、「それは本来の便利さをなくすし見通し悪くなるから使わない方がいいよ」って事であって、
別に使っちゃいけないって禁止されてる訳じゃない

まぁ、そこまでいう>>297なんだから、imgタグやら改行タグも全部閉じてるんだろうけど。
でも、それすらも絶対守らないといけない約束じゃない
ヤプーですら、おまえのいう非推奨使ってるよ

自分が作りやすいように作る。これが一番いい
ソースを見せる訳じゃないんだから。
>>297の言ってる事は間違いじゃないだろうけど俺も間違ってるつもりないし。
299 ：Name_Not_Found：2011/08/14(日) 09:49:23.95 ID:???
おいおい
文法も大切だけどここは初心者スレだ
初心者の僕でも楽しめるスレにして下さい

なにか取っ付きやすくて楽しいヤツお願いします
300 ：Name_Not_Found：2011/08/14(日) 13:29:33.56 ID:???
てぶるでええよう・・・
301 ：Name_Not_Found：2011/08/14(日) 13:37:01.54 ID:???
まぁ、趣味の範囲ならいいんじゃない
302 ：Name_Not_Found：2011/08/14(日) 15:17:02.54 ID:???
HTMLとXHTML混同してね
HTML4.01で閉じたら文法違反だし、XHTMLで閉じなかったらパースエラー出てページ表示されないよ
303 ：Name_Not_Found：2011/08/14(日) 16:14:03.44 ID:???
XHTML1.0とXHTML1.1を混同してね？
1.0は緩いけど、1.1は厳格だよ
304 ：Name_Not_Found：2011/08/14(日) 16:28:07.13 ID:???
緩いのか ?
あれほど足を閉じとけと・・・
305 ：Name_Not_Found：2011/08/14(日) 17:46:46.90 ID:???
>>303
お前は何を言っているんだ
306 ：Name_Not_Found：2011/08/14(日) 21:29:29.70 ID:???
>>304
お前も何を言っているんだ
307 ：Name_Not_Found：2011/08/15(月) 01:39:18.24 ID:???
>>302
html5ならどっちでもいいよ
308 ：Name_Not_Found：2011/08/15(月) 01:59:52.53 ID:???
>>297
じゃあ外部ファイル2つ分けたら?
否定するなら代案示せっての
309 ：Name_Not_Found：2011/08/15(月) 07:48:08.33 ID:???
「*margin-top:5px;」ていうのは、何のためのハックですか？
310 ：Name_Not_Found：2011/08/15(月) 08:41:17.73 ID:???
外部ファイル2つ分けたらってどういうこと？
311 ：Name_Not_Found：2011/08/15(月) 10:59:08.97 ID:???
>>309
*{margin-top:5px;}
でなくて
*margin-top:5px;
なの?
312 ：Name_Not_Found：2011/08/15(月) 12:52:03.61 ID:???
>>311
そうです。たとえばYahooJapanのトップページなんかでも使ってます。
313 ：Name_Not_Found：2011/08/15(月) 13:25:13.24 ID:???
>>312
正解は判らないけど
ブラウザ毎の解釈を回避するワイルドカードなんじゃないかな?
-webkit-とか入れる代わり…なのかなと思ってますが
誰か正解頼みます
314 ：Name_Not_Found：2011/08/15(月) 16:37:37.82 ID:0Ppirfxl
>>313
IE7とそれ以下用のCSSハックです。

セレクタレベルでハックをかけない場合に使います。

body{
color:#000; /* 全てのブラウザに適用 */
*color:#ccc; /* IE7以下 */
}

のように使います。

IE6以下の場合は先頭に_を付けます。
IE8以下の場合は最後に\9を付けます。

body{
color:#000; /* 全てのブラウザに適用 */
*color:#ccc; /* IE7以下 */
_color:#FFF; /* IE6以下 */
color:#f30\9; /* IE8以下 */
}
315 ：Name_Not_Found：2011/08/15(月) 16:46:14.88 ID:???
>>309 です。
情報を、どうもありがとうございました。
316 ：Name_Not_Found：2011/08/15(月) 17:35:07.72 ID:???
>>314
ieのばかぁー
317 ：Name_Not_Found：2011/08/15(月) 18:58:02.96 ID:0Ppirfxl
>>316
気持ちは分かるが落ち着けｗ
318 ：Name_Not_Found：2011/08/24(水) 02:11:34.12 ID:???
table[width="123"]
,table[height="123"]
{        border-color: red;        }

このようなスタイルで、
table[width="123"]
table[height="123"]
これらを一括して指定したくて、　table[*="123"]　としたのですがエラーとなってしまいました。

値に「123」を持つtableを一括で指定する方法を教えてください。
319 ：Name_Not_Found：2011/08/24(水) 03:31:54.47 ID:???
HTML5じゃなければ属性名は限られてるから全部指定しとけばいい
320 ：Name_Not_Found：2011/08/24(水) 04:00:58.07 ID:???
>>319
ご回答ありがとうございます
おっしゃる方法なら確実なのですが、シンプルに記述したいのです
全称セレクタみたいに”全称プロパティ”なるものがあればよいのですが、見つからなくて。
321 ：Name_Not_Found：2011/08/24(水) 08:26:10.39 ID:???
ecmascriptで
322 ：Name_Not_Found：2011/08/24(水) 12:37:26.04 ID:???
>>320
ないものを使おうとするのは矛盾してるような
全称プロパティなるものをサーバサイドで正規のCSSに変換するとか…
323 ：Name_Not_Found：2011/08/24(水) 15:47:58.35 ID:???
>>321-322
プロパティについては全称の指定は出来ないのですか、残念です。

正当な方法では指定出来ず、そのような工夫を施さないといけないのですね
ご回答ありがとうございました。
324 ：Name_Not_Found：2011/08/25(木) 14:45:50.15 ID:???
link擬似要素でスタイルを指定するときに

<a>リ[画像]ン[画像]ク</a>

のように文字と画像が混在する部分をリンクとするとき
画像部分のみlink擬似要素スタイルが適用されないようにするには
どのように書けばいいのでしょうか
325 ：Name_Not_Found：2011/08/25(木) 16:12:30.09 ID:???
継承するスタイルなら、子セレクタで打ち消す
326 ：324：2011/08/25(木) 17:03:36.12 ID:???
自己解決しました
画像部分だけスタイルを適用させない、というより
a:link span {～} などとスタイルを定義して
適用したい部分だけspanで囲えばいいですね
ちょっと面倒な感じですが

あと擬似要素じゃなくて擬似クラスでした
普通のクラスみたいに、入れ子指定が可能ですね
327 ：Name_Not_Found：2011/08/25(木) 17:25:19.42 ID:???
>>325で合ってるやん
328 ：Name_Not_Found：2011/08/25(木) 18:32:56.47 ID:???
自己解決（笑）
329 ：Name_Not_Found：2011/08/25(木) 23:32:12.67 ID:???
これはひどいｗ
330 ：Name_Not_Found：2011/08/26(金) 14:06:38.38 ID:???
2ch復活
331 ：Name_Not_Found：2011/08/26(金) 14:43:44.26 ID:???
>>327
全然合ってないよ
「継承するスタイルなら」と勝手な条件付け

まあ初心者（が回答者を気取ってる）スレだから仕方ないが
332 ：Name_Not_Found：2011/08/26(金) 17:51:11.60 ID:???
子セレクタで何か間違ってるか？
333 ：Name_Not_Found：2011/08/26(金) 18:38:08.06 ID:???
上級者の集まるスレはココですか?
334 ：Name_Not_Found：2011/08/27(土) 02:01:46.71 ID:???
違います。
335 ：Name_Not_Found：2011/08/27(土) 06:02:26.81 ID:???
へー
336 ：Name_Not_Found：2011/08/27(土) 16:43:24.07 ID:???
文字列を<span>で囲んで背景色をつけると、line-heightとは関係なく
文字の上下に余白を含んだ一定の高さになります（行ボックスというんでしょうか）
これを高さ1emのboxと並べると、行ボックスのほうが少し下に大きいのですが
なぜですか？これは正しい挙動なんですか？
行ボックスの高さは、決まっているものなんでしょうか？
フォントやブラウザによって変わってしまうものなんでしょうか
調整に困っています
337 ：Name_Not_Found：2011/08/27(土) 17:28:50.07 ID:???
マージンやパディングを設定した上での話なんだろうな?
338 ：Name_Not_Found：2011/09/01(木) 00:15:46.35 ID:qYPkGIUN
しつもんです

ＩＭＧタグのＴＩＴＬＥ属性についてですが
スタイルシートで文字の大きさを変えたり色を変えたり出来ないのでしょうか？

よろしくお願いします
339 ：Name_Not_Found：2011/09/01(木) 01:20:57.72 ID:???
出来ません。
340 ：Name_Not_Found：2011/09/01(木) 09:41:21.24 ID:???
表示される保証なんてない属性なんだから
CSSでいじれるわけないでしょう
いじりたいならお前のブラウザの設定を変えてください
341 ：Name_Not_Found：2011/09/01(木) 11:05:54.71 ID:qYPkGIUN
うるせーカス
342 ：Name_Not_Found：2011/09/01(木) 11:36:05.12 ID:???
おやおや、困ったちゃんですね～
343 ：Name_Not_Found：2011/09/01(木) 12:34:03.35 ID:???
>>338
jQueryでツールチップを出してカスタマイズしたらどうかな。参考ページは自分でぐぐってね。
344 ：Name_Not_Found：2011/09/03(土) 06:53:23.36 ID:???
display: inline-block; ってCSS2.1なんですよね？
でもググって1ページ目に来るようなリファレンスサイトなんかに載っていないのは、なんでですか？
あんまり正しくない？（使わないほうがいい？）ものなんでしょうか
345 ：Name_Not_Found：2011/09/03(土) 10:30:49.05 ID:???
バリバリ出てくるバリバリ伝説
346 ：Name_Not_Found：2011/09/03(土) 18:13:50.44 ID:???
すいません教えてください。
背景色の幅って文字数によって可変になりませんか？

html
<p class="a">あいうえお</p>　<!--コレをAとする-->
<p class="a">あい</p>　<!--コレをBとする-->

css
p.a{
background-color:#aaa;
}
A、Bどちらも一行まるまる色が敷かれると思いますが、
5字分の幅、2文字分の幅に出来る方法ってありますか？
あるのでしたら、そのやり方をお教えください。

5文字に合わせると（widthで決め打ち）、2文字の時スカスカに
なってしまい困っています。

幅が狭い用と広い用のCSSを作るべきですか？
宜しくお願いします。
347 ：Name_Not_Found：2011/09/03(土) 18:45:51.87 ID:zuIuaqCy
pをspanにして適宜改行
348 ：Name_Not_Found：2011/09/03(土) 19:00:06.02 ID:???
>>346
ブロックレベル要素ですからね
float: left; をかけるとか
349 ：Name_Not_Found：2011/09/03(土) 19:10:54.35 ID:???
>>347-348
即レスありがとうございます。

できるんですね。お二人の指摘の所、
勉強してみます。

ありがとうございました。
350 ：Name_Not_Found：2011/09/05(月) 17:37:44.81 ID:???
テーブルのセルにbackground-imageで表示させた
繰り返しなしの画像を、セルの中心（上下の偏りなく）に
表示させるにはどうすればいいのでしょうか。

こういうイメージです
セル　→　口
画像　→　ちいさい口

こうなって欲しいイメージ
↓
回

よろしくお願いします。
351 ：Name_Not_Found：2011/09/05(月) 18:09:05.75 ID:???
>>350
座標指定
352 ：Name_Not_Found：2011/09/05(月) 18:10:59.37 ID:???
background-position: 左px 上px;
353 ：Name_Not_Found：2011/09/05(月) 18:19:06.74 ID:???
>>351-352
のレスを参考に色々ググッた結果
background-position:center;
で所望の結果が得られました。

ありがとうございました。
354 ：Name_Not_Found：2011/09/05(月) 18:25:11.26 ID:???
mac safari chrome firefox
background-position:50% 50%;
でど真ん中いけた他は知らん
355 ：Name_Not_Found：2011/09/05(月) 18:26:01.83 ID:???
>>353
そんな指定方法が有ったのか
不勉強でした
356 ：Name_Not_Found：2011/09/05(月) 18:38:48.38 ID:???
>>354
そういうやり方もあるんですね。検証結果もすごく助かります。
ありがとうございます。

>>355
他のオプションが付いているとうまくいかず、centerだけにしたら
中央に来ました。
357 ：Name_Not_Found：2011/09/05(月) 19:39:24.14 ID:???
上pxの方を省略したら50%になる
358 ：Name_Not_Found：2011/09/05(月) 19:42:52.44 ID:???
>>354
そりゃ、中央から「background-imageを開始する」ということだぞ
359 ：Name_Not_Found：2011/09/05(月) 19:44:48.59 ID:???
>>358
と思ったら、オレが違ってた
360 ：Name_Not_Found：2011/09/06(火) 02:40:57.58 ID:???
>>359
そう思って確認とってみたんだ
画像の左上が50%のポイントに当たると思ってブラウザに読み込ませたら
ど真ん中だったのでびっくりした
361 ：Name_Not_Found：2011/09/11(日) 08:22:52.75 ID:???
超初心者の質問ですみません。
よくHTMLに、<!-- header end -->　などとオレンジの文字でありますが（HPビルダー13）、
これは、どのような意味を持つのでしょうか。
プレビュー画面では、！マークがついています。
ただの、目印なのでしょうか。
362 ：Name_Not_Found：2011/09/11(日) 08:27:22.89 ID:???
ブラウザのレンダリングには現れない部分
秘密のコメントだよ

まぁ作った人が判る様に目印として残しているんだな
ファイルサイズには影響しますがブラウザの表向き部分には影響しません
363 ：Name_Not_Found：2011/09/11(日) 09:30:38.43 ID:???
>>362 ありがとうございます。
364 ：Name_Not_Found：2011/09/11(日) 09:50:27.67 ID:???
CSS関係ねええええ
365 ：Name_Not_Found：2011/09/11(日) 13:02:07.19 ID:???
CSSの指定に関して教えてください。
テーブルの横幅を一定（80％とか1000pxとか）に出来ますか？

口口←こういう感じのテーブルで、左が図、右が解説が入ります。
図の横幅がまちまちで、右のセルは相当細く（7文字程度）なっても構いません。
この2つのセルを足した幅が一定になるようにしたいのです。
例えば合計1000ｐｘなら
　左セル_____右セル
　600__________400
　900__________100
　300__________700
といった感じです。

●html
<table><tr>
<td><img src="図.gif"></td>
<td>解説テキスト</td>
</tr></table>
●css
table{
　width: 1000px;
}
tdの幅は指定していません。
↑としましたが、右セルが、文字数に応じて伸び縮みしているだけで、合計1000ｐｘ
になるような伸び縮みはしていません。trにwidth: 1000pxしても同様でした。

困り果てています、よろしくお願いします。
366 ：Name_Not_Found：2011/09/11(日) 13:18:44.01 ID:???
>>365
table-layout
367 ：Name_Not_Found：2011/09/11(日) 13:35:30.84 ID:???
>>366
早速のレスありがとうございます。
しかし
table{
width: 1000px;
table-layout:auto;
}

table{
　width: 80%;
　table-layout:auto;
}

table{
table-layout:auto;
}
いずれも変化なく、文字数に応じて伸び縮みして（例えば）1000ｐｘ
には足りませんでした。

他の記述が影響してるのか、しかしテーブルに関しては記述してないのですが。
ただいいプロパティ教えて頂きました。

ちょっと試行錯誤してみます。
ありがとうございました。
368 ：367：2011/09/11(日) 15:03:55.81 ID:???
>>366-367
完全に希望通りになりました。
本当にありがとうございました。
369 ：Name_Not_Found：2011/09/12(月) 13:19:59.34 ID:???
すいません、JavaScriptの質問スレと悩んだのですが、こちらでお願いします。
どなたかご存知でしたら教えて下さい。

背景画像固定をiPhone対応させたくてiScroll4というスクリプトを読み込ませたのですが上手く動作しません。
http://cubiq.org/iscroll-4

具体的に説明すると、cssのbody{}要素に定義してある
"background-attachment: fixed"と同様の事をiPhoneのSafariでやりたいです。

ただ、設置したいページのhtml構成が、大きいtableが一つあるだけという構造で、
divでheaderやfooter、メインコンテナ等を定義してあるわけではありません。
単純に背景画像を固定させたい使い方の場合はどのように記述すればいいのでしょうか。
（単純にtableをwrapperで囲うとスクロール自体が出来なくなる）
370 ：Name_Not_Found：2011/09/12(月) 13:50:01.23 ID:???
質問です。
以下のhtmlのalt属性の値が"target_name"の親の親のli要素を選択するにはどうすれば良いでしょうか？
あるコミュニティサイトで特定の人物の書き込みだけを非表示にしたいのです。

> <html>
> 　　<body>
> 　　　　<ul>
>　　 　　　　<li>
> 　　　　　　　　<div class="profile_image">
> 　　　　　　　　　　<img class="profile" src="html://xxx/xxx.jpg" alt="target_name" />
> 　　　　　　　　</div>
> 　　　　　　</li>
> 　　　　</ul>
> 　　</body>
> </html>
371 ：Name_Not_Found：2011/09/12(月) 20:08:49.91 ID:???
>>370
親セレクタないので無理
372 ：Name_Not_Found：2011/09/14(水) 11:54:07.06 ID:???
>>371
CSSで無理だとのことなのでjavascriptでやってみましたが、また新たな壁にぶちあたりまして・・・
それは別のスレで聞いてみます。
ありがとうございました。
373 ：Name_Not_Found：2011/09/15(木) 08:04:22.41 ID:???
style sheet ですが、１HPあたり何枚くらい設定してますか。
また、すべて外部style sheetで設定して、インラインスタイルに記述しないほうが良いのでしょうか。
TOPページ以下がかなりの枚数があり、
また、写真、グラフ、動画など、文章など、サイズもまちまちで、レイアウトが煩雑で
box?ごと、いろいろ指定しなければなりません。
そうしますと、idを個々に割り振る数がかなり増えると予想されます。
上記の場合は、tableとの併用や、直接記述を増やしたほうが良いのでしょうか。
374 ：Name_Not_Found：2011/09/15(木) 08:21:22.24 ID:???
統一したけりゃ外部が楽
各頁独自にしたけりゃインラインスタイルじゃねーの

レイアウトが煩雑に感じるのはセンスが無いのもあるだろうけど
統一感がないから余計にそう感じるのでは?
全体を見なおしてみたら?
375 ：Name_Not_Found：2011/09/15(木) 12:13:36.28 ID:???
>>374
ありがとうございます。
style sheet ですが、topとtopページ以下は、別に作成してもよいのでしょうか。
完全にレイアウト（ヘッダー部分）が違います。
全体を見直してみます。
376 ：Name_Not_Found：2011/09/16(金) 00:20:20.59 ID:???
好きにしなよ
管理しやすくするための外部ファイルなんだからさ
377 ：Name_Not_Found：2011/09/16(金) 01:46:38.34 ID:???
>>373
個人的に同じジャンルのページは同じレイアウト・デザインの方が観る方も管理する方も楽と言うか良いと思うよ
あなたの場合なら写真、グラフ、動画、文章でそれぞれのページ毎の外部ファイル作るとか
378 ：Name_Not_Found：2011/09/17(土) 10:08:21.86 ID:???
>>376
>>377
ありがとうございます。
自由に設定しても問題ないということがわかりました。
同じジャンルは同じレイアウトで、スタイルシートも共有で設定してみます。
379 ：Name_Not_Found：2011/09/17(土) 11:31:44.63 ID:???
同一レイアウトの方がドコにいるのかを把握しやすくなるので
安心感が出るんだな
で
上級者は同一ルールを生かしつつレイアウトを変更してくる…
そうすると格好良くなってくる(場合もある)
380 ：Name_Not_Found：2011/09/18(日) 05:28:17.69 ID:???
教えてください。

背景が黒のページで、縦スクロール付きの領域？が必要に
なりました。
調べてそれはできたんですが（overflow:auto;）、その領域？
の背景も黒のままです。
（そこに入れるあるテキストは他のページにリンクさせないと
いけません）
どうすればこの領域を白にできるのでしょうか。

ご教示ください、よろしくお願いします。


検索しているうちにテキストエリアというのを見つけて
やってみました。背景色は白に出来ましたが、リンクが
＜a href="a.html"＞などと普通にテキストとして表示されてし
まいました。
381 ：Name_Not_Found：2011/09/18(日) 05:40:14.29 ID:???
>>380
自己解決しました。
cssの記述の最後に　；　をつけてませんでした。
スレ汚しすみませんでした。
382 ：Name_Not_Found：2011/09/20(火) 07:52:38.14 ID:???
CSSのみでそのページがアクティブかどうかわかりますか？

わかりにくくてすみません。
ホーム、ページA、ページBがあり、ページ上部に
ホーム｜ページA｜ページB　というナビゲーションがあります。
AのときにはナビのAがロールオーバーさせないようにしたいのです。

色々検索とかしたんですが、難しすぎて分かりません。
手ほどきか、やさしい（基礎から）解説ページを教えて下さい。

よろしくお願いします。
383 ：Name_Not_Found：2011/09/20(火) 08:25:19.68 ID:???
>>382
スタイルを上書きすべし
384 ：Name_Not_Found：2011/09/20(火) 13:24:33.50 ID:???
>>383
スタイルを上書きですか…。
検索途中に出会ったような気がします。
カスケードとか…。

うーん私にはまだ難しいようなので、泥臭く手を動かします。

落ち着いたらもっと洗練されたその技法を習得したいと
思います。

ありがとうございました。
385 ：Name_Not_Found：2011/09/22(木) 23:57:25.75 ID:???
content : counter　で番号を振ったとき
１
１０
ではなくて
　１
１０
のように数字の部分で右端揃えにしたいときはどうすればいいですか？
386 ：Name_Not_Found：2011/09/23(金) 01:20:41.57 ID:???
>>385
content:counterを使ったことがないから詳しいことはわからないけど、
list-style:decimal;で番号振ったときも番号部分の位置指定が出来ないように、
content:counterでも同様に位置指定が出来ないとおもう。

無理やりあわせたいなら、桁が少ないところだけclass振ったりしてpositionとかtext-indentで調整するしかないんじゃないかなー。
387 ：385：2011/09/23(金) 07:45:52.75 ID:???
>>386
わかりました。ありがとうございます。
388 ：Name_Not_Found：2011/09/24(土) 13:40:25.37 ID:???
グローバルナビを下記のとおり作成しました。
設定しているリンクですが、htmlを修正中（HPを作成中）に、消えてしまい、
ナビの画像も消えてしまいます。都度リンクの貼り直しが必要になります。
何が問題なのでしょうか。

<div id="menu">
<ul>
<li id="menu01"></li>
<li id="menu02"></li>
</ul>
</div>

#menu01 a{
background-image: url(images/bg_menu01.gif);
background-position: 0px 0;
}
389 ：Name_Not_Found：2011/09/24(土) 14:54:16.52 ID:???
リンク無いじゃん
390 ：Name_Not_Found：2011/09/24(土) 16:15:10.86 ID:???
>>388
CSSでaタグセレクタにしてるけどソースにaタグないじゃん
391 ：Name_Not_Found：2011/09/24(土) 16:50:10.59 ID:???
>>389
>>390
すみません。リンクが消えてしまうのです。
元は、
<li id="menu01"><a href="inquery.htm"></a></li>

のように入っているのですが、編集中に、リンクの箇所が消えてしまいます。
392 ：Name_Not_Found：2011/09/24(土) 19:04:37.49 ID:???
小人さん ?
393 ：Name_Not_Found：2011/09/24(土) 19:29:34.50 ID:???
単純に考えて何かのツールの予定外の動作だよね
何を使ってるかぐらい最初から書いたら？
394 ：Name_Not_Found：2011/09/24(土) 23:49:44.33 ID:???
最近は投げっぱなしでキャッチボールが無いんだよなあ・・・
395 ：Name_Not_Found：2011/09/25(日) 01:57:21.19 ID:???
誰か俺のデザインしたサイト作ってー
お小遣い程度の報酬は払うよー。


とか言ったらどうなるの？
396 ：Name_Not_Found：2011/09/25(日) 02:09:29.31 ID:???
お小遣い5万でやってあげるよ。
397 ：Name_Not_Found：2011/09/25(日) 04:35:01.96 ID:???
なら僕は10万だよ
398 ：Name_Not_Found：2011/09/25(日) 08:50:38.88 ID:???
>>393 ホームページビルダー13を使用しています。
リンクの箇所が消えて、cssで置いている背景も消えてしまうのです。
※リンクには、背景画像だけでは設定できないのでしょうか。
「お問い合わせ」などと、文字も指定する必要があるのでしょうか。（ｘ-9999でインデントを掛けて）


例）<li id="menu01"><a href="inquery.htm">お問い合わせ</a></li>
399 ：Name_Not_Found：2011/09/25(日) 10:23:37.83 ID:???
CSS関係ないからビルダースレで聞くべき
400 ：Name_Not_Found：2011/09/25(日) 16:23:14.16 ID:2ZSiKw9M
漢字のスペース
401 ：Name_Not_Found：2011/09/26(月) 21:21:07.18 ID:???
分かりにくいｗ
402 ：Name_Not_Found：2011/09/27(火) 12:37:14.51 ID:???
画面いっぱいに表示した画像Aの上に、画像Bを重ねて出したくて
その際、画像Bの左右位置をセンタリングしたいのですが
position:absolute とセンタリングを両立させるやり方がわからず、うまくいきません。
margin 0 auto やtext-align:centerではダメでした。どうすれば良いでしょうか
403 ：Name_Not_Found：2011/09/27(火) 13:09:13.00 ID:???
背景にimg要素使ってんじゃない
404 ：Name_Not_Found：2011/09/27(火) 22:07:48.59 ID:???
ソースを頼む
405 ：Name_Not_Found：2011/09/28(水) 07:13:29.70 ID:???
　 　 ,-ｰ──‐‐-､
　　 ,! ||　　　　　　|
　　 !‐---------‐
　　.|:::i ./´￣￣.ヽ.i
　　|::::i | |＼∧/.|..||
　　|::::i | |__〔@〕__|.||
　　|::::i |.（´･ω･`）||
　　|::::i |　 ｷﾝｸﾞ　 ||
　　|::::i | ｶﾜｲｿｰｽ.||
　　|::::i L___________」|
　　|::::i : : : : : : : : : |
　　｀'''‐ｰ------ｰﾞ
406 ：Name_Not_Found：2011/09/29(木) 17:49:00.38 ID:???
レイアウトが崩れるのを
ずっとIEのバグだと思ってたら
</a>タグの閉じ忘れだった。
こんな事ってあるのね。
407 ：Name_Not_Found：2011/09/29(木) 19:56:54.05 ID:???
何処で改行するかによってもわずかにレイアウトに影響が出た時はビックリしたよ
408 ：Name_Not_Found：2011/09/29(木) 23:34:40.74 ID:???
あるあるｗ
タグの閉じ忘れはページ書き終わった後に一回文法チェッカにかけるようにすれば良いよ
409 ：Name_Not_Found：2011/09/29(木) 23:41:29.39 ID:???
え、普通エディタの機能で書きながらわかるだろ…
410 ：Name_Not_Found：2011/09/30(金) 00:48:30.71 ID:???
みんなが同じエディタ使ってると思うなよ
411 ：Name_Not_Found：2011/09/30(金) 01:05:53.64 ID:???
バカかお前
412 ：Name_Not_Found：2011/09/30(金) 13:43:27.43 ID:???
改行位置の問題はブラウザのバグ
413 ：Name_Not_Found：2011/09/30(金) 15:28:09.32 ID:???
HTMLでは改行と空白は一緒なんじゃないの
414 ：Name_Not_Found：2011/09/30(金) 15:43:00.72 ID:???
カラー画像をモノクロに表示し、マウスが乗るとカラーになる、
別ファイルCSSでの記述方法はありますか？
415 ：Name_Not_Found：2011/09/30(金) 17:25:47.65 ID:???
ない
416 ：Name_Not_Found：2011/09/30(金) 20:50:25.28 ID:???
IEのJavaScriptでならできるけど、他は知らん。
417 ：Name_Not_Found：2011/09/30(金) 22:46:59.77 ID:???
>>414
ちょいとググれば腐るほど出るだろうが
418 ：Name_Not_Found：2011/09/30(金) 23:40:58.15 ID:???
IEの独自プロパティじゃなければ無いよ
419 ：Name_Not_Found：2011/09/30(金) 23:49:19.19 ID:???
カラー写真とモノクロ写真を用意して、背景画像処理にすればおｋ。
img:hover{ background.... }てな感じで
420 ：Name_Not_Found：2011/10/01(土) 00:00:12.22 ID:???
>>418
background-positionが無いとかお前どこの時空の人間だ
421 ：Name_Not_Found：2011/10/01(土) 01:57:20.86 ID:???
はいはい
422 ：Name_Not_Found：2011/10/10(月) 15:22:36.09 ID:mg3ahhXk
メニューリンクについて

サイト内ページ数15

各ページリンクの設定をやり直すのだけれど
そのやり方のついて小生は1ページづつこまめに設定させていく方法しか知りません
どなたか一発で1５ページに影響させられる設定の仕方を知りませんか？

たとえば1ページだけ編集すれば全部に行き渡るというやり方・・・
教えてください

お願いします
423 ：Name_Not_Found：2011/10/10(月) 17:21:06.54 ID:???
>>422
そう言ったものに対応したモノが必要です
424 ：Name_Not_Found：2011/10/10(月) 18:28:11.20 ID:cMmCEUi9
エディタでマルチ置換
iframe
インリンク
swap
外部クッション

お好きなのでどうぞ
425 ：Name_Not_Found：2011/10/10(月) 22:05:48.51 ID:???
というかCSS関係ねえ
426 ：Name_Not_Found：2011/10/11(火) 15:12:28.96 ID:???
サイドバーやフッターのナビゲーションかぁ
そう考えると、フレームセットってある意味すげーよな
UAががしっかりセットとして実装できていれば、フレーム全盛の時代だったのかも・・・
SEO的にもサイドバーやフッターは不要だから効率は良いのにな
427 ：Name_Not_Found：2011/10/12(水) 10:53:25.69 ID:???
ハイパーテキストの使い方ってのがまだ未知数だったときに
テーブルレイアウトで出版業界と同じデザイン、て方向に走っちまったからな
HTML5のasideなんてサイドバーに表示すりゃ良かったんだ
428 ：Name_Not_Found：2011/10/12(水) 17:18:26.54 ID:???
ふと疑問に思ったことですが、自分ではうまく調べることができず解決できなかったので質問させて頂きます

・style, meta, linkなどのタグに対してidやclassといった属性を設定することはできるんでしょうか？
・また可能であるブラウザがある場合、それは仕様として正しいのでしょうか？
・あともしよろしければ、その設定したidやclassを用いてDOM操作することについてどう思うかも教えてください(例えばそんな使い方は気持ち悪いなど)
429 ：Name_Not_Found：2011/10/12(水) 17:57:59.95 ID:???
>>428
表面に出てこないものにcssを設定してどうしたいんだ?
430 ：Name_Not_Found：2011/10/12(水) 18:02:06.91 ID:???
style無理, meta無理,
link可能 正しい
431 ：Name_Not_Found：2011/10/12(水) 18:16:05.55 ID:???
>>429
なぜ質問を読まない
スレチだとは思うけど
432 ：428：2011/10/12(水) 19:50:52.95 ID:???
>>430
早い解答ありがとうございました！
linkタグは正しい仕様として可能なんですね、少し意外でした。

>>431
スレ違いかもしれないと思いましたがセレクタについてはCSSスレが詳しいのではないかと考え質問させて頂きました。
もっと適切なスレを探すべきでした、すいませんm(_ _)m
433 ：Name_Not_Found：2011/10/13(木) 00:14:30.61 ID:???
>>428
XHTML以降はどれも可
metaを拾ってメタデータを可視化したりRDFaする
linkを拾ってナビゲーションを動的生成する
何も問題ない
434 ：Name_Not_Found：2011/10/13(木) 04:33:03.86 ID:???
>>433
http://www.w3.org/TR/2010/REC-xhtml-modularization-20100729/dtd_module_defs.html#dtdelement_meta.qname
ここ読む限り駄目なように見えるけど、大丈夫なの
435 ：Name_Not_Found：2011/10/13(木) 08:00:02.35 ID:???
>>434
詳しくは書かんが、XHTML 1.0でOKなのに1.1でダメって変だと思わなかったか
1.1ではローカル属性@id、@classなどをグローバル属性@xhtml:id、@xhtml:classに切替可能になってんだ
適合性の解釈に異論があるかもしれんが、気になるならどっかのスレにでも投げてみろ
XHTMLのスキーマはグダグダだから、自分で調整した方がはええぞ
436 ：Name_Not_Found：2011/10/13(木) 17:14:17.98 ID:???
こっちのスレの方が平和だから向こうのニート君2人が飽きるまでアドバイスはこっちにしようかね
437 ：Name_Not_Found：2011/10/13(木) 17:33:49.13 ID:???
帰れ
438 ：Name_Not_Found：2011/10/13(木) 20:35:23.43 ID:???
>>437
文字を二行表示ってどうやってかくの？
439 ：Name_Not_Found：2011/10/13(木) 20:36:29.41 ID:???
>>438
安価は虫してね間違えた
440 ：Name_Not_Found：2011/10/13(木) 20:39:33.77 ID:???
質問省略しすぎだろ
回答者にエスパーさせんな
441 ：Name_Not_Found：2011/10/13(木) 20:45:09.24 ID:???
>>440
text か font かなんかでできないかなぁ
442 ：Name_Not_Found：2011/10/13(木) 23:18:11.46 ID:???
ここまで>>436の自演
443 ：Name_Not_Found：2011/10/14(金) 00:40:06.52 ID:???
二行表示ってなんだ？　オレの嫁レベルの質問の仕方だなｗ　
444 ：Name_Not_Found：2011/10/14(金) 09:02:16.62 ID:???
エスパーすると、
通常の1行の中に、小さい字の注釈のようなものを2行で入れたい、
てことじゃないか。
445 ：Name_Not_Found：2011/10/14(金) 12:24:58.12 ID:???
割注がしたいのか
446 ：Name_Not_Found：2011/10/14(金) 13:16:09.21 ID:???
ルビを振りたいだけかもしれんぞ
447 ：Name_Not_Found：2011/10/14(金) 16:20:27.52 ID:???
<span font-size:200%;>あ</span> だけの事じゃないのか？

１行<br>２行
とかだけの事かも？

分数の表示かもな。
448 ：Name_Not_Found：2011/10/14(金) 17:43:55.83 ID:???
で、質問者本人はもうどこかへトンズラ、と。
449 ：Name_Not_Found：2011/10/14(金) 17:53:36.70 ID:???
いつから質問者がいると錯覚していた
450 ：Name_Not_Found：2011/10/14(金) 18:24:28.88 ID:???
暇つぶしの釣り
451 ：438 です：2011/10/15(土) 11:37:15.93 ID:???
>>443-450
>>443のエスパーで合ってるっス
452 ：Name_Not_Found：2011/10/15(土) 11:45:48.24 ID:???
つまり
俺の嫁
ってこと？
453 ：Name_Not_Found：2011/10/15(土) 11:47:54.82 ID:???
>>452
俺はお前の嫁ではない！
454 ：Name_Not_Found：2011/10/15(土) 12:48:37.65 ID:???
てへ
455 ：Name_Not_Found：2011/10/15(土) 16:07:53.35 ID:???
オレの嫁レベルって事だから、
必要な穴は使えるってレベルじゃまいか
456 ：Name_Not_Found：2011/10/15(土) 17:12:08.32 ID:???
*もか ?
457 ：Name_Not_Found：2011/10/21(金) 18:53:13.84 ID:B01pCtnC
質問です

cssでmarginの指定で、上だけ0px他を5pxにしたいとき
①margin:0 5 5 5px;
②margin:0px 5px 5px 5px;
③margin-top:0px; margin-right:5px; margin-bottom:5px; margin-left:5px;

いろいろあると思いますが他にも指定方法ありませんでしょうか？
ちなみに1番簡素化された指定方法は①ですよね？
458 ：Name_Not_Found：2011/10/21(金) 19:00:09.29 ID:???
>>457
単位省略は値が 0 の時だけだから①はあり得ない
一番省略された形は margin: 0 5px 5px;
459 ：Name_Not_Found：2011/10/21(金) 19:19:02.09 ID:B01pCtnC
>>458
なるほど。そういう指定もあったんですね
最初の「0 5px」が上下で後の「5px」が左右のことですよね。勉強になりました。
460 ：Name_Not_Found：2011/10/21(金) 20:13:34.63 ID:???
>>459
いやいや、それは違うｗ
ちゃんとリファレンスを読もうね
http://hp.vector.co.jp/authors/VA022006/css/box.html#margin
461 ：Name_Not_Found：2011/10/21(金) 23:24:39.37 ID:???
.aaaaa { background: url(URL1) }
.aaaaa { background: url(URL2) }
.aaaaa { background: url(URL3) }
↑と数種類ある画像をランダムに読み込ませたい場合はどこにどのような文字を記入すればいいでしょうか？
462 ：Name_Not_Found：2011/10/21(金) 23:58:42.47 ID:???
スレチ
463 ：Name_Not_Found：2011/10/21(金) 23:59:40.91 ID:???
>>462
誘導よろ
464 ：Name_Not_Found：2011/10/22(土) 11:55:22.67 ID:4V51Rw3e
2カラムのサイトのレイアウトの方法で
左カラムにfloat:left、右カラムをfloat:rightとするのはわかるのですが
左カラムのwidthを100%とマイナス値の右margin、右カラムに右マージンという設定の仕方を見かけるのですが
この右カラムを左カラムの外からmarginでめり込ませてる？方法には何かメリットはあるのでしょうか？
465 ：Name_Not_Found：2011/10/22(土) 12:39:26.77 ID:???
>>464
ネガティブマージンのこと？
http://coliss.com/articles/build-websites/operation/css/css-using-negative-margins.html
466 ：Name_Not_Found：2011/10/22(土) 13:07:56.76 ID:???
>>465
これの事だと思います、ありがとうございます
つまりメリットというか左カラムを相対幅・右カラムを固定幅のレイアウトにしたい場合の作法って事ですかね
467 ：Name_Not_Found：2011/10/22(土) 13:52:30.94 ID:???
>>466
ちょっと違うと思うけど…
ネガティブマージンは後続の要素を引っ張れるのが特徴
あなたの挙げた例は左カラムを100%にして右カラムを引っ張ってるだけ
しかも、正確には左カラムの横幅にはなってない
468 ：Name_Not_Found：2011/10/23(日) 19:22:41.77 ID:72sISXfe
質問です

http://uploader.sakura.ne.jp/src/up63811.gif

↑これをCSS(DIV)で作ったらどうなりますか？
なるべくシンプルに作りたいのですがうまくできず困っています
（右と左の余白が全然合わなかったりとか・・・）
どうぞよろしくお願いします
469 ：Name_Not_Found：2011/10/23(日) 19:59:01.53 ID:???
まずおまいのコーディングを見せてもらおうか
470 ：Name_Not_Found：2011/10/23(日) 20:01:19.70 ID:72sISXfe
>>469
はい。でも滅茶苦茶ですｗ

<div style="width:120px; height:50px; padding:5px; background-color:#e69138; border-style:solid; border-color:#ffe599; border-width:4px; font-size:12px;">
<div style="float:left; width:30px; height:50px; background-color:#e69138; color:#ffe599;">url<br />abc</div>
<div style="float:right; width:70px; height:50px; background-color:#ffd966; color:#e69138;">A url<br />abc</div>
</div>
471 ：Name_Not_Found：2011/10/23(日) 20:39:46.08 ID:???
この大きさのロゴ（？）をCSSでやるのが間違い。
画像で作るよろし。
472 ：461：2011/10/23(日) 22:01:42.32 ID:???
>>461
誘導先でも答え貰えないし、この質問はCSSですので誰か教えてください><
473 ：Name_Not_Found：2011/10/23(日) 22:08:34.05 ID:???
>>472
javascript
474 ：Name_Not_Found：2011/10/23(日) 22:11:17.97 ID:???
>>473
ランダムに読み込ませることになるとjavascriptになるのか。。。さんくす
475 ：468：2011/10/23(日) 22:18:33.81 ID:???
すぐに答えてもらえると思ったのに
答えてもらえないどころかコーディングまで晒せと言われ
挙句CSSでできることを画像でやれってアホみたいなレスしか返ってこないとは・・・
476 ：Name_Not_Found：2011/10/23(日) 22:44:09.39 ID:???
>>475
だけどさ、この大きさでこの微妙な配置てさ、
見る人の環境（フォントサイズ、フォント種類、ブラウザ間の違いなど）で、
かなり印象かわるぜ。

pngで作るのが一番だと思うよ。
ちなみに、オレは>>469じゃないぜよ。
477 ：Name_Not_Found：2011/10/23(日) 22:47:58.12 ID:???
>>468≠>>475＝>>476
478 ：Name_Not_Found：2011/10/26(水) 09:11:09.22 ID:???
classみたいなものでbodyの色はあれでaの色はあれでpの色はあれでと
複数の要素を一まとめにする方法はありますか？
それ一つを呼び出したらすべてokという形にしたいのですが…
現在はページ数の多くないサイトに複数のcssファイルがあるので一つに
してしまいたいと思っています
479 ：Name_Not_Found：2011/10/26(水) 10:28:43.92 ID:???
@importを使って１つのCSSにまとめればいいよ
480 ：Name_Not_Found：2011/10/26(水) 11:00:15.94 ID:???
pxで指定しないでemや%で指定しろと聞いた事があるのですが
例えばフォントの大きさを指定する場合
基準となる大きさをpxで指定してから、部分的にemや%で相対指定して利用する
という認識であってますか？
481 ：Name_Not_Found：2011/10/26(水) 11:15:39.68 ID:???
いいえ
「何も指定しない状態」を基準にしてください
482 ：Name_Not_Found：2011/10/26(水) 11:32:23.19 ID:???
大きい文字で見たいのにサイズ指定されたら見れないの？
483 ：Name_Not_Found：2011/10/26(水) 11:40:26.11 ID:???
最近のブラウザはズーム機能ついてるから見えないときはズームしろと言え。
emや%、リキッドだのでレイアウト崩れる方がかえって読みにくくなる。
画像や枠の大きさ無視して文字サイズだけ変えるなどという悪しき習慣がクソ。
484 ：Name_Not_Found：2011/10/26(水) 11:41:09.19 ID:???
>>479
ありがとうございます
試してみます
485 ：Name_Not_Found：2011/10/26(水) 12:07:31.65 ID:???
@importは通信回数増えるのが難点
人来ないサイトならいいけど
486 ：Name_Not_Found：2011/10/26(水) 12:37:34.50 ID:???
pxって一応相対単位段だけど何で絶対単位だと認識されているのですか？
487 ：Name_Not_Found：2011/10/26(水) 15:05:24.47 ID:???
だれが認識しているのですか？
1pxの大きさは環境ごとに固定だから絶対単位みたいな扱いされてもおかしくないとは思うが
488 ：Name_Not_Found：2011/10/26(水) 17:12:03.12 ID:???
OKweb　webカテの常連回答者(ORUKA....)で毎回仕様書引用するオヤジがいるけど
自分ではフォントにpxは使うなとか回答してるくせに
HTML5や子供セレクタのサンプルを使いまくるのはどういう見解なの？
489 ：Name_Not_Found：2011/10/26(水) 17:25:01.18 ID:???
子供セレクタってCSS2の？
490 ：Name_Not_Found：2011/10/26(水) 18:52:51.41 ID:???
>>489 子供セレクタにCSSのバージョン関係あんのか？
491 ：Name_Not_Found：2011/10/26(水) 19:24:22.71 ID:???
子供セレクタ使うなって言いたいんとちゃうの>>488は
492 ：Name_Not_Found：2011/10/26(水) 22:25:22.14 ID:???
>>491
今時のブラウザは、fontでpxには左右されないのにpx使うなっていう人がいる
それはIE6以下（IE7の例も）を考慮するからであっての事なので、それはそれで良い。
それなら、HTML5や子供セレクタを出すのはおかしいとの事でしょ
493 ：Name_Not_Found：2011/10/26(水) 23:51:50.94 ID:???
float:leftした要素にwidthを指定していないのですが、文字のサイズに合わせて広がりません
解決策はございませんか？
494 ：Name_Not_Found：2011/10/27(木) 01:08:21.79 ID:???
widthを文字ベースでemで設定
495 ：Name_Not_Found：2011/10/27(木) 03:56:55.08 ID:???
ORUKAはな…初心者初級者レベルにそんなガッチガチの説明してどうするんだっていうｗｗ
子孫セレクタはともかく兄弟セレクタなんか混乱させるだけだろ
496 ：Name_Not_Found：2011/10/27(木) 10:51:56.54 ID:???
素人は「仕様書に書いてあるから」と言えば正解だと思うらしいぞ

HTML4の質問なのにやたらとHTML5での説明してるけど
あれって知識を覚えたての頃にやりがちな事だよなｗ

素人相手に‘知ったかオヤジ’はみっともない
497 ：Name_Not_Found：2011/10/27(木) 12:45:32.81 ID:???
liにpadding:10 10;をしても効きません
padding:10px 10px;と指定すると効きます
確か単位を省略した場合はpxとして扱われたはずなんですが何故ですか？
498 ：Name_Not_Found：2011/10/27(木) 15:08:57.62 ID:???
>>497
(X)HTML の属性値と違って、CSS では「0」を指定する場合を除き、必ず単位を伴って指定する必要があります
499 ：Name_Not_Found：2011/10/27(木) 15:09:51.50 ID:???
何故？　それは「おれ様ルール」だからだろｗ
500 ：Name_Not_Found：2011/10/27(木) 15:10:27.55 ID:???
cssの良い書き方みたいなのありますか？
501 ：Name_Not_Found：2011/10/27(木) 15:32:03.99 ID:???
正座をして書く
502 ：Name_Not_Found：2011/10/27(木) 15:35:46.38 ID:???
そして書き終えたらあつい緑茶を飲む
503 ：Name_Not_Found：2011/10/27(木) 17:00:49.79 ID:???
緑茶の飲み過ぎは体に悪い
504 ：Name_Not_Found：2011/10/27(木) 18:26:39.75 ID:???
そこから蹲踞でゆっくり立ち上がり
に～～～～～ん～～～～～げ～～～～～～～～ん～～～～～～
ご～～～～じゅ～～～～～ね～～～～～～ん～～～～～～～
505 ：Name_Not_Found：2011/10/27(木) 19:27:15.29 ID:???
下記のHTML(標準モード)構造でfloatで2カラムにさせたいのですが
ブラウザを小さくするとdiv#aの部分がしたにいってしまいます
ｇｇって1ページに出てくる崩れない2カラムのHPをみたとおりにしたのですが
崩れなくするにはどこを修正したらよいでしょうか？
ただし、#boxと#aのwidthの値は変えられません


#box{float:left;width:300px;}
#a{width:100%;}
#box2{float:left;margin-left:300px;}

<div id="box">
<div id="a">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</div>
<div id="box2">bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</div>
506 ：Name_Not_Found：2011/10/27(木) 19:34:44.37 ID:???
body全体の幅を予め指定してしまえば良いんじゃ？
507 ：Name_Not_Found：2011/10/27(木) 19:45:44.97 ID:???
<ul>
<li>そして<a href="http://yahoo.com" target="_blank">ここ</a></li>
</ul>
通常のリンクの色は変えずに、リスト<li>の中にあるa要素の色だけを変更するにはどうすればいいでしょうか？
508 ：Name_Not_Found：2011/10/27(木) 19:48:25.86 ID:???
>>507
li a {
509 ：Name_Not_Found：2011/10/27(木) 20:15:49.77 ID:???
>>505
position
510 ：505：2011/10/27(木) 22:37:44.48 ID:???
ブラウザのサイズによって#box2を自動的に変更したいのでbody全体の幅を指定はしたくないのです
positionだと解決できますか？
ただpostionだとtopとleftを設定するので文字のサイズとか↑で書いた上の部分にヘッダを書きたいのですが
ヘッダの文章とフォントサイズの大きさによって崩れたりしませんかね？
511 ：Name_Not_Found：2011/10/27(木) 23:47:25.07 ID:???
セレクタについての質問です．

たとえば，

<div class="AAA">
<div class="BBB">b</div>
</div>
<div class="AAA">
<div class="CCC"></div>
</div>

というような構造のHTMLがあったとして，
class="BBB"を子にもつdiv(class="AAA")に対してのみCSSにてスタイルを割り当てることは可能ですか？
512 ：Name_Not_Found：2011/10/27(木) 23:50:31.94 ID:???
>>510
質問が曖昧すぎて答えられない
どういう大きさにしたいの？
513 ：Name_Not_Found：2011/10/27(木) 23:57:14.37 ID:???
>>511
AAAのスタイルを空にしてBBBとCCCで区別した方が楽じゃね。
あるいはAAAの親要素からの:first-childか:nth-childで選択するとか。
514 ：Name_Not_Found：2011/10/28(金) 00:04:41.82 ID:???
>>513
実際にはもっと入り組んだ構造になってるからクラスで管理したいというのが実情です。。。
515 ：Name_Not_Found：2011/10/28(金) 00:20:14.22 ID:???
子孫まで条件に入れてたら面倒でたまんないっての
516 ：505：2011/10/28(金) 00:35:20.55 ID:???
[ヘッダー]
[#box(子要素に#a)][#box2]
[フッター]

このようなレイアウトで
ヘッダーとフッターと#aはwidth100%にしてます
#boxのみ300pxにします
右側の#box2の部分はブラウザのサイズによって幅いっぱいまで自動的に調節されるようにしたいのです
517 ：Name_Not_Found：2011/10/28(金) 02:25:47.62 ID:???
>>511
CSS4セレクタの 「?」 のことか？
どっちにしろ今は無理だけど
518 ：Name_Not_Found：2011/10/28(金) 10:15:39.82 ID:???
>>517
Oh CSS4で使えるようになるのね
他の方法で解決するしかないかー
ありがとう
519 ：Name_Not_Found：2011/10/28(金) 16:35:02.88 ID:???
ブログのエントリー内で、画像は左右目一杯に表示（900px）して
文章だけは左右例えば500pxとか写真より左右を狭くすることはできませんか？
現在は下記のようになっています。
.entrytextのマージンをいじると.entrytext imgにもそのマージンが反映されてしまいます。


.entrytext, .formtext {
font-size: 100%;
margin: 0px;
padding: 0;
width: 100%;
}

.entrytext ul li {
margin: 0 0 5px 20px;
padding: 0;
list-style: square;
}

.entrytext img {
margin: 0px;
padding: 0px;
border: 2px black solid;
}

.formtext img {
margin: 0px;
padding: 0px;
border: 2px black solid;
}
520 ：Name_Not_Found：2011/10/28(金) 16:38:22.68 ID:???
CSS3がでたとおもったらもうCSS4の話がでてるのか
521 ：Name_Not_Found：2011/10/28(金) 17:49:34.55 ID:???
overflow:autoをつけるとmargin-leftがおかしくなるのってバグですよね？
522 ：Name_Not_Found：2011/10/28(金) 19:42:18.84 ID:???
なんのバグだよ？　ブラウザ（バージョン）、ソースやURLなどを出してくれ
523 ：Name_Not_Found：2011/10/28(金) 22:47:37.09 ID:???
>>519
日本語でおｋ
524 ：Name_Not_Found：2011/10/28(金) 23:06:33.60 ID:???
<!DOCTYPE html>
<html>
<head>
<style>
*{margin:0;padding:0;}
html,body,#all,#top,#bottom{width:100%;}
#left,#right{float:left;}
#left{width:900px;background:#f00;}
#right{margin-right:-900px;background:#0f0;}
#bottom{clear:both;}
</style>
</head>
<body>
<div id="all">
<div id="top">ヘッダー</div>
<div id="left">あああああああああああああああああ</div>
<div id="right">えええええええええええええええええ</div>
<div id="bottom">フッター</div>
</div>
</body>
</html>

margin-left:900pxってするとずれます
margin-right:-900pxてやるとずれないのですが、ブラウザのサイズを極限まで小さくすると#leftの下に#rightがもぐってしまいます
#rightは可変にしたいのでwidthで固定しません
どこを修正したらよいでしょうか？
525 ：Name_Not_Found：2011/10/29(土) 10:26:34.46 ID:???
iphoneのブラウザでは以下のようにするとspanTagいれた後に空白ができてきます
これを解決する方法はないでしょうか

おいしい<span style="background-color:rgb(0,153,153)">ラーメン</span>です
526 ：Name_Not_Found：2011/10/29(土) 16:19:56.36 ID:???
>>524
どうしたいのか伝わってこない
left900pxもどこにやったのか分からない
無駄に伝わりにくい

もう少しがんばりましょう
527 ：Name_Not_Found：2011/10/29(土) 16:22:51.33 ID:???
>>525
iphoneもってないから確認できないけど
ブラウザのcssじゃないのか？

空白ってよりマージンとかパディングだと思う。
そのスパンタグにどんなcssがかかっているのか調査されたし
自分で作ったcssじゃなくて、ブラウザ独自のcssも含めてって意味でね
528 ：Name_Not_Found：2011/10/29(土) 16:48:05.63 ID:???
>>526
それお前がコードを読めないだけだろうが
529 ：Name_Not_Found：2011/10/29(土) 17:04:56.70 ID:???
>>528
本人か？
まじで伝わりにくいんだが
仕方ないからがんばってよんでやるよ・・・
530 ：Name_Not_Found：2011/10/29(土) 17:14:26.00 ID:???
悪い悪いてっきり>>519と>>524が同じ質問かと思ってた


カラム落ちする原因はallの横幅がウィンドウ枠100%になっているから。
右カラムのサイズも自動になっているのはよくないと思う。

clear;bothはallに使うか
左カラム、右カラムを囲ったdivに使ったほうがいいんじゃね

ネガティブマージンもおすすめできない

マージンレフトとfloatレフトを同時に使うと
IEではサイズが二倍になったりするからハックすればいい

あとcss使うならちゃんと分けろ
ついでにソース読みにくい
531 ：Name_Not_Found：2011/10/29(土) 17:20:21.73 ID:???
あと、marginの意味ちゃんと分かってる？
positionと勘違いしてない？
左カラムの右枠と右カラムの左余白900pxとったらそりゃとんでもないことになるよね

margin-right-900pxは右カラムの右枠から左に900pxずらしてるようなものだけど
なんでそんなことしてんの？

右カラムは左カラムにくっつけたいの？
それともall枠の右側にくっつけたいの？

スタイルシートもごっちゃごちゃ書いてあって管理しにくいだろ常考
ボックスごとにわけろ
532 ：Name_Not_Found：2011/10/29(土) 17:26:29.19 ID:???
>>524　そういうのはposition使えよ

>>530
>clear;bothはallに使うか左カラム、右カラムを囲ったdivに使ったほうがいいんじゃね
524の方がベター

>マージンレフトとfloatレフトを同時に使うとIEではサイズが二倍になったりする
ウソ教えんなよ。6だけだろ
533 ：Name_Not_Found：2011/10/29(土) 17:46:18.40 ID:???
>>532
あぁ、6ぬけてたわ。別にウソではない

clearは確かに左右カラムがid指定だし、
一個しかでてこないならbottomでよさげだな
534 ：Name_Not_Found：2011/10/29(土) 22:06:12.72 ID:???
>>519
エントリ枠とエントリ本文とエントリ画像の３つに
それぞれ別々のクラス名をつければいいってことじゃね？
HTMLの<%topentry_body>をDIVで挟んで、新しいCLASS名をつけてみたら？
本文のフォントサイズやなんかは新しいクラス名のほうに移して
エントリ枠の設定は.entrytext, .formtext {
に残しておけばいいんじゃないかな。

へそ曲がりなテンプレートだと
新しいクラス指定を素直に受け入れないこともあるから
こればっかりは様子を見ながら試してみる以外にない。
535 ：Name_Not_Found：2011/10/30(日) 13:11:53.38 ID:???
http://code.google.com/intl/ja/apis/maps/documentation/javascript/tutorial.htmlのサンプルを利用してます
マップ画像を角丸にしたいのですがFirefoxとIEとOPERAは適用されるのにchromeだけ反映されません
chromeでも角丸にする方法はございますか？
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style>
#map_canvas {
-webkit-border-radius:100px;
-moz-border-radius:100px;
border-radius:100px;
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>
536 ：Name_Not_Found：2011/10/30(日) 14:12:59.85 ID:???
ブラウザの横幅が特定のpx以下になったら横スクロールバーを表示させる方法はございますか？
537 ：Name_Not_Found：2011/10/30(日) 14:20:12.18 ID:???
>>536
body {min-width: 特定のpx; }
とか？
538 ：Name_Not_Found：2011/10/30(日) 14:24:06.70 ID:???
知っているがおまえの態度が気に入らない
539 ：Name_Not_Found：2011/10/30(日) 14:25:49.75 ID:???
日本語で
540 ：Name_Not_Found：2011/10/30(日) 14:40:56.46 ID:???
>>535
http://www.vickcy.com/web-frontend/webkitde-overflow-hidden-bug
http://www.torounit.com/blog/2011/04/30/698/
http://tech.bluesmoon.info/2011/04/overflowhidden-border-radius-and.html

バグかどうかは知らん
関係ないけど、-webkit-border-radiusと-moz-border-radiusはいらん
541 ：Name_Not_Found：2011/10/30(日) 14:49:24.67 ID:???
いやいやsafariとfirefox用にいるでしょ
542 ：Name_Not_Found：2011/10/30(日) 14:55:53.92 ID:???
Firefox3.6は対応してないのか
Safariはベンダープレフィックスいらんよ
543 ：Name_Not_Found：2011/10/30(日) 18:25:47.53 ID:???
<html>
<head>
<style>
*{margin:0;padding:0;}
html,body{width:100%;height:100%;}
#warp{width:100%;height:100%;}
#header{width:100%;height:50px;background:#0f0;}
#body{width:100%;height:100%;background:#f00;}
</style>
</head>
<body>
<div id="warp">
<div id="header">ヘッダ</div>
<div id="body">ボディー</div>
</div>
</body>
</html>

<div id="body">ボディー</div>の部分の高さをブラウザにフィットしたいのですが<div id="header">ヘッダ</div>の部分の高さ分だけ下にはみ出てしまいスクロールバーが出てしまいます
ブラウザサイズに合わせて<div id="body">ボディー</div>も表示領域にフィットさせたいのですがどのように修正するとよいでしょうか？
544 ：543：2011/10/30(日) 18:30:18.29 ID:???
書き直します
フッタを入れました

<html>
<head>
<style>
*{margin:0;padding:0;}
html,body{width:100%;height:100%;}
#warp{width:100%;height:100%;}
#header{width:100%;height:50px;background:#0f0;}
#body{width:100%;height:100%;background:#f00;}
#footer{width: 100%;height:50px;background:#999;}
</style>
</head>
<body>
<div id="warp">
<div id="header">ヘッダ</div>
<div id="body">ボディー</div>
<div id="footer">フッタ</div>
</div>
</body>
</html>
545 ：543：2011/10/30(日) 18:31:19.03 ID:???
連投失礼します
ブラウザの大きさを変えたときに#bodyの部分が伸び縮みするようにしたいのです
546 ：Name_Not_Found：2011/10/30(日) 19:04:00.59 ID:???
すみません質問させてください。
<div class="xxx">～</div>で区切った内部にテキストが入るのですが
これが改行のない文章でも指定した横幅で改行されるようにするには
どうしたらいいでしょうか？
今のままでは指定した横幅を超えていくらでもテキストが飛び出てしまいます。
word-break: keep-all;とか試してみましたが改行されないままでした。

どうぞお知恵をお貸しください。おねがいします。
547 ：Name_Not_Found：2011/10/30(日) 19:16:13.13 ID:???
>>546
はみ出すのって半角英数とかでしょ
javascript 半角英数 改行させる
でｇｇってみ
548 ：Name_Not_Found：2011/10/30(日) 19:30:03.75 ID:???
>>546
word-wrap
549 ：Name_Not_Found：2011/10/30(日) 19:55:47.92 ID:???
>>543
display: table 系使うと楽だよ
550 ：Name_Not_Found：2011/10/30(日) 20:00:37.06 ID:???
改行と折り返しの区別くらいつけろよ
551 ：Name_Not_Found：2011/10/30(日) 20:54:46.31 ID:???
word-wrapはクロスブラウザで統一した結果にならない
552 ：Name_Not_Found：2011/10/30(日) 20:57:07.38 ID:???
まあテキストモジュールが勧告候補になるまで待ってなって
553 ：Name_Not_Found：2011/10/30(日) 21:00:39.67 ID:???
>>549
どのように使うのですか？
554 ：Name_Not_Found：2011/10/30(日) 21:03:59.85 ID:???
> display: table 系
IE8未満は未対応ですね
555 ：Name_Not_Found：2011/10/30(日) 21:48:53.78 ID:???
でっていう
556 ：Name_Not_Found：2011/10/30(日) 22:07:02.81 ID:???
IE6-7は特殊なレガシーシステムを使うための専ブラみたいなもんだから
一般のサイトが対応する必要はないと思う
557 ：Name_Not_Found：2011/10/30(日) 22:21:47.54 ID:???
全ユーザの約１割は未だにIE6使用者だけどね。
558 ：Name_Not_Found：2011/10/30(日) 22:29:38.92 ID:???
ｘｐのサポ切れたらIE9以降のみ対応すればよくなるから
559 ：Name_Not_Found：2011/10/30(日) 22:36:55.35 ID:???
> ｘｐのサポ切れ
３年後だね
560 ：Name_Not_Found：2011/10/31(月) 05:08:22.88 ID:???
XPユーザーは、サポ切れなんて気にしない♪
パソコンが逝くまで使い続ける
気にするなら、とっくにIE7,8にしてる！
お前らが気合入れて作っても、崩れサイトとして認識するよｗ
561 ：Name_Not_Found：2011/10/31(月) 07:55:16.32 ID:???
>>560
2000の時も同じ事を聞いた
562 ：Name_Not_Found：2011/10/31(月) 10:42:11.77 ID:???
「このサイトはIE8以上で閲覧してください」ページにリダイレクトしようぜ。
563 ：Name_Not_Found：2011/10/31(月) 12:17:25.05 ID:???
>>562
蔵はそれを「機会損失」と考えるから、無理。
564 ：Name_Not_Found：2011/10/31(月) 13:15:03.99 ID:???
リダイレクトとか（）
565 ：Name_Not_Found：2011/10/31(月) 17:15:55.14 ID:TOGkjIGW
拡散希望！http://www.youtube.com/watch?v=H0wElSatScI　【頑張れ日本】11.4 ＴＰＰ絶対阻止！国会大包囲！国民行動
566 ：Name_Not_Found：2011/10/31(月) 18:28:36.74 ID:???
すみませんが、質問させて頂きます。
Tableタグを

<table class="nanasi"><tr><td></td></tr></table>

とかにして

CSSの方で

table.nanasi {
width: 480px;
border: 3px #555555 solid;
border-collapse: collapse;
border-spacing: 0;
}

みたいにしているんですが、ほとんどは480pxで適応してくれるんですが、
たまに横幅が300pxぐらいで狭かったり、480以上ではみ出したりして
指定しているのにその通りにならなかったりするんですが、これって
なにが問題なんでしょうか？教えて頂けると幸いです。
567 ：Name_Not_Found：2011/11/01(火) 00:49:57.54 ID:???
>>566
その崩れている時のソースをjsfiddleでよろ
あと、どのブラウザのバージョンな
568 ：Name_Not_Found：2011/11/01(火) 01:37:36.29 ID:???
>>567

クローム、サファリ、IEはだめでした。
しかしフォックスでは普通に表示されます。

jsfiddleについては初耳で知りませんでしたが、今ぐぐったら色々と
こちらを使うようになれば知識面での上達が出来そうなこと、
そして身ばれを防ぐ為にソースの一部を隠したいけれど、どこを
隠せば良いかの知識がないので出直してきたいと思います。

jsfiddleを教えて頂きありがとうございました。一歩前進です。
569 ：Name_Not_Found：2011/11/01(火) 01:48:32.94 ID:???
>>568
IEはバージョンごとで結構崩れるから
6なのか7なのか8なのか9なのかって事だよ

ソースがつかめてないならまずはそこからだと思う
firefoxならbugs
IEならdeveloper tool
chromeなら要素の検証
Dreamweaverを体験版でもいいから
そこのテーブルタグをクリックすればどのcssが効いてるか
見る事ができるから、それ使ったりもしたほうがいいよ
570 ：Name_Not_Found：2011/11/01(火) 03:41:44.02 ID:???
>>566
別にその程度のソースはここでOK
ただ、架空のソースをだすのではなく、
そのダメだった時のソースを出せばいいんだよ。

このソースは何故意図通りにならないの？ってな感じでOK
571 ：Name_Not_Found：2011/11/01(火) 05:32:26.02 ID:???
>>566
固定レイアウトアルゴリズムにしてないからだと思うよ
572 ：Name_Not_Found：2011/11/01(火) 18:52:57.27 ID:???
>>570
ここに貼ると必要な部分だけ抽出したつもりで実は書いてない部分に原因がありました、って人が必ず出てくる
ちゃんと切り分けて貼れれば問題ないが、そういう人はjsfiddleも使いこなせる
573 ：Name_Not_Found：2011/11/01(火) 19:00:30.44 ID:???
＞＞５６０＝＝＞＞５７０
574 ：Name_Not_Found：2011/11/03(木) 01:10:02.47 ID:6YfO7ens
Google Chrome で、＜pre＞タグの中身が等幅フォントで表示されず、困ってます。
font-family:monospaceを指定してもだめ。
FirefoxやSafariでは問題ないのに、Chromeでのみ発生します（Chrome15で確認）。
どなたかアドバイスお願いします。
575 ：Name_Not_Found：2011/11/03(木) 01:41:48.99 ID:???
>>574
プロファイル作り直せば
576 ：Name_Not_Found：2011/11/03(木) 01:50:52.62 ID:6YfO7ens
>>575
プロファイルとは？CSSの用語ですか？
577 ：Name_Not_Found：2011/11/03(木) 03:48:35.37 ID:???
その前に、自分だけの話なのか検証しないといけないよ
578 ：Name_Not_Found：2011/11/03(木) 08:16:31.36 ID:???
>>576
Chrome初期化しろってことだ
579 ：Name_Not_Found：2011/11/03(木) 08:25:26.16 ID:???
>>576
クリーンインストールしたChromeと同じ状態にすること
580 ：Name_Not_Found：2011/11/03(木) 21:40:11.93 ID:???
ボタンをブラウザいっぱいに広げたいのですがDOCTYPEを書くと広がりません
書かないと広がります
DOCTYPEを買い手もいっぱいに広げる方法をアドバイスおねがいします

<!DOCTYPE html>
<html>
<head>
<style>
*{margin:0;padding:0;border:0;}
html,body{width:100%;height:100%;}
#contents{height:100%;min-height:100%;}
body>#contents{height:auto;}
button{width:100%;height:100%;}
</style>
</head>
<body>
<div id="box">
<button>a</button>
</div>
</body>
</html>
581 ：580：2011/11/03(木) 22:05:27.83 ID:???
質問取り下げます
失礼しました
582 ：Name_Not_Found：2011/11/04(金) 20:10:12.18 ID:???
特定のタグが含まれるタグをCSSで指定するためにはどうすれば良いでしょうか？

例えば、
<a href="hoge.html"><img src="hoge.jpg" /></a>
<a href="fuga.html">foobar</a>

とある時、

imgタグが含まれているaタグ{
//スタイルの記述
}
としたいです
583 ：Name_Not_Found：2011/11/04(金) 20:15:54.91 ID:???
>>582
>>511-518
584 ：Name_Not_Found：2011/11/04(金) 20:18:27.77 ID:???
>>583
現状ではできないのですね
ありがとうございました
585 ：Name_Not_Found：2011/11/05(土) 09:47:24.55 ID:???
>>584
できるよ
586 ：Name_Not_Found：2011/11/05(土) 10:44:39.32 ID:???
できるなら方法も書きましょう
できる・できないだけ書くのはレスの無駄で単なる幼稚な行為か荒らしだと認定されますよ
587 ：Name_Not_Found：2011/11/05(土) 11:39:28.39 ID:???
>>582
オライリーのCSS完全ガイドに書いてあったような気がする。
588 ：585：2011/11/05(土) 12:05:24.26 ID:???
普通に指定すればいいだけなんだから初歩の問題じゃね？
>>586みたいなのが荒らしだろ
>>587はスルーしていいと思う


>>584の言い方だと
imgタグが含まれているaタグを装飾したいってことでいいのかな
一応imgのほうを装飾したい場合も書いといた

http://jsfiddle.net/NxKnM/
589 ：Name_Not_Found：2011/11/05(土) 12:15:28.44 ID:???
>>588
質問をよく読め
590 ：Name_Not_Found：2011/11/05(土) 12:27:58.80 ID:???
>>586
素直に「どうぞ教えて下さい」と言えばいいものを…
つまらん自治するから荒らし認定されたな。
591 ：Name_Not_Found：2011/11/05(土) 12:39:51.93 ID:???
>>589
お前がry
592 ：Name_Not_Found：2011/11/05(土) 12:43:32.38 ID:???
>>582の日本語が変だが
子から親の指定をしたいってなら無理だな
593 ：Name_Not_Found：2011/11/05(土) 12:47:34.34 ID:???
>>588
class指定しないでやりたいってことだろう
あなたの解釈がおかしい
594 ：Name_Not_Found：2011/11/05(土) 12:52:53.63 ID:???
>>588
素人は無理して回答しなくていいから黙ってろ
595 ：Name_Not_Found：2011/11/05(土) 12:58:32.93 ID:???
あんた無粋だねえ
596 ：Name_Not_Found：2011/11/05(土) 13:14:06.64 ID:???
これは質問者が悪いな
質問者=>>586=>>589=>>593=>>594
必死すぎだろｗ
597 ：593：2011/11/05(土) 13:31:32.92 ID:???
>>596
593で初めて書き込んだが、質問の意図はわかる
俺からすれば>>588が酷いぞ
「img要素を子要素とするa要素に相当するセレクタはありますか？」に対して「該当要素にclassを付けてください」で質問者は納得すると思うのか？
598 ：Name_Not_Found：2011/11/05(土) 13:33:41.46 ID:???
>>597
「img要素を子要素とするa要素に相当するセレクタはありますか？」って最初からかいとけよｗ
599 ：Name_Not_Found：2011/11/05(土) 13:57:52.83 ID:???
バカな回答する奴に限って自分に反論する者は全て１人に認定したくなるものだな
600 ：Name_Not_Found：2011/11/05(土) 13:57:59.49 ID:???
>>598
> imgタグが含まれているaタグ{
これでわかるだろ
「imgタグが含まれているaタグ」にクラスセレクタが入ると思ってるのか？
601 ：Name_Not_Found：2011/11/05(土) 14:15:43.67 ID:???
知識以前に読解力の問題だな
602 ：Name_Not_Found：2011/11/05(土) 14:16:36.11 ID:???
>>586=>>589=>>593=>>594=>>596=>>598
603 ：Name_Not_Found：2011/11/05(土) 14:40:36.80 ID:???
この質問は普通にわかるわ
604 ：Name_Not_Found：2011/11/05(土) 14:44:10.48 ID:???
うるせえエビフライぶつけるぞ
　,.、,、,..,、、.,、,、、..,_,,_　 ／i
;'｀;、、:、. .:、:,　:,.: ::｀゛:.::'':,'.´ -‐i
'、;: ...: ,:. :.、... :.、.:: _;... .;;.‐'゛￣ ￣
　　　ヽ(´･ω･)ﾉ
　　　　 |　 /
　　　　 UU
605 ：Name_Not_Found：2011/11/05(土) 14:45:34.68 ID:???
まともに受け答えしない時点で荒らし
606 ：Name_Not_Found：2011/11/05(土) 16:27:16.36 ID:???
>>605
おまえも
607 ：Name_Not_Found：2011/11/05(土) 20:04:53.64 ID:???
ん？クラスつければって話で世界平和が訪れたんじゃないの？
608 ：Name_Not_Found：2011/11/05(土) 20:13:44.80 ID:???
他人のページのスタイル変更が目的なのでダメです
609 ：Name_Not_Found：2011/11/05(土) 20:55:59.17 ID:???
鯖が違うじゃねぇか
610 ：Name_Not_Found：2011/11/05(土) 21:02:59.45 ID:???
多分、ユーザCSSを適用しようとしているのだろう
初めから用途まで書いた方が誤解がなくて良かったと思うが
611 ：Name_Not_Found：2011/11/05(土) 22:09:58.78 ID:???
国語力がない奴が掘り返して騒いでいるだけです
612 ：Name_Not_Found：2011/11/06(日) 11:30:42.88 ID:???
>>584
javascriptで子要素をチェックしてもいいなら出来る
css単品だとできない
613 ：Name_Not_Found：2011/11/06(日) 11:35:34.18 ID:???
>>612
スレ間違えてね？
614 ：Name_Not_Found：2011/11/06(日) 11:51:15.78 ID:???
CSSで出来ない代わりに別の方法がある事を書いたまでだから間違えてはないけど
615 ：Name_Not_Found：2011/11/07(月) 01:55:55.37 ID:???
半角英数だけを自動的に等幅にしたいのですが
どうしたらよいでしょうか
616 ：Name_Not_Found：2011/11/07(月) 02:03:57.02 ID:???
>>615 CGIで吸い上げて吐きだすしかないんじゃないか？
617 ：Name_Not_Found：2011/11/07(月) 02:15:55.08 ID:???
カーニング？
キャッチコピー的な特定の部分とかならclassつけてletter-spacingとか、画像で済ますとか
それじゃダメなの？
618 ：Name_Not_Found：2011/11/07(月) 03:08:21.65 ID:???
それは日本語でいうところの手動という作業ではないのかい？
619 ：Name_Not_Found：2011/11/07(月) 03:18:52.69 ID:???
langつけろ
620 ：Name_Not_Found：2011/11/07(月) 10:27:43.66 ID:???
font-familyで等幅英字フォント指定すれば
621 ：Name_Not_Found：2011/11/07(月) 10:47:00.67 ID:???
>>620
少なくともWindowsでは標準で等幅英字なんて名前のフォントは無いと思うけど
何のことを言っているんだ?
622 ：Name_Not_Found：2011/11/07(月) 11:43:34.95 ID:???
WEB Font使えばいいんじゃね。
半角英数が等幅で、それ以外がプロポーショナルなフォントがあればいい。
623 ：Name_Not_Found：2011/11/07(月) 11:44:23.63 ID:???
>あればいい
無いんじゃないの
624 ：Name_Not_Found：2011/11/07(月) 12:22:06.98 ID:???
日本語フォントを指定しなければいいんじゃないの
625 ：Name_Not_Found：2011/11/07(月) 12:38:20.60 ID:???
>>623
無いなら作ればいいよ。
フリーの半角英数とIPAのフォントを合成するとかして。
改変可能なライセンスのものを選ぶ必要があるけど。

>>624
指定しなければブラウザ依存になるよ。
626 ：Name_Not_Found：2011/11/07(月) 13:00:28.42 ID:???
cssだけで出来ないことはJavascriptsでやれよ
627 ：Name_Not_Found：2011/11/07(月) 14:26:46.94 ID:???
複数形ﾜﾛﾀ

628 ：Name_Not_Found：2011/11/07(月) 17:34:45.66 ID:???
>>625
英字フォントの後に日本語フォントを指定すればいいでしょ
629 ：Name_Not_Found：2011/11/07(月) 17:42:55.15 ID:???
>>628
それは、英字フォント（日本語は実装依存）だけが適用されるのでは。
630 ：Name_Not_Found：2011/11/07(月) 18:14:44.29 ID:???
CSSの仕様上は>>628で良いけど、Windowsだとフォントリンクのせいでまともに機能しないかもね
631 ：Name_Not_Found：2011/11/07(月) 18:37:48.80 ID:???
<x class="a"></x>
<x class="b"></x>
<x id="c"></x>
<x></x>
とある時、１行目のxタグ以外のタグにスタイルを適用するためにはどうすれば良いでしょうか？
HTMLの記述自体を変更するのはナシでお願いします
632 ：Name_Not_Found：2011/11/07(月) 18:47:41.56 ID:???
x:not(.a)
633 ：Name_Not_Found：2011/11/07(月) 19:02:57.74 ID:???
>>632
うまくいきました、ありがとうございます
634 ：Name_Not_Found：2011/11/07(月) 19:21:24.23 ID:???
&
635 ：Name_Not_Found：2011/11/07(月) 19:35:37.75 ID:???
すいません>>631さんの逆の質問で
一番最後の要素にだけ適用しない方法ってありませんか？
636 ：Name_Not_Found：2011/11/07(月) 19:39:47.73 ID:???
>>635
.a, .b, #c {　}
637 ：Name_Not_Found：2011/11/07(月) 22:10:33.22 ID:???
クロスブラウザ用の場合は、その旨教えてやれよ
638 ：Name_Not_Found：2011/11/07(月) 22:17:42.50 ID:???
>>637
質問者と回答者どっちに言ってるんだ？
> クロスブラウザ用の場合は
回答者に言ってるならクロスブラウザ用じゃないから該当しないよね。
639 ：Name_Not_Found：2011/11/08(火) 11:53:01.91 ID:???
試してないけど、x:not([class][id]) かね。
>>636がクロスブラウザ用ってことかと。

>>638
文句いってる奴は無視していいと思うよ。
自分から何もせずに人に注文付けるだけの自己中な人だから。
自分で回答すればいいだろって話。
640 ：Name_Not_Found：2011/11/08(火) 16:42:36.95 ID:???
>>632のセレクタ ＝ >>636のセレクタ
みたいに>>637が勘違いしてるだけたぶん
641 ：639：2011/11/08(火) 20:09:00.60 ID:???
自分も勘違いしてた
x[id], x[class] だな
642 ：Name_Not_Found：2011/11/08(火) 21:54:32.56 ID:???
>>639
何かした後に、次回の為に「ついでに●●もしとけよ」とか言うのが自己中なのか？
それを自己中と言う方が自己中だろ
643 ：Name_Not_Found：2011/11/08(火) 23:01:01.28 ID:???
チューチュー
644 ：Name_Not_Found：2011/11/08(火) 23:13:01.15 ID:???
忠告は、自己中では無く親切心なんだけどね
思春期に親に言われるとムカついたけどね
645 ：Name_Not_Found：2011/11/08(火) 23:14:07.11 ID:???
反抗期だった
646 ：Name_Not_Found：2011/11/09(水) 03:49:02.81 ID:Z4TjQrd0
>>18
style内にコメント
あまり勧められない
647 ：Name_Not_Found：2011/11/09(水) 07:46:27.17 ID:Usuht5KD
あ
648 ：Name_Not_Found：2011/11/09(水) 14:00:05.80 ID:???
>>22で指摘済みだし4か月も経って今更何だいって話だし割とどうでもいい
どうせ構文がXHTMLだってHTMLとしてパースしてる（させてる）んだから
649 ：Name_Not_Found：2011/11/09(水) 14:10:46.06 ID:???
FC2はアホやなぁ
650 ：Name_Not_Found：2011/11/09(水) 15:49:25.98 ID:f+9Yf7Jv
CSSセレクタについて質問させてください

<div class="ArticleSet cFix">
のようにclass属性が２つある場合の指定方法が分かりません
div[class="ArticleSet cFix"]ではDOMでは認識されませんでした
他にも、ダブルクォーテーションを取り除いたりしたのですがダメでした

どのように指定すればいいのか教えていただけませんでしょうか?

651 ：650：2011/11/09(水) 15:54:54.07 ID:f+9Yf7Jv
すみません、少しだけ質問を変えます
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
の「ほうれん草」トいう文字を取り出したいと思っています
この場合はどのように指定すればいいのでしょうか？
652 ：Name_Not_Found：2011/11/09(水) 16:09:26.11 ID:???
文字列を取り出すとかDOMとか、それCSSは何の関係があるの？
653 ：650：2011/11/09(水) 16:13:03.58 ID:f+9Yf7Jv
>>652
スレ違いという意味でしょうか?
もしそうだとすると、CSSセレクタの指定方法は外部CSSの指定と同じですのでCSSという概念の範囲だと思いまして
違ったらごめんなさい
654 ：Name_Not_Found：2011/11/09(水) 16:20:09.30 ID:???
CSSそのものだからスレ違いではないよね
655 ：652：2011/11/09(水) 16:34:20.47 ID:???
逆に聞くけど、ｊQueryの要素選択とかそういう話に繋がるんじゃないの？

<!DOCTYPE html>
<title>test</title>
<style> .hoge.fuga { color: #f00; } </style>
<p class="hoge fuga">hoge fuga</p>
<p class="hoge">hoge</p>
<p class="fuga">fuga</p>

セレクタではクラスセレクタを連結して書く　記憶が曖昧だがIEは古いと対応してないかもしれん
ただし上記の場合hogeとfuga以外にさらにclassを持っている場合も引っかかる

それをDOMだの文字列抽出だのに持ち込んで使えるのかは別な話
656 ：Name_Not_Found：2011/11/09(水) 16:37:57.96 ID:???
jQueryとはまた程度の低いものを引っ張り出してきたね
CSSセレクタって>>650はちゃんと書いてるじゃん
657 ：Name_Not_Found：2011/11/09(水) 16:40:26.66 ID:???
<a title="あああああああ">aaa</a>

リンクの上にカーソルを持ってくるとtitleの文字が出てきますが
このtitleの部分にbackground:#000000;をつけたいのですが
セレクタはどのように書くのでしょうか？
658 ：Name_Not_Found：2011/11/09(水) 16:48:48.94 ID:???
>>656
だからそれがDOMで認識されないだの質問が変わって文字列抽出だの、
そういう話になるから違う話なんじゃないのって話でしょ？程度低いのはどっちか考えろ
659 ：Name_Not_Found：2011/11/09(水) 16:54:43.19 ID:???
>>658
何言ってんだお前は？
こいつはただcssの指定の仕方を聞いてるだけだろ！
CSSセレクタがCSSと別物なんて言えるのか?
例えそれが抽出の話だろうが、CSSはCSSであり、指定の方法がまた別の人間が
純粋なスタイルシートで使用する場合に指定方法が分からなければ参考になるだろ
これは「完全に」CSSの書き方以外のなにものでもないだろうが

お前こそCSSって何か一から学習してこい
W3Cでも見てCSSの概念を読んでこい
660 ：Name_Not_Found：2011/11/09(水) 17:10:27.70 ID:???
じゃぁ何だ、HTMLファイルに
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
というものがあって、
ある人間が上記のほうれん草という文字にだけ何かCSSの属性を適用したいと考えたとき、他に
<div class="ArticleSet"><p>ほうれん草</p></div>
とか似たようなものがあって適用できないときこれがCSSのセレクタの問題ではないというのか？
そりゃclass等の指定の仕方が悪いんだろうが、それでもどうしても規程か何かで変えられない
仕方がないって時と何が違うんだ？
jQueryとはそもそも全く関係がないだろ
「CSSのセレクタ」とjQueryは話が違う
これはCSSのスレで、何も逸脱していないだろ
抽出がどうだろうが、CSSのセレクタの指定には何も変わらない
お前の言ってるjQueryの方がスレ違いだ

くだらんからもう俺はここら辺で止めるけどよ
661 ：Name_Not_Found：2011/11/09(水) 17:17:36.85 ID:???
だからセレクタのモジュール名にCSSって名前が含まれなくなったんだけどね
662 ：Name_Not_Found：2011/11/09(水) 17:29:48.18 ID:???
おい長文止めろ俺の質問が流れるだろう
663 ：Name_Not_Found：2011/11/09(水) 17:38:22.98 ID:???
>>657
title 属性はツールチップを表示するためのものじゃない
ユーザースタイルの話なら、ブラウザによって違うけど例えば Firefox は tooltip#aHTMLTooltip
664 ：Name_Not_Found：2011/11/09(水) 19:26:33.82 ID:???
>>651
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
でp見えなくしたいなら
.ArticleSet p{
display:none;
}
か
.cFix p{
display:none;
}
(消えなきゃ両方一緒に)
ではだめなの？p取る訳じゃないんだけど
665 ：Name_Not_Found：2011/11/09(水) 19:35:50.45 ID:???
>>664
>>655
666 ：Name_Not_Found：2011/11/15(火) 04:10:05.79 ID:rxjqt9HN
http://www44.atwiki.jp/mhp3ta/pages/16.html

上のサイトの様なテーブルで編集したいのですが、どうしてもうまくいきません
どの様にプラグインを組めばいいですか？編集例を教えてくださるとありがたいです
667 ：Name_Not_Found：2011/11/15(火) 10:26:50.81 ID:???
プラグインはいらない。
CSSでできる。
668 ：Name_Not_Found：2011/11/17(木) 12:53:59.83 ID:adxkXDsK
FC2の公式テンプレートを色々と弄くりながら勉強してるんですが、
テンプレートの中に次のような記述がありました。

/* side */
.sidehead{
}
：
省略
：
.sidehead{
height: 53px;
}

一度、sideheadクラスを空で定義して、
sideの一連の定義が終わったあとに再度、sideheadクラスを
定義し直しています。
このような記述の仕方に何か特別な意味があるのでしょうか？
669 ：Name_Not_Found：2011/11/17(木) 13:31:44.93 ID:???
一連の定義はデフォルトで後から
カスタマイズしやすいようにってことでしょ
670 ：Name_Not_Found：2011/11/17(木) 14:53:10.34 ID:???
http://www.cssez.com/

ここってサービス終了したんですか？
671 ：Name_Not_Found：2011/11/17(木) 15:01:18.06 ID:???
>>670
うわ、ドメイン失効ｗはずかしｗ
672 ：Name_Not_Found：2011/11/17(木) 20:45:52.52 ID:???
width:600のdivの中にwidth:160の子div3つを横に等間隔中央揃えで配置したいのですが、何か手はないでしょうか

673 ：639：2011/11/17(木) 21:10:01.89 ID:???
>>672
計算すれば何px開ければいいか、出てくる
674 ：Name_Not_Found：2011/11/17(木) 21:44:30.24 ID:???
>>672
これじゃだめなの？

.box {
margin:10em auto;
width:600px;
padding:5px;
background:black;
color:white;
}

.sub_box {
border:1px black solid;
background:white;
margin:5px;
color:gray;
text-align:center;
}
675 ：Name_Not_Found：2011/11/17(木) 21:44:50.35 ID:???
ごめん。わかりやすく。と思ったけどゴッチャになった
676 ：Name_Not_Found：2011/11/17(木) 21:57:27.08 ID:???
更にごめん。いろいろ根本的に間違ってた。

・inline-block使うものと
・table-cell使った奴おいとく

.box {
width:600px;
}

#sub_box {
display: inline-block;
width:194px;
}


<style type="text/css">
.box {
width:600px;
}

#sub_box {
display: table-cell;
width:200px;
}

後者だとbox内でどれだけwidth大きくしてもはみ出ないしイイんじゃないかなと思ってる
677 ：Name_Not_Found：2011/11/17(木) 22:10:41.78 ID:???
これみながらmarginでやってみ
600-480=120

<--------- width:600px ------------>
<---->■<--><-->■<--><-->■<---->
678 ：Name_Not_Found：2011/11/17(木) 22:11:23.56 ID:???
<---->は30px
<-->は15px
679 ：Name_Not_Found：2011/11/18(金) 01:38:59.80 ID:???
背景を細めのストライプに設定するため以下の書き方をした場合

１：
　background-size: 50px 50px;
　linear-gradient(top left -45deg, #2b2b2b, #2b2b2b 5%, #333333 6%,
　#333333 10%, (略) #2b2b2b 91%, #2b2b2b 95%, #333333 96%, #333333 100%);
２：
　background-size: 10px 10px;
　linear-gradient(top left -45deg, #2b2b2b, #2b2b2b 25%, #333333 26%,
　#333333 50%, #2b2b2b 51%, #2b2b2b 75%, #333333 76%, #333333 100%);
　
sarari5.1.1とChorome15.0.874.120では体感的に差を感じないのですが、FF8だと
２で固まりかけます。
これはFireFoxになにか固有の問題があるのか、描画の速さで気付かないだけで
前二者も多少は遅くなっている（２の方が明らかに処理が重い）のか、個人的な
環境のせいか……何が問題と考えれば良いのでしょうか。
680 ：Name_Not_Found：2011/11/18(金) 05:45:59.45 ID:649w/tNX
<div>
<p>あああ</p>
</div>

divに背景色つけてpにマージンつけた場合、マージン部分は色がつかない
ものですか？
681 ：Name_Not_Found：2011/11/18(金) 07:36:48.88 ID:???
>>680
その条件だけならマージンどころか Pは、無色透明無味無臭だ
色が付くのは、divであって、Pは透明だからdivの色が見えているだけ・・・
682 ：Name_Not_Found：2011/11/18(金) 08:34:20.84 ID:rOYVSJBz
>>681
説明不足でした。
pにもdivの背景色をつける予定だったのですが、pにmargin-top:10pxを設定すると白い空白ができてしまったもので。
条件はheaderに横並びのメニューバーを設定して次に<div id="main">で
<p>でパンクズリストを上マージン設定したら空白ができてしまうのです。
パディングなら大丈夫なので質問しました。
683 ：Name_Not_Found：2011/11/18(金) 13:14:03.46 ID:???
マージンは外側の余白だから背景色とか関係ないよ
684 ：Name_Not_Found：2011/11/18(金) 13:56:41.68 ID:???

□□□
□□■
□□□

表の中の一部のセル（■）の左右の線を消したいんですが、
わりと新しいIEですらborder-right-style:hiddenとかが機能しないのはなんででしょうか
685 ：Name_Not_Found：2011/11/18(金) 14:11:03.92 ID:???
>>684
border-styleプロパティの値にhiddenなんてないからじゃね
線消したいならnoneにしてみたら
686 ：Name_Not_Found：2011/11/18(金) 14:11:15.40 ID:???
IEで結合ボーダーモデルを適用したときの挙動はなんかおかしい
687 ：Name_Not_Found：2011/11/18(金) 14:12:49.89 ID:???
>>685
何を言ってるんだ
688 ：Name_Not_Found：2011/11/18(金) 14:13:41.60 ID:???
ごめん>>685は間違いhiddenはあったわ
689 ：Name_Not_Found：2011/11/18(金) 14:31:01.85 ID:???
なにこれhidden以外も効かない
690 ：Name_Not_Found：2011/11/18(金) 15:08:23.59 ID:???
hiddenじゃなくて背景色と同じ色を指定すれば
691 ：684：2011/11/18(金) 15:15:07.52 ID:???
それもできませんでしたｗ
692 ：Name_Not_Found：2011/11/18(金) 15:31:49.81 ID:???
>>684
対象のセルの一つ左の枠線が残っているからだろう
http://jsfiddle.net/gQfyJ/
693 ：Name_Not_Found：2011/11/18(金) 17:12:37.95 ID:???
>>692
うおー感謝です
各種ブラウザ旧IEまで全部見事に表示されました
694 ：Name_Not_Found：2011/11/19(土) 22:55:38.67 ID:???
http://dev.w3.org/html5/spec/Overview.html#phrasing-content
を開いて画面上部の要素がたくさん並んでいるところにカンマで要素が区切られてますが
これマウスで選択してもコピーできません
これはどのようにCSSでつけたのでしょうか？
695 ：Name_Not_Found：2011/11/19(土) 23:47:17.19 ID:???
>>694
after疑似要素
696 ：Name_Not_Found：2011/11/20(日) 05:21:24.61 ID:???
.
697 ：Name_Not_Found：2011/11/21(月) 03:16:03.20 ID:noGqrfaf
固定幅のボックスに対して文字列の幅を合わせて文字間隔を調整するようなのってできますか？
よくワードとかイラレとか印刷のソフトだとあると思うんですが、例えば

th { text-align:center; }

| 登録番号 |
| 形　　式 | <= これは間に全角スペースを2つ入れた
| 担当　者 | <= 同じ方法ではこれは合わない

またこの書き方ではそもそも「登録番号」をボックス幅に合わせていません。
文字数に合わせてletter-spacingを設定したクラスなんかを用意するのも考えましたが
何かthへの指定1発で指定できる方法があれば・・・
698 ：Name_Not_Found：2011/11/21(月) 09:05:52.13 ID:???
無理
IE独自ならあったんだけどね・・・
699 ：Name_Not_Found：2011/11/21(月) 10:16:15.24 ID:???
javascriptで良ければ>>173-229
700 ：639：2011/11/21(月) 10:25:00.66 ID:???
>>697
等幅フォントを指定すればよい
701 ：Name_Not_Found：2011/11/21(月) 10:27:46.31 ID:???
お前等幅フォントが何かわかってないだろ
702 ：639：2011/11/21(月) 11:38:16.48 ID:???
ここ煽りが多いな
703 ：Name_Not_Found：2011/11/21(月) 12:24:46.73 ID:???
>>702
分かってないだけ
間違った事覚えて言ってるのが明らかなのに、
それを指摘しないほうがおかしいだろ？

素直に認めて新しく覚えようって気持ちを持とうよ
704 ：Name_Not_Found：2011/11/21(月) 16:45:20.98 ID:???
>>700>>702
どんだけ639を馬鹿にしたいんだ？　粘着過ぎるだろ
705 ：697：2011/11/21(月) 21:03:37.84 ID:noGqrfaf
>>698-700
ありがとうございます。
無難に見えるようなんとか工夫してみようと思います
706 ：Name_Not_Found：2011/11/21(月) 21:06:50.52 ID:???
10秒考えちまった
639語って貶めたい荒らしってことなら
見当違い喋ってるのも納得
707 ：Name_Not_Found：2011/11/21(月) 21:33:41.09 ID:???
30秒考えちまった
騙って　か
708 ：Name_Not_Found：2011/11/22(火) 08:13:39.21 ID:???
>>697は、
＞何かthへの指定1発で指定できる方法があれば・・・
一発と言ってるだろがバカかお前ら
709 ：Name_Not_Found：2011/11/22(火) 08:20:38.97 ID:???
バカって言う方が（ｒｙ
710 ：Name_Not_Found：2011/11/22(火) 10:19:59.55 ID:???
>>708
そのくらい文脈から意味読み取れよ
711 ：Name_Not_Found：2011/11/22(火) 13:26:26.66 ID:iS0pVPSU
<ヘッダー>
<コンテンツ>(左本文、右サイドバー)
<フッター>
という構成で(本文)に質問集を作りました。
最初に質問を並べてページ内リンクで後半に答えを並べました。
リンクは普通に機能するのですが、ブラウザの(戻る)で戻ると
<コンテンツ>部分の上部20pxくらいが隠れて表示されなくなってしまいます。
(右サイドバーの上の方も削られてしまう。ヘッダは普通に表示される。)
ie8では起こらずie9、firefoxの今のやつで起こります。何が原因でしょう？
712 ：Name_Not_Found：2011/11/22(火) 14:24:49.92 ID:???
それは「戻る」とか無関係におかしなCSSなんだろｗ
713 ：Name_Not_Found：2011/11/22(火) 14:58:46.10 ID:???
>>711
原因は分かった！
お前のソース！どや！


真面目な話原因が起きてるソースを見せなさい
見せられない部分は隠してな
714 ：Name_Not_Found：2011/11/22(火) 16:39:45.43 ID:???
<div id="txt">サンプル</div>
このタグのテキストを中央垂直に表示させたいのですがなりません

width:500px;
height:500px;
text-align:center;
vertical-align: center;
715 ：Name_Not_Found：2011/11/22(火) 17:03:11.41 ID:???
>>713
いろいろ調べましたところ、（戻る）は関係なく、ページ内リンクをクリックした瞬間
20PXくらい下にずれることがわかりました。
<div id="contents">（全体）
<div id="header">

<div id="container">
<div id="main"><div id="menu">(floatで左右に分けてる）
<!--- container終わり--->

<div id="footer">
<!--- contents終わり -->

こんな感じの構成で、さらにいろいろ調べたところ、clearfixが怪しいみたいです。
<div id="container" class="clearfix">
と#containerにclearfixをかけているのですが、これをはずすと問題ないみたいです。
なぜかよくわかりません。
716 ：Name_Not_Found：2011/11/22(火) 17:03:59.60 ID:???
clearfixは
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {
display: inline-block;
}

* html .clearfix {
height: 1%;
}

.clearfix {
display: block;
}
です。適当にどこかにあったのをコピペしたものです。
717 ：Name_Not_Found：2011/11/22(火) 17:17:16.05 ID:???
>>714
つ　line-height:500px;

vertical-alignは<div>とかブロックレベル要素には使えないよ。
718 ：Name_Not_Found：2011/11/22(火) 17:21:22.83 ID:???
>>714
http://jsfiddle.net/NUnP7/

おわかり頂けるだろうか。
vertical-align;center;ではなくmiddleだという事に。
そして、この垂直方向の設定は、ボックス全体ではなく
1行の垂直方向の設定であるという事に。
なので、これは1行の高さを100％にしてmiddleにもってきている。

ただ、この方法はあくまで
サンプルというテキストをとりあえず中央に持ってきたいという要望への回答
他の方法での使い方を考慮していない
719 ：718：2011/11/22(火) 17:22:12.38 ID:???
おれの回答がスロウリィ！？
720 ：718：2011/11/22(火) 17:23:50.35 ID:???
>>716
そのソースだけを見るとdiv閉じてないように見えるんだけど
エスパーしろって事でいいよね？
721 ：718：2011/11/22(火) 17:39:39.77 ID:???
>>716
http://jsfiddle.net/64SGS/
ここまで再現したんだけど、これだけで問題が起きるとも思えないんだ
続きを書いてくれない？
おれエスパーじゃなかったみたいだわ
これ以上お前のソースコードがどうなってるのか、予測することができない
722 ：Name_Not_Found：2011/11/22(火) 18:21:32.21 ID:???
>>721
なんとなく解決しました。
最初（ページ内リンク　ずれ）とかで検索しててもちっともわからなかった
のですが、（ページ内リンク　clearfix ずれ）で検索したらそれらしき答え
がわかりました。

最終的な原因としては、「アンカーを配置している要素の親要素に”overflow:hidden”
が指定されているとその親要素が上にずれる」とのことのようです。

自分のclearfixにはoverflow:hiddenはなかったのですが、div id="container"に
overflow:hiddenが別に指定してありました。これはずしたらみごとに直りました。

overflow:hiddenかclearfixをはずさないといけないみたいです。
このページには両方必要ないのではずすことにしました。
お騒がせしました。

丸一日悩みましたがこれでばあちゃんの法事にいけます！
723 ：721：2011/11/22(火) 18:27:22.45 ID:???
>>722
だから最初からちゃんとソースかけつってんだろｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
ふっざけんなよおまえｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
ちゃんと法事いってこいよなｗｗｗｗｗｗくそうｗ
724 ：Name_Not_Found：2011/11/22(火) 19:17:12.94 ID:???
ここにソースアップするために余計な部分削ってたらわかりました。
このスレのおかげです。

(-人-)ﾅﾑﾅﾑ
725 ： 忍法帖【Lv=35,xxxPT】 ：2011/11/25(金) 04:48:40.18 ID:???
ﾜﾛﾁ
726 ：Name_Not_Found：2011/11/25(金) 19:34:18.74 ID:???
input type="submit" class="submitbtn"
というボタンに、
.submitbtn {
　min-width: 200px;
}
としたら、Firefox8では効くのに、Chrome15では効きません。
なぜでしょうか。

727 ：Name_Not_Found：2011/11/26(土) 00:36:34.16 ID:R5yfQHON
http://jsfiddle.net/FeDNE/

<textarea id="example"></textarea>

body > *:not(#example){
display: none;
}

Google Chrome のみ、テキストボックスで貼り付けが出来なくなります
これは Google Chrome の既知のバグなのでしょうか
回避するにはどうすればいいでしょうか
728 ：Name_Not_Found：2011/11/29(火) 06:38:37.09 ID:???
できるよ
729 ：Name_Not_Found：2011/11/29(火) 18:27:16.32 ID:???
日本語でおｋ
730 ：Name_Not_Found：2011/11/30(水) 21:35:53.39 ID:???
センタリングしたテーブル内のセルにもセンタリング指定してしてるんだけど
win IE6で見た時だけ若干5px？ほど左に寄ってる。
これを直す方法ないですか？
731 ：Name_Not_Found：2011/12/01(木) 02:04:07.88 ID:???
ハックしろ
ソースみせろ
732 ：Name_Not_Found：2011/12/02(金) 12:38:31.25 ID:???
オススメの仕様書ありませんか？
733 ：Name_Not_Found：2011/12/02(金) 12:53:38.02 ID:???
w3c
734 ：Name_Not_Found：2011/12/02(金) 15:15:43.59 ID:???
おれがルール
735 ：Name_Not_Found：2011/12/03(土) 00:11:19.17 ID:???
＜p id="aaa"＞AAA＜/p＞
＜p id="bbb"＞BBB＜/p＞
というHTMLがあって、通常ならAAAが先に表示されると思いますが、そうではなく、
BBBのほうをさきに（上に）表示させるようなことはできますか。
できればheightを指定せずに任意の高さでも利用できる方法がいいです。
HTML構造が固定されたブログで、CSSだけで順番を入れ替える必要があります。
736 ：Name_Not_Found：2011/12/03(土) 02:38:06.48 ID:???
できます
737 ：639：2011/12/03(土) 14:24:05.54 ID:???
>>732
仕様書って一つしかないでしょ
お勧めってどういう事？お勧めの和訳？
738 ：Name_Not_Found：2011/12/03(土) 14:25:16.99 ID:???
×仕様書
○リファレンス
こういうことかな？
739 ：Name_Not_Found：2011/12/03(土) 17:26:51.20 ID:SCpm5mGJ
>>736
どうやるの？
740 ：Name_Not_Found：2011/12/03(土) 18:40:25.74 ID:???
>>739
BBBが上に表示されるようにCSSを書く
741 ：Name_Not_Found：2011/12/03(土) 18:59:06.28 ID:???
>>739
うーん、左右の入れ替えならともかく、多分cssでは無理じゃないかなぁ・・・
AAAの高さが任意なので、BBBに対してpositionはまず使えないと思います。
なのでcssでは無理じゃないかな、と。

そうなるとjQueryを使って動的に入れ替えるのがベストかと思います。
テンプレートの<head>部分にjsファイルの呼び出しをいれれば、
全ページ適用されて問題なさそうと思うのですが、いけそうでしょうか？
jsファイルのアップロードができないなら、直接書き込んでしまっても構いません

いけそうなら方法を提示します。
742 ：Name_Not_Found：2011/12/03(土) 19:00:08.49 ID:???
ちなみにcss3ならできるんだけど、使われてないブラウザもあるしね・・・
743 ：Name_Not_Found：2011/12/03(土) 19:22:15.82 ID:XhN/Y5BY
>>735
面倒だろ。

＜p id="aaa"＞BBB ＜/p＞
＜p id="bbb"＞AAA＜/p＞

でいいじゃん。
744 ：Name_Not_Found：2011/12/03(土) 19:29:16.17 ID:???
>>736
>>740
こういう馬鹿って、わざわざ自分の馬鹿を他人に知らしめて喜んでるの？
745 ：Name_Not_Found：2011/12/03(土) 20:53:27.58 ID:???
>>744
ついでに
>>742もつけ加えておくべきだと思うよｗ
746 ：Name_Not_Found：2011/12/03(土) 20:54:18.09 ID:???
まちがえた.
>>744
>>743
だった
742は自分でした＾ｑ＾ｱｳｱｳ
747 ：Name_Not_Found：2011/12/04(日) 01:28:56.97 ID:???
┌─┐　←div1
┌─┐　←div2
┌─┐　←div3
│　 │
│　 │
└─┘

html+css（バージョン問わず）だけでこのようにdivを縦に重ねて配置することは可能でしょうか？
z-indexは別途javascriptで調整するので問題ないです。
position:absoluteで出来るのはわかっているんですが、自動配置で可能なら教えていただきたいです。
748 ：747：2011/12/04(日) 02:33:22.95 ID:???
自己解決しました。
:first-child以外のmargin-topをマイナスにすればいけるのね。
749 ：Name_Not_Found：2011/12/04(日) 10:09:28.55 ID:???
>>748
マイナスにするのを
ネガティブマージンと呼ぶのですが
他ブラウザで大きく崩れる事があるのでブラウザチェック忘れずに☆（ゝω・）vｷｬﾋﾟ
750 ：747：2011/12/04(日) 16:44:55.96 ID:???
>>749
わざわざありがとう！
まだ実験的なプロジェクトなので必要になった時は気をつけたいと思います。
751 ：Name_Not_Found：2011/12/04(日) 23:04:58.16 ID:???
<a>
　<b/>
　<b/>
　<b/>
　<b/>
</a>
上記の内、上から3番目のbタグのみにCSSを適用するにはどうすればいいでしょうか？
752 ：Name_Not_Found：2011/12/05(月) 00:08:36.62 ID:???
セレクタ指定すれば良いんじゃない？
753 ：Name_Not_Found：2011/12/05(月) 00:17:16.78 ID:???
b:nth-child(3)
754 ：think49 ◆bKk/qcAKuM ：2011/12/05(月) 03:30:00.60 ID:???
>>727
今更ですが、再現条件は全称セレクタを使用する場合(全称セレクタを省略するパターンを含む)に限定されるようです。
http://cssdesk.com/DsbeQ
http://cssdesk.com/CRhQ2
タイプセレクタで必要な文だけ指定すれば回避可能と思われます。
(ついでにバグ報告すると、次期バージョンで修正されるかもしれません)
755 ：727：2011/12/05(月) 17:58:34.02 ID:CJq/YNuj
>>754
ありがとうございます
ページ全体を書き換えるユーザースクリプトを使っているので
出来れば全称セレクタで済ませたいと考えています

いちおう、今のところ以下のような指定で応急処置しております
あとこの場合の全称セレクタは省略出来るんですね。参考になりました

http://jsfiddle.net/FeDNE/1/
body > *:not(#example){
position: absolute; left: -9999px;
}
756 ：Name_Not_Found：2011/12/06(火) 11:10:22.19 ID:???
>>752
ユーザーCSSを適用したいのでそれなしで出来ませんかね？
757 ：Name_Not_Found：2011/12/06(火) 11:37:51.07 ID:???
>>756
>>753
758 ：Name_Not_Found：2011/12/06(火) 16:16:28.46 ID:???
<table><tr><td>愛</td><td>牛</td></tr><tr><td>絵本</td><td>音</td></tr></table>

上記のように2列のテーブルを作りたいのですが、CSSで作れたりしますか？

かな順で単語を並べたいので上記テーブルに椅子とかを入れたい場合苦労します。

759 ：Name_Not_Found：2011/12/06(火) 17:32:54.26 ID:???
それはテーブルじゃなくてリスト
ol要素を使いなさい
760 ：Name_Not_Found：2011/12/06(火) 18:29:10.65 ID:???
なんでol限定なんだ
761 ：Name_Not_Found：2011/12/06(火) 18:35:01.85 ID:???
何でマークアップにバラエティを求めるん？
762 ：Name_Not_Found：2011/12/06(火) 22:20:21.67 ID:???
divの要素の中に別のhtmlを表示する方法って無いですか？
サイトのリンク（共通ファイル）を表示しようと思うのですが、iframeはもう推奨されないと聞いたので
763 ：Name_Not_Found：2011/12/06(火) 22:25:20.85 ID:???
JavaScript
764 ：Name_Not_Found：2011/12/06(火) 22:31:27.46 ID:???
>>762
iframeは一度非推奨になって廃止されたけど復活したよ
iframe使えないHTMLのバージョンならobject使えばいい
765 ：Name_Not_Found：2011/12/07(水) 17:04:30.49 ID:???
tableのtdにボーダーを設定しているのですが、IEだと普通に表示されるのに
Firefoxだと一部のボーダーが表示されません。
ローカルではちゃんと表示されてたのにサーバーにアップしてみて見ると
表示が崩れています。
なんでしょう？
766 ：Name_Not_Found：2011/12/07(水) 18:01:53.57 ID:???
>>765
http://jsfiddle.net/
切り貼りしてみるといい
767 ：Name_Not_Found：2011/12/08(木) 14:17:48.92 ID:Pf4bvZsJ
<div id="long-content">
　　<div id="bg"></div>

</div>
768 ：751：2011/12/08(木) 14:33:10.24 ID:???
>>753
>>757
ありがとうございます
769 ：Name_Not_Found：2011/12/08(木) 14:33:21.22 ID:Pf4bvZsJ
<div id="long-content">
　　<div id="bg"></div>
　　<!-- #bgの背景を#long-contentの上に被せ、縦にループさせたい -->
　　長いコンテンツ
　　　　　　：
　　　　　　：
　　　　　　：
</div>
上記のように#bgの背景に画像を指定して、縦に（y方向に）ループさせて
コンテンツ（#long-content）の上をかぶせる形にしたいのですが、
どうしたらいいでしょうか。

・コンテンツの長さは不明＝heightで指定できない
・生javascriptやjqueryを使用して、#long-contentの
　offsetHeightなどを取得して#bgのheightに指定してみましたが、正確なheightが得られなかったり、
　ブラウザ間でまったく違う長さになってしまいます。

上記のような問題があり、2日ぐらい悩んでいまだ完全に解決できていません。

現在は、
#bg { height:999999px; }
#long-content { overflow:hidden; }
のようにかなり#bgを縦長にして、余った部分はhiddenさせる、
というようにしています。
これで見た目的には問題なくなったのですが、
ページ内リンク（xxx.html#test1）をクリックすると、
その#test1部分に移動するのですが
それより上の要素が完全に消えてしまいます。
ただ、height:999999pxの指定を解除すると、正常に動作するのでこれのせいなのは確かだと思いますが・・・

どう解決すればいいでしょう？
770 ：Name_Not_Found：2011/12/10(土) 12:34:10.19 ID:???
>>764
ありがとう。復活したのか。
object使ったけど、よくわからん。
object内で表示しているリンクを踏んだ時、自分の枠以外のページを書き換え（フレームで言う、子のフレームのリンクで親フレームのhtmlを飛ばす感じ）るやり方が分からない
771 ：Name_Not_Found：2011/12/10(土) 13:13:47.31 ID:???
>>770
iframeと一緒にtarget属性も復活したよ

HTML5 DOMのWindow.parent.location.assignとか使うって手段もあるだろうけど
そうするくらいなら、移行型なりHTML5なり使った方が
772 ：Name_Not_Found：2011/12/10(土) 15:40:56.51 ID:???
<dt><dd>
で、dtを左に、ddを右に配置したいんだけどCSSどうかけばいいかな

<dt><山田太郎</dt>
<dd>こんにちは<br>山田太郎です<br>20才です</dd>

これが

山田太郎　こんにちは
　　　　　　　山田太郎です
　　　　　　　20才です

こんな感じになるようにしたいんです
773 ：Name_Not_Found：2011/12/10(土) 15:58:54.96 ID:???
dt, dd{
display: table-cell;
}
774 ：Name_Not_Found：2011/12/10(土) 19:12:34.33 ID:???
dl {line-height: 1.6em;}
dt {width: 10em;}
dd {margin-left :10em; margin-top :-1.6em;}
775 ：Name_Not_Found：2011/12/10(土) 20:16:48.81 ID:???
<a href="http://d.hatena.ne.jp/xxx/20111125"><span class="date">November 25(Fri),2011</span></a>
に対して、
.date{font-style: italic; color:black;}でfont-styleは変わるのに色が変わらないときってどうすればいいでしょうか？
776 ：Name_Not_Found：2011/12/10(土) 21:23:04.75 ID:???
color:black !important;でどう？
777 ：Name_Not_Found：2011/12/10(土) 23:12:18.96 ID:???
>>776
ありがとう。解決しました。
778 ：Name_Not_Found：2011/12/11(日) 15:56:28.05 ID:???
>>774　それ、フォントサイズに対応しないね
779 ：Name_Not_Found：2011/12/12(月) 19:52:24.43 ID:???
教えてください、こういう多段のblockquoteってどうやって定義したらいいんでしょうか？

http://ggsoku.com/2011/10/multitouch-patent/

http://beebee2see.appspot.com/i/azuYybetBQw.jpg
780 ：Name_Not_Found：2011/12/12(月) 19:59:53.44 ID:???
子孫結合子
子結合子
781 ：Name_Not_Found：2011/12/13(火) 22:03:00.90 ID:???
display:table-cellを使って
こういう表示にしたい

<div style="display:table-row">
<dt>１ばんめ</dt>
<dd>テキスト</dd>
</div>

<div style="display:table-row">
<dt>２ばんめ</dt>
<dd>テキスト</dd>
</div>

これを
１番目　　２番目
テキスト　テキスト

こんな風に改良したい。
普通にdisplay:table-rowを使っちゃうと
１番目　テキスト
２番目　テキスト

みたいになるんだが、どうやればいい？
782 ：Name_Not_Found：2011/12/14(水) 10:25:02.43 ID:???
なんでdivの直下にdtが来てるんだよ
783 ：Name_Not_Found：2011/12/14(水) 17:11:59.95 ID:???
>>781
まず基本を覚えろよ
784 ：Name_Not_Found：2011/12/14(水) 20:44:21.84 ID:JmiRP2lb
<div style="display:table-cell">
<dt style="display:table-row">１ばんめ</dt>
<dd>テキスト</dd>
</div>

<div style="display:table-cell">
<dt style="display:table-row">２ばんめ</dt>
<dd>テキスト</dd>
</div>
785 ：Name_Not_Found：2011/12/14(水) 22:00:28.64 ID:???
>>784
>>782-783
786 ：Name_Not_Found：2011/12/15(木) 18:30:58.34 ID:???
<x>
　　<y class="abc"/>
　　<y class="def"/>
　　<y class="ghi"/>
</x>
とあるとき、classがabc以外のyタグにスタイルを適用したい場合、どのように書けばいいでしょうか？
787 ：Name_Not_Found：2011/12/15(木) 18:48:20.85 ID:???
>>631-632
788 ：786：2011/12/15(木) 19:10:34.87 ID:???
>>787
これ質問したの自分でした
大ボケかましてたようです、ありがとうございます
789 ：Name_Not_Found：2011/12/15(木) 19:23:30.29 ID:ElmWUkHm

<dl style="display:table-cell">
<dt style="display:table-row">１ばんめ</dt>
<dd>テキスト</dd>
</dl>

<dl style="display:table-cell">
<dt style="display:table-row">２ばんめ</dt>
<dd>テキスト</dd>
</dl>

あほだ
790 ：Name_Not_Found：2011/12/15(木) 20:02:21.23 ID:???
dl要素分けるのはおかしいわな
791 ：Name_Not_Found：2011/12/15(木) 20:09:43.57 ID:???
そいう時にこそ、<table>使用
792 ：Name_Not_Found：2011/12/15(木) 22:15:39.25 ID:???
CSS3が普及するまではtable使うのが無難だろうな
793 ：Name_Not_Found：2011/12/15(木) 22:54:03.33 ID:???
CSS3が普及しても、
インターネットエクスプローラ(笑)を使うバカが減らないとどうしようもないね。
いまだに何年も前のIE7、IE6だけのことを考慮しなきゃならないこともあるしな。

あと６年後
text-shadowを使いたい！box-shadowを使いたい！animationを使いたい！
last-childを使いたい！

↓

それIE8に対応してねーじゃん。使うなボケ
794 ：Name_Not_Found：2011/12/15(木) 22:57:06.10 ID:???
ウィンドウズに最初から入ってるインターネッツ以外はインターネッツじゃないから！
795 ：Name_Not_Found：2011/12/15(木) 23:14:19.68 ID:???
普及したってのはバカが減ったって意味だよ
796 ：Name_Not_Found：2011/12/15(木) 23:18:55.74 ID:???
>>793
XPのサポートあと2年ちょっとだよ
797 ：Name_Not_Found：2011/12/16(金) 01:43:57.01 ID:???
<div>
あああああ
</div>

このdivを、中に入ってる文字にあわせてwidthを変えるにはどうすればいいかな
文字サイズを変更したり、中の文字が動的に変わる場合に、divのborderが左右に伸びるようにしたいんだけど。
798 ：Name_Not_Found：2011/12/16(金) 04:27:46.67 ID:???
width: auto;
float: left;
799 ：Name_Not_Found：2011/12/16(金) 14:46:36.19 ID:S5tLjTAA
まあ使うほうからしたらIE6でべつに不自由ないからなあ
ＨＰ見る人にしてみればデザインなんてどうでもいいもん
800 ：Name_Not_Found：2011/12/16(金) 16:54:26.13 ID:5vXYz3Ew
a{
display:block;
width:100%;
}

というcssですが
aタグが端から端まで広がってくれません。

中に含まれるのはimgタグとspanタグで

span{
display:block;
margin-left:110px;
}

marginはレイアウト都合。

span{
display:block;
width:100%;
padding-left:110px;
}

にすると広がりますが、右に空白のスクロール部分ができてしまいます。

どうすればaタグが広がってくれるでしょうか。
801 ：800：2011/12/16(金) 16:57:47.64 ID:5vXYz3Ew
>>800ですがPC上のsafariやChromeでは思い通りに見えているのですが
Androidのブラウザでは上記のような動きになってしまいます。
802 ：Name_Not_Found：2011/12/16(金) 20:08:26.54 ID:DzzVp637
広がってるだろ

borderでも追加して確認してみ？
803 ：Name_Not_Found：2011/12/17(土) 00:51:10.77 ID:???
CSS3良いなぁ。
box-shadowで影をつけたり、animationで動かしたり。
もはやHTMLは文章の構造を示すというより、backgroundのあるdivで作った矩形をたくさん配置してグラデーションやアニメーション
をたくさん作るためのものだな。
DIVが大量の予感！
804 ：Name_Not_Found：2011/12/17(土) 01:06:59.60 ID:???
逆だボケ
805 ：Name_Not_Found：2011/12/17(土) 01:34:26.95 ID:???
そろそろW3Cはbackground-colorを指定したらcolorも指定すべき
みたいなのやめろよｗ

装飾のためだけに色を塗って、文字を書く予定がない領域なんていくらでもあるだろうに。
806 ：Name_Not_Found：2011/12/18(日) 06:46:12.52 ID:???
>>805
それはない
807 ：Name_Not_Found：2011/12/20(火) 15:32:57.63 ID:???
>>805
装飾のためだけに色を塗って、文字を書く予定がない領域なんて
オレは無い
808 ：Name_Not_Found：2011/12/20(火) 17:11:58.28 ID:???
>>805
それは前景だろ、背景じゃない
809 ：Name_Not_Found：2011/12/20(火) 23:09:04.72 ID:???
>>807
お前にはなくても俺はある
<div></div>

div{
810 ：Name_Not_Found：2011/12/20(火) 23:11:28.53 ID:???
途中でかきこんでしまった

div{
height 100px;
width: 100px
background-image: url(picture.jpg);
}

俺はこうする。
構造と描写はわける！
とかいうならCSSのほうにpositionとかいれたらHTMLにdiv書かなくても色や背景ぬらせろやｗ
811 ：Name_Not_Found：2011/12/21(水) 00:41:59.40 ID:???
img要素の間違いでは
812 ：Name_Not_Found：2011/12/21(水) 00:43:52.49 ID:???
>>810
backgroundはdiv以外でも使えるよ
813 ：Name_Not_Found：2011/12/21(水) 01:20:09.65 ID:???
>>810
だからそれは前景だろ
img要素を使うべきだ
814 ：Name_Not_Found：2011/12/23(金) 03:32:59.07 ID:???
子要素はposition:relativeとz-indexやっても前面に出ちゃうだけど
子要素後ろに隠す方法はどうやるの？

<body>
<div id="ue">
<div id="sita">
</div>
</div>
</body>


div{
position: relative;
width: 100px;height: 100px;
}
#ue{
z-index: 1;
background-color: red;
}
#sita{
z-index: -1;
background-color: blue;
}

これで、sitaがz-indexが-1だから下になって、赤く表示させたいんだけど。
815 ：Name_Not_Found：2011/12/23(金) 09:42:29.02 ID:???
div{
width: 100px;height: 100px;
}
#ue{
z-index: 1;
background-color: red;
}
#sita{
position: absolute;
z-index: -1;
background-color: blue;
}
816 ：Name_Not_Found：2011/12/27(火) 11:38:21.69 ID:???
高さ100の左ペインを作りたいんだけど、

html,body {
height: 100%;
}

div#wrapper {
height: 100%;
}

div#left-pane {
float: left;
height: 100%
}

にしても高さ100%にならないんだけど、どうすればいいでしょうか?

IE8,Chrome16
817 ：Name_Not_Found：2011/12/27(火) 15:40:35.41 ID:???
bodyとかに余白あるからはみ出るんじゃない
818 ：Name_Not_Found：2011/12/27(火) 21:28:11.86 ID:???
なんでblock要素はvertical-alignがきかないのよ
二行以上のときはいちいちpaddingをピクセル単位で細かく調整しろと？しかも
ブラウザの文字サイズを大とか小にすると行数変わると中央じゃなくなってダサいし。

display:tableやったらposition:relativeと子要素のabsolute聞かなくなってマジウンコすぎるし
なんなんだよ。複数の行があって、中央ぞろえにして、しかも文字サイズの大とか小とかでもレイアウトが崩れないようにするには
全部jpgにしてimgタグつかえってことか？
819 ：Name_Not_Found：2011/12/28(水) 00:29:23.20 ID:???
と、DPT屋の貴重なご意見でした
820 ：Name_Not_Found：2011/12/28(水) 01:27:59.59 ID:???
上下中央できないサンプルソース出せ
821 ：Name_Not_Found：2011/12/28(水) 01:32:54.93 ID:???
確かにverticalは使い勝手悪い気がするわ。
822 ：Name_Not_Found：2011/12/28(水) 01:38:06.55 ID:???
boxでも使っとけば
823 ：Name_Not_Found：2011/12/28(水) 01:45:28.56 ID:???
ユーザーCSSで、特定のURLを表示させなくするには
a[href*="特定のURL"]
{ display: none !important; }
みたいにすればいいけど、
特定のURLを含むリスト全体を表示させなくする機能ってある？
具体的には、
<li>a.net</li>
<li>b.com</li>
<li>a.net</li>
<li>c.jp</li>
となってて、b.comを含む<li>だけを非表示にしたい。
824 ：Name_Not_Found：2011/12/28(水) 01:59:17.79 ID:???
っ ユーザースクリプト
825 ：Name_Not_Found：2011/12/28(水) 02:02:52.81 ID:???
垂直中央デモとしてこんなのあるけどどれもメリット・デメリットあるのね
http://douglasheriot.com/tutorials/css_vertical_centre/demo4.html
826 ：Name_Not_Found：2011/12/28(水) 02:08:26.28 ID:???
>>823
擬似要素というのがあってだな･･･
http://zero.css-happylife.com/selectors/nth-child.shtml
827 ：Name_Not_Found：2011/12/28(水) 02:12:12.47 ID:???
インターネットエクスプローラーだと働かない→どうでもいい
HTMLにDIVが増える→どうでもいい

1行じゃないとき(2行以上のとき)、レイアウトがbadになる→非常に問題
828 ：Name_Not_Found：2011/12/28(水) 02:14:52.54 ID:???
まぁIE無視でいいならwrapperの子要素にtable-cell、vertical-alignでいいよね
829 ：Name_Not_Found：2011/12/28(水) 02:26:21.94 ID:???

　な　ん　な　ん　だ　　こ　の　低　ラ　ベ　ル　は !
830 ：Name_Not_Found：2011/12/28(水) 02:28:31.78 ID:???
boxでええんとちゃう？
831 ：Name_Not_Found：2011/12/28(水) 02:39:52.23 ID:???
>>828
position:absoluteにするとtable-cellが無効になるから論外
832 ：Name_Not_Found：2011/12/28(水) 02:39:59.45 ID:???
boxってそんなに使い勝手いいの？
833 ：Name_Not_Found：2011/12/28(水) 02:53:24.25 ID:???
そりゃあもう
834 ：Name_Not_Found：2011/12/28(水) 02:57:16.11 ID:???
ググッてみたら案の定便利杉ワロタ
835 ：Name_Not_Found：2011/12/28(水) 03:18:58.64 ID:???
float使わないでも横配置にできるってやつだっけ
836 ：Name_Not_Found：2011/12/28(水) 03:20:15.96 ID:???
そうらしい。
clearfixもいらないとか。
837 ：Name_Not_Found：2011/12/28(水) 12:32:54.15 ID:???
>>826
ありがとう
でもそれだと順番が変わったときに機能しなくなるよね・・・
具体的にやりたいことは、pixivで特定のユーザーの絵を非表示にしようと思ってるんだけど
検索結果で、絵１枚ごとに
<li>
絵
タイトル
投稿者
</li>
という要素でできてるんだけど、
絵と投稿者はユーザーIDが使われてるからa[href*でいけるんだけど
タイトルは絵のIDしか使われてないから
新しい絵が投稿されたらタイトルだけ表示されちゃうんだよね
だからユーザーIDを含むリストごと非表示にしたいんだけど
やっぱ>>824の言うとおり？ユーザースクリプト使うしかないんかな
838 ：Name_Not_Found：2011/12/28(水) 12:59:39.79 ID:???
>>837
初めからそう言えばいいじゃん
隣接セレクタ使え
839 ：Name_Not_Found：2011/12/28(水) 13:48:28.83 ID:???
>>838
ありがとうかなり近いわ

<p>
　<img src="URL">
</p>
<h1>
タイトル
</h1>

こうなってる場合って隣接セレクタにはならんけど
どうすりゃいいのかな？
p+h1 にしちゃうと全部非表示になっちゃうから
特定のURLを含むpというふうに指定したい

一番いいのは
子孫セレクタの逆で、親要素に対して影響するセレクタがあればいいんだけど・・・
840 ：Name_Not_Found：2011/12/28(水) 13:55:13.16 ID:???
それはどこのページだよ
a要素ごと消すんじゃないんか？

先祖セレクタもどきはCSS4だよ
841 ：Name_Not_Found：2011/12/28(水) 14:01:06.71 ID:???
>>840
pixivのタグ検索のページ
<li class="image">
　　<a href="/member_illust.php?mode=medium&illust_id=イラストのID">
　　　　<p>
　　　　　　<img src="http://img*.pixiv.net/img/ユーザーID/イラストのID_s.jpg">
　　　　</p>
　　　　<h1>
　　　　タイトル
　　　　</h1>
　　</a>
　　<p class="user">
　　　　<a href="/member.php?id=ユーザーID">soba</a>
　　</p>
　　<ul class="count-list">
　　　　<li>
　　　　　　<a href="/bookmark_detail.php?illust_id=イラストのID" class="bookmark-count ui-tooltip" data-tooltip="＊件のブックマーク">
　　　　　　　　<span class="count-icon"> </span>＊
　　　　　　</a>
　　　　</li>
　　</ul>
</li>

こうなってるんだけど、
目標はユーザーIDを含む<li>要素全体を非表示にすること
842 ：Name_Not_Found：2011/12/28(水) 14:05:29.87 ID:???
簡略化すると
<li>
　　<a>
　　　　<p>ユーザーID</p>・・・１
　　　　<h1></h1>・・・２
　　</a>
　　<p>ユーザーID</p>・・・３
　　<ul></ul>・・・４
</li>

１と３はユーザーIDを指定すれば消せるけど
２と４はイラストIDを指定しないと消せないから新しいイラストが投稿されればまた表示されてしまう
だから隣接セレクタを使って１+２、３+４にするか
先祖セレクタでユーザーIDを含む<li>を非表示
にしたい
843 ：Name_Not_Found：2011/12/28(水) 14:13:42.05 ID:???
a[href*=000000] , a[href*=000000] ~ *

li ごと消すのは現状ユーザースタイルでは無理
844 ：Name_Not_Found：2011/12/28(水) 14:21:11.78 ID:???
>>843
?selecterはまだ対応してないみたいだな・・・
やっぱり隣接セレクタを使って
<p>
　　<img src="http://img*.pixiv.net/img/ユーザーID/イラストのID_s.jpg">
</p>
<h1>
タイトル
</h1>
で、
【img[src*="/ユーザーID/"]を含む<p>】の隣にある<h1>を非表示にする
という記述をしたいけどこれは現状でも出来る？
845 ：Name_Not_Found：2011/12/28(水) 14:27:44.23 ID:???
>>844
だからそれは隣接してないだろう。親セレクタないと無理だろ

imgは表示させときたいんか？
a[href*=ユーザーID] > h1
846 ：Name_Not_Found：2011/12/28(水) 14:29:21.05 ID:???
こうしときゃ見た目は期待通りになるだろ

li.image{
width: auto !important;
}

li.image p, li.image h1{
width: 164px !important;
}
847 ：Name_Not_Found：2011/12/28(水) 14:29:29.03 ID:???
>>845
pとh1は隣接してるからなんとかならんかと思ったけど無理か
848 ：Name_Not_Found：2011/12/28(水) 14:40:00.03 ID:???
>>846
横幅を164に固定
849 ：Name_Not_Found：2011/12/28(水) 14:40:53.90 ID:???
>>848
間違ってenter押してしまった

横幅を164に固定するってことだよね？
見た目変わらんのやけど
850 ：Name_Not_Found：2011/12/28(水) 14:44:33.46 ID:???
>>849
ユーザースタイルに書いたコードとブラウザとバージョンは？
851 ：Name_Not_Found：2011/12/28(水) 14:46:59.14 ID:???
>>850
Chromeの最新版に>>846をコピペしただけ
852 ：Name_Not_Found：2011/12/28(水) 14:47:36.13 ID:???
chrome stylistっつう任意のCSSを適用できる拡張機能があるから
それを使ってる
853 ：Name_Not_Found：2011/12/28(水) 14:51:16.07 ID:???
pxを狭くしたらスクロールバーが出てきたから適用されてるわ

でも俺は特定のユーザーの絵を完全に非表示にしたいんやけど

164pxにしても非表示にはならなくないか？
854 ：Name_Not_Found：2011/12/28(水) 15:06:48.44 ID:???
今のCSSじゃ無理っぽいからjavascriptで頑張ってみるわ
お前らありがとう
855 ：Name_Not_Found：2011/12/28(水) 15:10:33.35 ID:???
>>853
ごめん>>843は引用符必要だった
a[href*="000000"] , a[href*="000000"] ~ *
856 ：Name_Not_Found：2011/12/28(水) 15:58:07.11 ID:???
inline要素にしてtext-indent　-9999px
857 ：Name_Not_Found：2011/12/28(水) 20:56:37.33 ID:u/wyQkbt
<div>
<span id="a">a</span>
<span id="b">b</span>
<span id="c">c</span>
</div>
これをfloatやpositionを使わずに以下のようにしたいのですができますか？方法を教えてください
┌──────
│┌─┐┌─┐
││a. ││b. │
││ 　│└─┘
││　 │┌─┐
││　 ││c. │
│└─┘└─┘
858 ：Name_Not_Found：2011/12/28(水) 21:06:42.63 ID:???
floatやposition使えば
859 ：Name_Not_Found：2011/12/28(水) 21:19:16.13 ID:???
なんで拒むのかがわからん
860 ：Name_Not_Found：2011/12/28(水) 21:26:36.00 ID:???
display : blockとmargin-topやmargin-leftで無理やりいれればいい
861 ：Name_Not_Found：2011/12/28(水) 21:35:14.80 ID:???
>>860
そういう書き方するとなんかあったときのメンテナンスめんどいよな
862 ：857：2011/12/28(水) 21:44:20.53 ID:???
レスどうもありがとうございます
floatやpositionのほかに簡単な方法があるのかなと思って・・・
863 ：Name_Not_Found：2011/12/28(水) 21:48:50.08 ID:???
あとは<table>くらいじゃね？
864 ：Name_Not_Found：2011/12/28(水) 22:02:05.86 ID:???
これってどういうことなんだ・・・？
http://cssrefresh.frebsite.nl/
865 ：Name_Not_Found：2011/12/28(水) 22:05:02.64 ID:???
box-orient: vertical 指定して
box-lines: multiple 設定したらできるかもな
まだ box-lines に対応してるブラウザない思うけど
866 ：Name_Not_Found：2011/12/28(水) 22:12:43.17 ID:???
box系はIEには入れて欲しいな
867 ：Name_Not_Found：2011/12/29(木) 01:41:14.12 ID:???
IEおわっとる
クロスブラウザなんてウンコ

これからはサファリ、ファイアフォックス、クロム、オペラ
この４つでまともに見られればいいんじゃね
868 ：Name_Not_Found：2011/12/29(木) 02:21:41.53 ID:???
それでいいよね。
今作ってるストリーミングサイトがIEでみたら見事に崩れるもんだからIEに対応させるのがめちゃくそメンドイ。

MSはもうブラウザ開発やめちまえ
869 ：Name_Not_Found：2011/12/29(木) 03:31:44.16 ID:???
(´-`).。ｏＯ（腕が無いと大変なのだろう…）　
870 ：Name_Not_Found：2011/12/29(木) 05:22:57.80 ID:???
IEは論外だが、Operaのバグ放置も大概酷い
871 ：Name_Not_Found：2011/12/29(木) 18:01:27.16 ID:???
ある要素のwidthを100%にして、常に画面横幅いっぱいに表示したいのですが
横/縦の比率を常に一定にしたいです
その場合縦はどう指定すればいいのでしょうか？
%で指定すると、コンテンツの量によって縦幅変わってしまいますし、pxだと固定になってしまいます
872 ：Name_Not_Found：2011/12/29(木) 18:13:28.76 ID:???
operaは最初から相手にしてない
ログ見ても0.5～1％だし
873 ：Name_Not_Found：2011/12/29(木) 18:34:34.34 ID:???
携帯電話やゲーム機ではOperaが活躍している！というのも今は昔・・・
874 ：Name_Not_Found：2011/12/29(木) 18:45:08.35 ID:???
>>871
そういう計算（？）を利用したレイアウトはCSSじゃ無理
CSSレイアウトは800pxとか80%とか固定値しかできない
width=height/2
みたいなことは無理
javascript使おう
875 ：Name_Not_Found：2011/12/30(金) 01:38:45.14 ID:???
とあるサイトのソースなんですが、
下記のソースのスポンサードリンクの入った .topBox を消したい場合、
.topBox:nth-child(2) { display:none!important; } でいいんでしょうか？

<div id="contentTop">
<p>
<p/>
<div class="topBox">
<p/>
<div class="topBox">
<p style="font-size: 10px; margin-bottom: 4px; ">スポンサードリンク</p>
<p class="box">
</div>
<div class="topBox">
<div class="topBox">
<div class="topBox" style="margin-bottom: 10px; ">
</div>
876 ：Name_Not_Found：2011/12/30(金) 01:40:09.65 ID:???
ごめんなさい。自己解決しました。5でOKでした。
877 ：Name_Not_Found：2011/12/30(金) 15:39:34.80 ID:???
ある要素内のテキストを、縦にセンタリングしたいのですが
tableタグのvalignみたいな属性は、cssではどうやるのでしょうか？
なぜかぐぐってもわからなかったので質問させてください
878 ：Name_Not_Found：2011/12/30(金) 15:40:28.57 ID:???
display:table-cell
vertical-align:middle
でできる
879 ：Name_Not_Found：2011/12/30(金) 17:18:17.66 ID:???
できなかったけど、ありがとう
もうちょい調べてみます
880 ：Name_Not_Found：2011/12/30(金) 19:36:17.86 ID:HTWVIpG8
質問です
googleのトップページのように常に一番下にメニューを配置したいのですがどうしたらいいでしょうか？
スレチならごめんなさい。たぶんCSSだと思ったので質問させていただきました。
881 ：Name_Not_Found：2011/12/30(金) 19:59:00.88 ID:???
CSS 段組
でｇｇｒｋｓ
882 ：880：2011/12/30(金) 20:10:36.92 ID:HTWVIpG8
>>881
ありがとうございます！
さっそくｇｇってみます。
883 ：880：2011/12/30(金) 20:38:57.38 ID:???
段組って横ばかりで縦がないですね・・・orz
884 ：Name_Not_Found：2011/12/31(土) 05:34:08.73 ID:???
ないわけないだろ
885 ：Name_Not_Found：2012/01/02(月) 19:42:51.82 ID:???
body全体を中央寄せにするために<div align="center">を使おうとしたけれど、
それは非推奨であり、スタイルシートを使わなければならないということなので
ご教授願います

body {
text-align:-moz-center;
text-align:-webkit-center;
text-align:-o-center;
text-align:center;
}

これを使えば一応できるのですが
TABLEなどが中央寄せできません
886 ：Name_Not_Found：2012/01/02(月) 20:16:55.23 ID:???
ブロック要素のセンタリングはもはや基礎だぞ
出直せ
887 ：Name_Not_Found：2012/01/02(月) 20:20:25.44 ID:???
test
888 ：Name_Not_Found：2012/01/02(月) 20:37:54.02 ID:???
>>885
マージンを自動にせよ
889 ：Name_Not_Found：2012/01/02(月) 20:43:13.84 ID:???
全体を#wrapper とか #wrapで内包してmargin: 0 auto;
が一般的かと
890 ：Name_Not_Found：2012/01/02(月) 22:56:43.39 ID:???
>>889
それ、もしくは子にwidthも指定せんと
891 ：Name_Not_Found：2012/01/03(火) 00:25:20.52 ID:???
bodyにwidth指定
892 ：Name_Not_Found：2012/01/03(火) 04:45:35.49 ID:???
>>874
IEのアレって内部じゃJavaScript扱いなんだっけか
893 ：Name_Not_Found：2012/01/03(火) 18:13:54.07 ID:???
>>892
IEのアレって何を指してるのよ
894 ：Name_Not_Found：2012/01/04(水) 01:12:59.45 ID:???
FireFoxとChrome(共に最新)で同じ表示にしたいのですが、どう作り直しても余計なマージンが入る部分が有り、ソースが現在貼れない環境のため出来たらオススメのCSSリセットを教えていただけませんか。

895 ：Name_Not_Found：2012/01/04(水) 01:31:09.43 ID:???
>>894
好きなの選びなさい
http://www.cssreset.com/
896 ：Name_Not_Found：2012/01/04(水) 01:32:24.97 ID:???
とりあえず個人的におすすめするのはYahoo! CSS Reset (YUI 3)かな。
897 ：Name_Not_Found：2012/01/04(水) 15:16:17.56 ID:???
>>893
CSS内で演算するやつ
898 ：Name_Not_Found：2012/01/04(水) 15:18:07.42 ID:???
文脈セレクタとか隣接セレクタのことか？
899 ：Name_Not_Found：2012/01/04(水) 15:52:38.14 ID:???
>>897
それじゃわからん、正式名称で書いてくれ
900 ：Name_Not_Found：2012/01/04(水) 16:03:02.73 ID:???
CSS Expressionsのことじゃね
http://msdn.microsoft.com/ja-jp/ie/dd253083
901 ：Name_Not_Found：2012/01/04(水) 18:22:37.43 ID:???
どう見てもJScript
902 ：Name_Not_Found：2012/01/05(木) 22:18:15.17 ID:???
フォントサイズの指定について質問です
ベースとなるサイズを12pxにして後は個別に相対指定するという指定の仕方は間違ってますか？

*{
font-size:12px;
}

h1 {
font-size:200%;
}
903 ：Name_Not_Found：2012/01/05(木) 22:21:50.10 ID:???
「指定方法としては」間違いではないが、間接的に全部固定サイズにしてるんだから駄目なのに変わりはない
904 ：Name_Not_Found：2012/01/05(木) 22:56:26.38 ID:???
http://yui.yahooapis.com/2.9.0/build/reset-fonts-grids/reset-fonts-grids.css
http://developer.yahoo.com/yui/fonts/#using
を見るとreset.cssでベースサイズを設定して、個々に相対指定できるようにしたいのですが
ベースサイズをピクセルで指定しないとしてどうやって相対指定でブラウザまで同じサイズで見せられるか分かりません
905 ：Name_Not_Found：2012/01/06(金) 00:18:38.37 ID:???
ブラウザまで同じサイズにしたいならピクセルにしろ
そうしたら全部固定サイズになるけどな。

相対指定したいならブラウザ間の文字の大きさの違いはあきらめろ
ブラウザ間の文字の大きさを同じにしたいなら相対指定はあきらめろ
906 ：Name_Not_Found：2012/01/06(金) 10:20:54.86 ID:???
ということはyahoo yuiを使ってもフォントサイズはブラウザ間で統一できないということですか？
907 ：Name_Not_Found：2012/01/06(金) 10:24:02.02 ID:???
最小フォントの設定ができるブラウザも多いので
ユーザーが設定していたらそれより小さく設定したフォントは大きくなるし
フォントサイズガチガチって古いやりかたのような
908 ：Name_Not_Found：2012/01/06(金) 11:35:56.51 ID:???
>>904
サイズ固定するなって言われてるのを>>903の時点で読み取れよ
909 ：Name_Not_Found：2012/01/06(金) 11:39:45.39 ID:???
？
サイズをpxで固定しない場合はどのようにブラウザ間のフォントサイズを統一させるのですか？
910 ：Name_Not_Found：2012/01/06(金) 11:57:47.37 ID:???
YUIはよく読むとbodyでpx固定してるよ
まさに>>902のやり方そのもの
911 ：Name_Not_Found：2012/01/06(金) 12:03:38.54 ID:???
13px/1.231の部分すね
やっぱ固定して問題ないですね
912 ：Name_Not_Found：2012/01/06(金) 12:07:14.87 ID:???
問題ないなんて誰も言ってない
フォントサイズを統一したいならその方法しかないというだけ
913 ：Name_Not_Found：2012/01/06(金) 13:08:17.60 ID:???
閲覧してる人の都合なんか知らない、俺が考えたサイズで見ろ→固定サイズ
閲覧してる人が見やすい大きさで見ろ→相対指定

「俺が考えたサイズで見ろ」が問題ないと思うならピクセル使えばいい
914 ：Name_Not_Found：2012/01/06(金) 13:13:34.82 ID:???
いまどきブラウザで文字サイズも即座に調整できるから「俺が考えたサイズで見ろ」というのも変な考え方
915 ：Name_Not_Found：2012/01/06(金) 13:20:52.00 ID:???
Font-size: 14px
みたいなことやるとIEで(IE9でも)調整できない。
Firefoxだと標準サイズを変更しても14pxなことは変わらない。
「WebページのCSSを優先する」のｙテックをはずせば色もサイズも製作者サイドのCSS無視できるけどね。

文字サイズっつーか、画面全体を拡大/縮小ならできる。
916 ：Name_Not_Found：2012/01/06(金) 14:32:15.80 ID:???
無駄にfont-family指定してるサイトは何なの
917 ：Name_Not_Found：2012/01/06(金) 15:32:05.18 ID:???
サイズ固定とブラウザ間の統一は違う概念だろアホか
フォントサイズ固定したがる奴なんてもう絶滅したかと思ってたけどまだ湧くんだな
というか一般的に固定されていないというのがなぜなのか考えたこともないのかね
918 ：Name_Not_Found：2012/01/06(金) 16:00:34.43 ID:???
フォントサイズを統一させないとボックスが壊れるじゃん
919 ：Name_Not_Found：2012/01/06(金) 16:55:08.15 ID:???
壊れるような組み方するからだろ
920 ：Name_Not_Found：2012/01/06(金) 17:55:41.28 ID:???
壊れるって具体的にどういうふうに？
921 ：Name_Not_Found：2012/01/06(金) 20:50:27.38 ID:???
フォントサイズによってレイアウトが崩れるってそれブロック要素に固定サイズ指定してないからじゃないの
922 ：Name_Not_Found：2012/01/06(金) 22:15:03.24 ID:???
固定サイズを指定してないんじゃなくて固定サイズを指定してるから壊れる、
というか文字がはみでるｗ

height="30px" lineHeight="30px"
これにfontSizeを大きくして二行になったりしたら下にはみ出るｗｗｗ
923 ：Name_Not_Found：2012/01/06(金) 23:25:35.27 ID:???
絶対に１行じゃなきゃまずいなら画像にするなり
overflowではみ出た部分を表示しないなど方法はあるだろう
924 ：Name_Not_Found：2012/01/06(金) 23:34:14.27 ID:???
「画像にすれば崩れない」は敗北宣言

画像にすりゃいいなんていったら
font-sizeもline-heightもいらねーｗｗ
全部画像にしちゃえばいいんだからｗ

とはいえ、過半数の文字を画像でやってるとこなんていくらでもあるけどね。
どんなブラウザで見ても崩れないね、やったね！
925 ：Name_Not_Found：2012/01/08(日) 08:00:27.96 ID:???
擬似クラスのtargetで隠しメニューを出した後、その中のリンクをクリックしたら閉じるように、
または別のtargetがついてる要素をクリックしたら今でてるものを消して表示されるようにしたいんですが
これってCSSだけで実装可能ですか？
926 ：Name_Not_Found：2012/01/08(日) 08:07:58.90 ID:???
なんかそんなサンプルあったね
927 ：Name_Not_Found：2012/01/08(日) 08:11:10.74 ID:???
そのサンプルは一応見たんですけど（あってるかわかりませんが）
クリックしてメニューを一度出した後他の所クリックしても閉じる動作をしないもので。
928 ：Name_Not_Found：2012/01/08(日) 10:08:27.27 ID:???
ユーザーcssをいじってるんですが、
<ul class="A">
<ul class="B">
という表示順を逆にするような記述はありませんか？
929 ：Name_Not_Found：2012/01/08(日) 10:19:58.32 ID:???
box-ordinal-groupを使う。
930 ：Name_Not_Found：2012/01/08(日) 10:38:31.98 ID:???
ul.A { box-ordinal-group:2; }
ul.B { box-ordinal-group:1; }

このように記述をしてみましたが、表示順が変わりません。
やり方を間違えているのでしょうか？
931 ：Name_Not_Found：2012/01/08(日) 11:21:45.32 ID:???
>>930
http://monodez.com/create/css3-box.html
932 ：Name_Not_Found：2012/01/08(日) 15:17:10.69 ID:???
>>931
そのサイトの書き方はあまり良くない

http://www.htmq.com/css3/box-ordinal-group.shtml
933 ：Name_Not_Found：2012/01/08(日) 16:19:04.08 ID:???
>>932
こちらのサイトを見て作ったのですが、
ulだと指定できないということでしょうか？
934 ：Name_Not_Found：2012/01/08(日) 16:30:51.28 ID:???
>>931-932
ステマ乙
935 ：Name_Not_Found：2012/01/08(日) 17:49:17.16 ID:???
>>934
面白くない
936 ：Name_Not_Found：2012/01/08(日) 18:02:40.48 ID:???
>>933
古いIE使ってるんじゃね
937 ：Name_Not_Found：2012/01/08(日) 18:05:36.87 ID:???
>>936
Chrome使ってます
対応してなさそうですね、ありがとうございます
938 ：Name_Not_Found：2012/01/08(日) 18:14:10.90 ID:???
>>937
再現出来るソース
http://jsfiddle.net/
939 ：Name_Not_Found：2012/01/08(日) 18:18:44.26 ID:???
Web制作者が、一部のブラウザでしか対応してないCSS使って、どーすんのよ
940 ：Name_Not_Found：2012/01/08(日) 18:21:10.17 ID:???
×一部のブラウザでしか対応してない
○一部のブラウザでは対応してない

てかユーザーCSSって書いてあるんだが
941 ：Name_Not_Found：2012/01/08(日) 18:38:26.66 ID:???
対応してないブラウザが悪い
942 ：Name_Not_Found：2012/01/09(月) 08:14:29.26 ID:???
文章中にインラインフレームで画像や文字を表示させると、必ず下側に余微妙な余白ができてしまいます。
そこで、vertical-alignでtext-bottomを指定したところ今度は下方向に余計落ちてしまいます。middleを指定すると
日本語文字は丁度いい位置にくるんですが、やはり数字やアルファベットは下にいきすぎてしまいます。

他の普通の文章と縦方向（一番下の位置）を揃えるにはどうしたらいいでしょうか？
宜しくお願いいたします。
943 ：Name_Not_Found：2012/01/09(月) 18:08:59.20 ID:???
どげんかせんといかんな
944 ：Name_Not_Found：2012/01/10(火) 00:40:47.74 ID:???
日本語はプロポーショナルフォント、英語は等幅フォント
にしたいんですけど、どう書けばいいですか？
945 ：Name_Not_Found：2012/01/10(火) 02:37:52.44 ID:???
>>944
>>615-630
946 ：Name_Not_Found：2012/01/11(水) 01:40:28.35 ID:???
webサイトの一部で、ユーザがCSSを登録できるようにしたいのですが、サイト自体のCSSとバッティングさせたくありません。
そのため、ユーザのCSSの影響を、例えば<div class="user-area">........</div>の中だけにするために、
ユーザCSSのすべてのセレクタの頭に.user-areaをつけようと思っています。( .user-area h1 {......} )

この方法で、何か問題が起こることがあるでしょうか？
947 ：Name_Not_Found：2012/01/11(水) 02:20:00.34 ID:???
大問題
長いからuaにしろ
948 ：946：2012/01/11(水) 03:26:09.37 ID:???
どういった問題でしょうか？
949 ：946：2012/01/11(水) 03:37:04.95 ID:???
すみません、ユーザCSSと書きましたが、一般的な用語とかぶっているのですね。
サイト側のlinkタグで読み込むCSSをユーザに書いてもらう予定で、そのCSSを指して言いました。
950 ：Name_Not_Found：2012/01/11(水) 18:07:30.79 ID:???
>>948-949
名前の長さは気にしなくていい。

訪問者に独自CSSを適用させるやり方なら個人用のクラスを用意する必要はない。
同じセレクタを後から定義してやるだけでカスケード処理されるはずだが…、
951 ：Name_Not_Found：2012/01/11(水) 19:02:04.87 ID:???
>>950
> webサイトの一部
952 ：Name_Not_Found：2012/01/11(水) 22:52:54.92 ID:???
>>950
カスケードってことは、単一HTMLでどちらかのCSSが優先されてしまうんですよね。
常にサイト側で用意したCSSを使用するのではなく、単一HTMLの中の特定領域だけ、
ユーザが作成したCSSを適用したいです。
953 ：Name_Not_Found：2012/01/12(木) 17:16:16.64 ID:yH0Xyx0a
ボックスを入れ子にして外のボックスでpadding、中のボックスでmarginを指定すると
IE6の場合だけmargin-topが相殺されてしまうのですが（IE7,8、FireFoxとかでは合算）
これはバグですか？ 検索してもドンピシャなのが見つからない・・・
なぜか外のボックスにwidthを指定したときにだけ起こります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<style>
#aaa {
width:300px;
margin: 0px;
padding:50px;
border:1px solid #000000;
}

#bbb {
width:100px;
margin:50px;
padding: 0px;
border:1px solid #000000;
}
</style>
</head>
<body>
<div id="aaa">
<div id="bbb">hoge</div>
</div>
</body>
</html>
954 ：Name_Not_Found：2012/01/12(木) 17:31:13.11 ID:???
IE6はもう対応する必要ないだろ。
955 ：Name_Not_Found：2012/01/14(土) 02:59:01.67 ID:???
こういうのって、CSS3じゃなくてもできますか？


むかしむかし　　　んたくをして　　
あるところに　　　いると、かわ
おじいさんと　　　からももがど
おばあさんが　　んぶらこっこ
すんでいまし　　とながれてき
た。おばあさ　　　ました。
んがかわでせ

二段組にするんですけど
最後の「せんたくを」の部分を続けたいんです。

<p>むかしむかし～ながれてきました</p>
このひとつのpだけに対しcssでなんかやって、二段組みたいなことむり？
956 ：Name_Not_Found：2012/01/14(土) 15:05:01.91 ID:???
CSS2.1でもfloat使えばできる。
957 ：Name_Not_Found：2012/01/14(土) 15:17:26.79 ID:???
floatだと955で言ってる結果とは違う結果になるから正確にはコレ使う
ベンダープレフィックス必須だけどね
http://www.htmq.com/css3/column-count.shtml
958 ：Name_Not_Found：2012/01/14(土) 19:25:57.26 ID:???
>>945
結論は「できない」ってことですか？
しかたないなぁ・・・
959 ：Name_Not_Found：2012/01/14(土) 19:40:02.52 ID:???
>>958
FirefoxやChromeだとフォントリンク依存せずにちゃんと機能するみたいだよ
960 ：Name_Not_Found：2012/01/14(土) 21:47:04.07 ID:???
>>955
CSS詳しくないけどググって見た感じ、独自の禁則処理はjavascriptじゃないと難しいのかもね
961 ：Name_Not_Found：2012/01/14(土) 21:50:32.88 ID:???
禁則処理じゃなくてマルチカラムの話では
962 ：Name_Not_Found：2012/01/17(火) 19:44:06.29 ID:AO7FQlYk
<p class="vertical">
<img src="img.jpg">
</p>

.vertical{
display:table;
width:220px;
height:220px;
text-align:center;
vertical-align:middle;
}
963 ：Name_Not_Found：2012/01/17(火) 19:46:02.33 ID:AO7FQlYk
すみません途中でした。

画像を縦横共にセンタリングしたくて>>962のようにしたんですが
縦方向がうまくいきません。
どうすればよいでしょうか。
964 ：Name_Not_Found：2012/01/17(火) 19:59:30.27 ID:???
display:table-cell;　にすればなおるかな？
965 ：Name_Not_Found：2012/01/17(火) 20:00:41.60 ID:???
旧IEも保証するなら、小飼弾のブログにちょうどいい記事がある
http://blog.livedoor.jp/dankogai/archives/51011227.html
966 ：Name_Not_Found：2012/01/18(水) 18:52:30.50 ID:???
<div class="vertical_soto">
<p class="vertical_naka">
<img src="img.jpg">
</p>
</div>

.vertical_soto{
position:absolute;
display: table;
width:220px;
height:220px;
}

.vertical_naka{
display: table-cell;
vertical-align: middle;
text-align:center;
width:220px;
height:220px;
}

だいたいこんな感じで思っていたとおりになりました。
ありがとうございました。
967 ：Name_Not_Found：2012/01/18(水) 21:50:24.77 ID:???
IE6ってbeforeやafterが対応してないんだよね
じゃあclearfixとかいう手法とか
before、afterでなんかやる
みたいな手法はIE6だけ無理？
968 ：Name_Not_Found：2012/01/18(水) 21:52:04.28 ID:???
>>967
ここの3番目
http://www.koikikukan.com/archives/2007/02/14-003005.php
969 ：Name_Not_Found：2012/01/20(金) 17:29:05.53 ID:???
ある画像から切り抜いた一部分をタイルのように隙間なく並べたいのですが、方法がよくわかりません。

画像から一部分を切り抜く（クリッピングする）方法はcssのclipを使えばとりあえずはできたのですが、
それをタイルのように隙間なく縦横10個x10個ならべようとすると切り抜いた画像部分が重なったり、
縦にばかり並ぶようになってしまいます。

<html>
<head>
<style type="text/css">
img.sample1 {
position: absolute;
clip:rect(12px,211px,297px,11px);
}
</style>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>show</title>
<body>
<img src="image1.jpg" class=sample1><br>
<img src="image1.jpg" class=sample1><br>
<img src="image1.jpg" class=sample1><br>
</body>
</html>

この方法だと改行分だけずれた画像が縦に並んでいきます。
縦にも横にも隙間なく10x10だけ並べたいのですが、tableを使用すればいいんでしょうか？
970 ：Name_Not_Found：2012/01/20(金) 20:17:57.87 ID:???
横に10個縦に10個並べれば？tableなんて要らんよ
というか、よかったらそんなことをしたい理由というか意図を教えてくれないか
自分なら一切迷わず「ある画像から切り抜いた一部分をタイルのように隙間なく並べ」た画像作るだろうから興味がある
971 ：Name_Not_Found：2012/01/20(金) 21:58:04.03 ID:???
Photoshopのクリッピングマスクのように
文字にbackground-imageをつけたいんですけど
どうやればいいですかね。

普通にcolorを指定しちゃうとその色になっちゃうし
transparentだとそもそも文字が表示されない
972 ：Name_Not_Found：2012/01/20(金) 23:15:29.51 ID:???
>>971
1行目と2行目がまるで噛み合ってないが大丈夫か
973 ：Name_Not_Found：2012/01/20(金) 23:16:03.47 ID:???
ワロタ
974 ：Name_Not_Found：2012/01/20(金) 23:33:40.61 ID:???
確かに日本語がおかしい・・・
http://www.fmod.jp/justnet/smu/smu04/smu04b.html
ここの下のほうにある
Adobe Photoshop
っていう文字にビルの背景の画像がうつってるでしょ
それみたいなことはCSSじゃ無理？
975 ：Name_Not_Found：2012/01/20(金) 23:37:45.64 ID:???
一言で言えばできる。
ヒント：文字の色を透明にする
976 ：Name_Not_Found：2012/01/24(火) 01:38:24.18 ID:???
id="foo.bar" のように、id属性にピリオドを含んだ要素があって、
それをCSSで指定したいとき、セレクタはどう書けばいいでしょうか。
#foo.bar だと、当然のように「#foo」＋「.bar」だと解釈されてしまいます。
977 ：Name_Not_Found：2012/01/24(火) 01:50:30.59 ID:???
＞スタイルシートのIDには、アルファベット以外には数字(0～9)とハイフン(-)、アンダースコア(_)しか使えません。
978 ：Name_Not_Found：2012/01/24(火) 02:00:55.56 ID:???
[id="foo.bar"]
979 ：Name_Not_Found：2012/01/24(火) 03:33:21.73 ID:???
>>977
ですよねー。
HTMLの仕様としては、id属性には「:」や「.」も使えるんですけど、
CSSセレクタのせいで、実質的にはこれらの文字は使えないんです。残念。

>>978
なるほどー、そういう方法もあるのですね。ありがとうございました。
980 ：Name_Not_Found：2012/01/24(火) 15:57:35.54 ID:???
＜pre＞タグのように、空白をそのまま表示しつつ、
かつ通常のテキストのように長い行を適宜折り返してくれるという
すてきな機能はCSSにはありますか。
すべての空白文字を＆nbsp;に置き換えることを検討しましたが、そうすると
空白文字での折り返しができないことに気づきました。
981 ：Name_Not_Found：2012/01/24(火) 16:35:32.00 ID:???
ありますけど使えるかはブラウザしだい
982 ：Name_Not_Found：2012/01/25(水) 09:44:56.23 ID:???
>>981
ぜひ教えて下さい
983 ：Name_Not_Found：2012/01/25(水) 10:52:57.51 ID:iZ3MyXPn

　||￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣||
　|| ★★２ちゃんねるの仕様★★
　||　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Λ_Λ
　|| 　 980到達以降、　　　　　　　　　　　　　　　　 ＼　(ﾟーﾟ*)　ｷﾎﾝ。
　||　　前のレスから24時間放置でdat落ち　　　　　 　⊂⊂ |
　||＿＿＿ ∧ ∧＿＿∧ ∧＿＿　∧ ∧＿　　　　　 |￣￣￣￣|
　　　　　　(　 ∧ ∧__ (　　 ∧ ∧__(　　 ∧ ∧　　　　￣￣￣
　　　　～（＿(　　∧ ∧＿ (　 ∧ ∧＿ (　　∧ ∧ 　は～い、先生。
　　　　　　～（＿(　 　,,)～（＿(　 　,,)～（＿(　 　,,)
　　　　　　　　～（＿__ﾉ　　～（＿__ﾉ 　　～（＿__ﾉ
984 ：Name_Not_Found：2012/01/25(水) 11:38:34.92 ID:???
>>983
おバカな仕様だよな。
50到達前ぐらいにした方が、余程クソスレが減るのに。
985 ：Name_Not_Found：2012/01/25(水) 15:23:01.30 ID:pueSXgkA
質問させてください。
focusをstyle=で直接textareaに書くにはどうしたらいいでしょうか？
986 ：Name_Not_Found：2012/01/25(水) 15:27:44.53 ID:???
方法はありません。CSSファイル内で書いて下さい。
987 ：Name_Not_Found：2012/01/25(水) 16:14:35.49 ID:pueSXgkA
>>986
ありがとう
あともう１つ質問です

フォーカス時に、IE9だと変な枠は表示されませんが
cromeだと変な枠が表示されてボーダーの色が変わってしまいます
textareaのフォーカス時の色の指定方法を教えてください
988 ：Name_Not_Found：2012/01/26(木) 11:49:02.48 ID:???
すみません>>980だれかおしえてください
989 ：Name_Not_Found：2012/01/26(木) 12:15:21.01 ID:???
>>980
white-space
990 ：Name_Not_Found：2012/01/26(木) 12:43:23.87 ID:???
>>989
>white-space
ありがとうございます。これのことでしょうか。
http://www.htmq.com/style/white-space.shtml
このサンプルをみると、white-space: pre のとき、空白と改行は意図した通りですが、
ボックスの大きさに合わせた改行をしてくれないようです。
欲しいのは、>980に書いたように、

>＜pre＞タグのように、空白をそのまま表示しつつ、
>かつ通常のテキストのように長い行を適宜折り返してくれる

という機能なんですが、実現できますか。


991 ：Name_Not_Found：
保守しとこ