/* CSS･スタイルシート質問スレッド【26】 */

---------------------------------------------------------------
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
---------------------------------------------------------------
img {
float : left;
}
h3 {
clear : left;
margin : 1em 0em 0em 0em;
}
p {
margin : 0em;
}
---------------------------------------------------------------
ネスケとかモジラで見るとimgとh3の間にスペースができません。
うえのでいうと、「米の画像」と「其の二」の間、「酒の画像」と「其の三」の間に1em分の空きをつくろうとしたいのです。
どうしたらよいのでしょうか？

>>780 "marginの相殺"か？

>>780
imgはインライン要素だから、<p>か、<div>の中に入れておかないと・・・・

ああ、ちゃんとはいってます。

<div>
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
</div>

オペラとIEではコチラの都合どおりなんですが・・・

>>780
Mozilla が正しい実装です。'clear: left' の効果は：
>要素のボーダー上辺が、ソース文書内でそれ以前に出現するあらゆる左フロートの外下辺より下であるように、要素が生成するボックスの上マージンを十分大きくする。
従ってh3要素の上マージンの指定は、ボーダー上辺を揃えるために無視されます。

提示された例の場合、h3要素を 'margin: 0' にして、
img要素に 'margin-bottom: 1em' を指定すると意図通りになると思います。

>>779
以前ソースをスレに張ったら「ここに張るな。どっかに上げろ」と言われまして・・。
申し訳ありませんでした。それと、凄く長いソースなので問題部分だけを張ります。

<table width="780" height="200" border="0" cellpadding="0" cellspacing="0" bordercolor="#000000">
<tr>
<td width="200"><img src="image/**.jpg" width="200" height="200"></td>
<td width="580" background="image/**.gif"><div class="a">
<div align="left"><img src="image/**.jpg" width="12" height="12">04.18-あいうえおかきくけこさしすせそ<br>
04.18-あいうえおかきくけこさしすせそ
</div>
</div> </td>
</tr>
</table>

>>772
最終手段で DOM でなんとかするとか。
スレ違いではあるが…

window.onload = function()
{
  var tables = document.getElementsByTagName('table');
  for (var i=0; i<tables.length; i++)
    tables[i].cellSpacing = 0;
}

初心者向けのcssの本ってあります？
解説付きの本が好きです

>>785 なんだかひどいHTMLだが、で、CSSソースは？　どんなスタイル指定したかがわからんよ。

>>787
残念ながら初心者向けの良い書籍、ウェブサイトは余りありません。
私も書籍を買ったことがありますが、多くは残念な思いを致しました。
まず HTML をちゃんと理解してから CSS を学びはじめてください。
というかスレ違いです。優れた本を訊くスレではありません。

とりあえず 2ch Books 辺りを参照してください。
http://www.1point.jp/~book_2ch/web/

>>787　>>4の解説サイトでは足りないのか？　無料で見られるし。

http://www.geocities.jp/koreyoro/
http://www.geocities.jp/koreyoro/menu_stlsht.css
すいません、以前ここで質問したものなのですが
メニュー上部の画像をすぐ下のテーブルに
引っ付けたいのですがどうすればいいのでしょうか？
以前は上部画像を<div>で囲むように言われ
解決したのですが。
<img width height>を指定したとたん元通りに
なってしまいました。

>>791　margin

>>792
テーブル、画像のマージンを０にしたのですが
直らないのですが･･････

すみません、教えてください。
画像の枠指定をしているのですが、それをjpgのみに適用しgifには適用させないように
したいのですが、どう指定していいのか分かりません。
よろしくお願いします。

>>794 拡張子だけで判別させるなんて無理。imgにclassを振るべし。

>>790
どこの馬の骨が書いたかわからないような解説サイトなんて信用できん。
無料だからこそ余計に信用できない。
高い本こそ良い本に決まっている。

いままで何人かの初心者と接する機会がありましたが、
このように考える人がむしろ多いかと。

だとしたら、どこの馬の骨が教えたか分からない本なんて買えないよな

>>793　
ならばチト強引だがmarginにマイナス値でも設定すれば？
どうしてもピッタリくっつけたいならね。
IE以外のブラウザでも確認して見るとよいよ。

>>798
ちょっと他のブラウザでも調べてみます・・・・・
マイナスは最終手段にして。



画像のサイズ指定したとたんこうなるのは何でだろう・・・・・・

>>786
Javascriptはじかれちゃった（´･ω･`）ｼｮﾎﾞｰﾝ。
<script>って書くと>script<ってエンコードされちゃうの。
はてなダイアリーの困ったちゃん。

>>797
本は一応著者の名前が出てるし。
出版社の名前も影響するだろうし。

仕様書の存在を知らないアホが書いた紙クズでも
本になってれば人は信用して買っていく。

内容では無くて価格に価値を求める人が多いんだよ。
そう思う方がわかりやすいからね。現状とは別問題で。

>>795
ありがとうございます。
どおりでどう検索しても出てこないハズですね。
失礼しました。

>>786,800
(´ι _` 　) Scriptもしょぼいがスレ違い

誤：どおりで　
正：どうり（道理）で

>>800
>>script<

ぬを、＆ｇｔ；と＆ｌｔ；を反対に書いてしまった。しかもちゃんとデコードされちゃってるし。
さすがに<script>が>script<には成りません（´･ω･`）ｼｮﾎﾞｰﾝ。


>>804
うん。ごめんね。おわびにちんこあげる( ･ω･)ﾉ――――――――ω

>>788
よろしければ>>775にうｐしてありますので、それを参照していただけますでしょうか？
長くて改行エラーが出てしまいました。

要点を記せないのかねえ。
/*コメントアウト*/で絞り込んで実験すれば、どれが原因かわかるはず。

line-heightは単位無しの実数値指定が一番だよな。
http://d-club.cside.ne.jp/mt/archives/line-height_test.html
http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html の241・834参照。

>>799
vertical-align:bottom;
にしてみ。IEでできる下の隙間はそれでとれる。
他のブラウザでは関係ないけど。

どなたもわかりませんでしょうか？

画像(その先にリンク有)を2枚並べたい時(横でも縦でも)、どうすればよいのでしょう。
HTML時代は、テーブル作ってその中に画像を組み込んでいたのですが、
CSSではこういうテーブルの遣い方はヨシとはされていないのですよね？

余りに初歩的な質問だったらならばごめんなさい。探し方が悪いのか
本も持っているのだけれど何だか載ってないし、色々なサイトも見たけど
見付からない(涙)。

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

>>812
意味がよく分からない。普通に書けば並ぶと思うんですが。

横に並べる　　<img><img>

縦に並べる　　<img><br><img>

>>812
あと「CSSでは」じゃなくて「HTMLでは」です。

>>813 あ。そうなんですけど、普通に書いただけだと、例えばウィンドウを
大きくすれば2つ目の画像は1つの画像の横に、逆に小さくすれば1つ目の画像の下に
2つ目の画像が来てしまいますよね。そうではなく、いつでも横に2つなり縦2つなり
画像が並ぶようにしたいのです。

言葉が足りなくてごめんなさい。

>>811
ソースがアレでショボーンとする。
ともかく、line―heightは効いてると思うのですが、何が問題か良くわかりません。
ひょっとして、12×12ピクセルの画像の配置？

すいません。初心者すれでしつもんしましたが、
こちらのほうが適切かと思い再度質問させて下さい。
ながれをむししてたらごめんなさい

発言番号622
はじめまして。この板は初めてきました
MAC OS Xで、operaでスタイルシートでフォント指定したのですが
うまくいきません。mozilla、IEではうまくいきました。
日本語を等幅フォントで表示したいのです。よろしくお願いいたします


発言番号625
OSAKAの指定は一等幅が優先されるようなので
font-family:OSAKA;を指定しました。
monospace指定はnetscapeの古い4.ｘで化けるので避けました
特に、osakaにこだわりがあるのではないです、
等幅で表示したいのです
IEはデフォルト表示が等幅だったので、問題なしで、
mozillaではちゃんとosaka一等幅で表示されました。

>>811　>>809は見た？

>>818
>IEはデフォルト表示が等幅だったので、
そんなことは、ない。少なくともWinIEでは。

>monospace指定はnetscapeの古い4.ｘで化けるので避けました
等幅指定はmonospaceが必須。
NN4なんて駄目ブラウザには、CSS除けをかましておけばよい。
・ブラウザによる振り分け　（JavaScriptを使用しない方法）
　http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua

Opera CSSバグリスト
フォントファミリ指定で1フォントしか認識しない(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b002.html

>>818
>IEはデフォルト表示が等幅だったので
ユーザ側で自由にデフォルトフォントを設定できるのだが。
ユーザ設定が自分の環境と同じになっているとは限らない罠。

>monospace指定はnetscapeの古い4.ｘで化けるので避けました
要するに「MacOS以外の環境なんて知りません」ってことか。
Windows には普通、Osakaフォントは無いから等幅にならない罠。

あ、わかりにくくてすみません
マックOSXでのはなしです。
ウィンドウズの方のスタイルシートはmonospaceで
していしています。

うぃんどうずは、IEでもオペラでも
ちゃんと等幅になってることをかくにんしました

というか font-family:OSAKA; では等幅にならんだろう。
そもそも “Osaka” と記述しないと Osaka にもならないし。
等幅にしたいなら font-family: "Osaka−等幅"; だろう。

連続カキコすみません。

>>821
ありがとうございます。でもこのURLで紹介されてるのは
winですよね。

824につけくわえて、Winのﾓｼﾞﾗもだいじょうぶでした。

>>820のURL参考になりました。どうもありがとうございます！

>>825
ご指摘有り難うございます。
Osakaの表記については書き込む時に間違えて大文字でうってしまいました。

というか Opera の[ページスタイル]の設定は確認したのか。

画像2つ並べるには？です。ちょっと色々分からなくなって来たので
また出直します。ご指摘ありがとうざいます。そうですよね。
何だか鬱になって来た・・・ﾀﾞﾒｿ

>>828

ありがとうございます！ユーザーモードにチェックが入っていました！！！
はずしたら、ｵｵｻｶフォントの表示になりました！！！

色々な指定を試してみたのですが、IEやﾓｼﾞﾗにくらべて
行間や字間や行末約物が狭めみたいですね。

tableタグ使わないでdivで左にナビ、右にメインを表示するのってどうなんですか？
外国で主流っぽいけど、それのどこがいいんですか？

ちょっくら、釣りのエサ買ってくるわ。

>>817
ソースに関しては、あまりにも長すぎるのでうｐしようと思ったのですが
「面倒だから、いちいちうｐするな」と言われましたので、一部分だけ張りました。
12×12の画像は普通に横に置いているだけなのですが、行間に影響してしまいます。

>>819
申し訳ないです。>>809さんは私へのレスだと思っていませんでした。
早速試してみようと思います。

>>833
頭悪いのかな……。
ソースは全部でなく要点だけ記せばいい話でしょ。
わざわざ解凍の必要なzipファイルでよそのサーバーにアップしたのなんて大抵見る気しませんよ。
CSSソースだって、無駄な改行無くせば、充分ここにさらせる量でないの？

・問題の切り分けが下手
・表現能力が低い
・流れが読めない
・自分の文章の客観視ができない
・要領悪い
たいていセットになっているから話が進まない罠。

>>812さん

<nobr><img><img></nobr>
でどうですか？？

>>836
おい、貴様、ここがCSSスレッドとしっての狼藉か。
自働改行禁止はCSSなら white-space:nowrap; だろが。
初歩だよ、初歩。

>>837
あ、ありがとうございます。
べんきょうになりました

うえのほうでhtmlでみんなアドバイスしてたのでついつられました！！

責任をとって切腹せよ

>>834
＞ソースは全部でなく要点だけ記せばいい話でしょ
うーん・・・既に要点だけ張ってあるのですが（ｗ

まだわからんのか。要点だけ“ここに”記せ。>>840

>>839

できないです。ごめんなさい！！

>>838
＞うえのほうでhtmlでみんなアドバイスしてたのでついつられました！！

それにしても、よりによって非推奨要素の<nobr>なんぞを持ち出すところがなんともはや。
知らないことに口を出してはいかんよ。

>>840
　>>788・>>808

>>841

>>785

>>844

>>788

788 ：Name_Not_Found ：04/01/21 19:50 ID:???
>>785 なんだかひどいHTMLだが、で、CSSソースは？　どんなスタイル指定したかがわからんよ。

>>845

>>775

>>847

>>841

>>847

834 ：Name_Not_Found ：04/01/22 16:41 ID:???
>>833
わざわざ解凍の必要なzipファイルでよそのサーバーにアップしたのなんて大抵見る気しませんよ。
CSSソースだって、無駄な改行無くせば、充分ここにさらせる量でないの？

>>848

>>112

>>775は文章が読めない人みたいだから、結局、解決策を教示してやっても無駄なのでは。

>>850　「<dl class="example">」がどうかしたのか？（笑）

ぐだぐだ言ってないで落とせばいいだろ。
アホか。

HTMLソース
>>785

CSSソース
td { letter-spacing: 0.2em; line-height: 15pt; font-size: 10pt; }
A:link { color:black }
A:visited { color:black }
A:active { color:black }
A{ text-decoration:none }
A:hover { text-decoration:underline; }
A { line-height: 20pt; }
.a { font-size : 10pt; padding: 10px; }

素晴らしいソースだな。
特にa要素周りが。

>>853
わざわざ落として解凍してそれか。
ついでに「回答」もしてやれよ。



なんちゃって！！！！！！！！！

809 ：Name_Not_Found ：04/01/22 00:30 ID:???
line-heightは単位無しの実数値指定が一番だよな。
http://d-club.cside.ne.jp/mt/archives/line-height_test.html
http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html の241・834参照。

>>843

ごめんなさい。これからきをつけます。
でも、べんきょうになりました。ありがとうございます！



>>846 >>855他

ﾃﾞｼﾞｬﾌﾞ合戦？

アホを相手にするのもなかなか骨が折れるという見本

>>853
俺もa要素周りは同じ感じなんだがもしかして俺も糞ですか？
まぁcolorが全部同じblackってとこは意味わかんないが。

香ばしいな

おまえら、質問はなんだったのか、もはや覚えていやがりませんよね。
漏れもです。

>>853
何をしたいの？
何をいいたいの？
...

要するに、最低限のhtmlどころか、最低限の日本語による論理的な
コミュニケーションが取れない方はお引取りください、ってこった。だと思う。

リンクには下線引いてくれよ頼む

>>775
落としたソースで>>773の状況が再現出来なかったんで、
やりたい事と現状が理解できないんだけどさ。
line-height:15ptとしてるけど、
これを30ptや50ptにしても行間は変化無しなんですか？
微妙でも変化するなら適用はされてるとおもうんだけど。

字間を空けるために、letter-spacingを1pxで指定すると、
改行の１行分が詰まってしまうのは仕様ですか？

１行あけたところ→空きなし
２行あけたところ→１行分の空き

字間も空けつつ、行送りは元のままでっていうのは無理かな。

>>864
IEのバグ。
http://members.at.infoseek.co.jp/cssbug/detail/winie/b022.html

ちょっと小難しいこと聞きますが、普段リンクの下部に点線を表示させておいて
マウスオーバーで背景色を出すということは可能ですか？

点線：青色
マウスオーバー：点線を表示させたまま背景色を薄青で表示（その他の線は出さない）
IEでリンクを押した瞬間に出る黒い点線も出したくないです。

実現可能かわかりませんが、よろしくお願いいたします。

>>865
ありがとう！

866がムカツク

>>864
「改行」っていうのは、連続brタグのことなのかよ。
漏れは改行というと CR か LF しか思い浮かばないんだけど。
ってか、連続<br>は「行送り」ではないだろう。line-height≒行送り。
<br><br> ってダサい。CSSの前にHTMLを理解しろよって感じ。

>866

＞点線：青色

a に border

＞マウスオーバー：点線を表示させたまま背景色を薄青で表示（その他の線は出さない）

a:hover に background-color と text-decoration

＞IEでリンクを押した瞬間に出る黒い点線も出したくないです。

WindowsIEではCSSではムリ（のはず）

>>868
うお、何か気に触ること言ってしまったのでしたらゴメンなさい(；´Д`)

>>869
今時<br><br>がダサいって奴も珍しいな。それは一昔前の話だろ。

>>870
borderだと破線が出なかったんです。

>>871
>>1読んだら解る事を「小難しい事」などと言うのがムカツク
>>872
どこのカスだお前は

小難しいとか書かれてたのが小馬鹿にされたみたいで気に障っちゃったんだろ

厨がいるねえ・・・冬休みまだ終わってなかったっけ。

IE5.5以降だと

<a href="#" hidefocus>ほげ</a>

でリンク周りの点線が出ないんだなぁ。
標準でないのが気に入らんっちゅうなら

<a href="#" onmousedown="this.hideFocus=true">ほげ</a>

か。どっちにしてもCSSの話じゃないな。

>>871
可能かどうかは、仕様書やリファレンスを読めば解かるだろ。
少しは自分で調べたり、学習したり、試しなさいよ。
何か疑問に思ったら、その度に人に訊くのですか貴方は。
自分で何の努力もせず、答えだけを要求するという怠慢な態度が許せん。

いや、夏休みかもしれないぞ。

>>879
さっきから何やってんの？

きっと毎日が夏休みなんだろ。

ｺﾞｰﾙﾃﾞﾝｳｨｰｸかもしれないぞ

>>873
これでどうだ
border-bottum:1px dotted blue

bottumたん(;´Д｀)ハァハァ

すまん，漏れが悪かった
border-bottom:1px dotted blue

今時<br><br>のが珍しい気がするが……
つーか破線ってdashedのことじゃないのか。ケツにセミコロンもないし。

↑ネタは余所でやってくれ

残念ながら<br><br>のような糞htmlのが圧倒的に多いけどね。
それがダサイ事には変わりないが。つーか、スレ違い。

>>874
何かよくわかりませんがスミマセンでした。

>>877
win＋IEでは無理というお話でしたので、その点についてはあきらめます。

>>878
自分で試してみて、どうにも破線が出なかったのでお聞きしたんです。
疑問に思ったのですが、どう検索すればよいのやらという感じでした。

>>883
ありがとうございます。早速試してみます。

>>889
試してみますじゃなくて、できたorできなかったの方がいいと思うYO！

>>773=775 >>818 >>889-890
もう来なくてイイよ。スレ汚れるから。

っつーか<br><br>のサイトって多いだろ。俺もよく使うんだが
それ以外の指定方法でオススメってあるのか？

>>892
あんたはなんでこのスレにいるの？

>>893
スレタイをよく読め。

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</div>
<p>テスト用カキコテスト用カキコテスト用カキコ</div>
</body>

例えばこれで2行分空けたとする。でも3行空けたい。1行しか空けたくない。
こんな場合はいちいちclassを作んないと駄目。わかるか？
<br>に勝るものがないだろ。

しかも「単純な改行」に関しては<br>以外ない。4文字で済むタグに
勝るものがあれば教えてくれ。俺は無いと断言できる。

>>894
＞でも3行空けたい。1行しか空けたくない。
　見栄えだな。

>>894
なんのためのstyle属性だ

>>895
文字数でCSSが推奨されてるわけじゃない。つまらんからｶｴﾚ。

要するに、根本的に、htmlもxhtmlもCSSも分かっていない、ということか。
「h1は文字を大きくするタグ」、とか思って、そこから脱却できないクチか
それと五十歩百歩の香具師。

>>899
しかも「単純な文字巨大化」に関しては<h1>以外ない。4文字で済むタグに
勝るものがあれば教えてくれ。俺は無いと断言できる。

>>899
「h1」って文字を大きくするタグじゃないんですか？

>>901
ごめん。気の利いたボケが思いつかない。

>>902
知らなかった。俺見出しの為の大きくするタグだとばっかり・・

894がpについてmarginを設けたいのにわざわざ外にdivを作っているのとか
そもそもタグの対応がへんちくりんとか、誰も突っ込んであげないのね。

>>903
> 知らなかった。俺見出しの為の大きくするタグだとばっかり・・

＞見出しの為の
正解

＞大きくする
それは結果論

>>904
この程度の知識か、と思った段階でそいつの書くソースには興味がなくなるから見てない。

>>905
あ、そういうことね（ｗ

（ ・∀・ ）!　div厨ってｺﾚか！？

正確にはこうか

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
<p>テスト用カキコテスト用カキコテスト用カキコ</div>
</body>

それはマジボケっすか

間違えた。こうだった（ｗ

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</div>
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</body>

<style type="text/css">
<!--
.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<p class="test">テスト用カキコテスト用カキコテスト用カキコ</p>
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</body>

こうだろ

>909

>911

頼むから教える側には来ないでね。

<p>属性にclassが指定出来たなんて、生まれて初めて知ったよΣ（ﾟдﾟlll）

ちょっと待ってくれ！ということは、ここの住人は「行間を空ける」はもとより
「通常の改行」すら<br>を使わないってことか！？

>>914
汎用属性って知ってますか？
はい、もう一回。汎用属性。

>>915
発言で改行するときくらいかな。
それすらも気持ち悪い、って人もいるけど、ここまでが俺の許容範囲。

>>914がdiv厨の理由なのかも知れないとｵﾓﾀ

ネタレスとかマジでいらないっす。
本気で初心者なら>>4とか回ってくれ。

>914
class指定はbody以下のほとんどの要素にできるぞい

ていうか>>4らへんのサイト回って勉強しれ

はい。正直告白しますが、たった今までdiv厨でした・・。
じゃあ例えば>>912のソースを利用したとして

<p class="test">テスト用カキコテスト用カキコテスト用カキコ</p>

この部分の「テスト用カキコ」をある程度のところで改行したい場合
みんなはいったい何を使って改行するの？<p>タグ使っちゃったら
class指定が影響出る。かといって<br>は使わない。

俺には難しすぎる・・。誰か回答よろ

>>921
> この部分の「テスト用カキコ」をある程度のところで改行したい場合
　いや、そもそも「改行したい」と思わないんだ。
改行はブラウザ任せ。
見辛い、ってのが原因で改行したいのならインデント入れるし。

なんで改行の話で<p>タグ新たに入れるとかいう話が出て来るんだよ。
マジレスしちまうと、pか親要素で左右にマージンとって、あとは自動改行
にまかせるのが基本。強制改行は本人の環境では「ほどよい」かもしれないが
超高解像度や低解像度な環境では程よくならない。ていうか、>4のサイト回れって。

>>922
なるほどなるほど。根本的な考えが違うわけですな。
>>4のリンク周って最初から勉強しなおします。

その前にこれだけ答えて欲しいんですが
改行をブラウザ任せだと、例えば文の頭に「っ」や「、」「。」がきたりする場合もありますよね？
そういうのって気になったりしませんか？

あと、その回避方法のインデントについてだけ教えていただけませんか？

>>924
禁則文字、って最初に来なくない？試してないけど。

body{
margin : 0 5%;
}
とか。
左右に隙間を与えりゃ見やすくなるでしょ。

ちと便乗質問

例えば箇条書きの場合は<br>なしでどう表現する？

>>926
初心者ｽﾚ池
ul要素がなんで存在してると思ってるんだ。

便乗質問とかいって、100%同一人物だろ。極端にレベルが低すぎるぞ
箇条書きならリスト項目使えよ。つうかいい加減>>4に逝ってくれ。

>>926
箇条書きはリストだから ul または ol を使う

どうしても、CSSでやるなら
--
span.dialogue:after { content:"\A";}
--
<p>すると、戸を開けた先には老人がいて、<span class="dialogue">「回れ右」</span>といった。</p>
--
でよいのでしょうか。
#対応ブラウザあるか知らないけど。

>>928
便乗、って「俺も」って意味と「質問したついでに」という意味と解釈できるから、別人を装ってる、というわけでもなかろう、と。

ｽﾏｿ。欲張って質問したせいで別人装うってる感じになってしまいました。
聞きたかったのは「cssでどう表現するのか？」という意味でした。

>>925 >>930
ありがとん

で、このまま1000まで行くわけ？

>>932
CSSは正しいHTMLに適応させるべきだから、HTMLから勉強しなおした方がいいと思う。

>>933
>>932で終わってるから、次の質問待ちだろ。

>>932
>>4を100回読んで来い。

でもul使うと勝手に出る■とかがウザい。css使ってわざわざ画像にするのも面倒だしなぁ。
「>>」使いたいときなんかが困る。

>936
ulのリストマーカーがウザいならCSSで消せよ

>>936
>>4を100回読んで来い。

リストマーカーは消せる

俺も>>4を100回読むの刑かよ・・。っつーか消せるのかよｗ

>>939
list-style-type : none;

>>939
消せるよ。

>>939
あ、追記ね。
list-style-image : url(li.gif);
画像も使える。サイズは12*12くらいならOKだっけか。

<br>の使い方に関して気になる事があるけど、タグの話はスレ違いよね。

>>943
strictHTMLスレこいよ。相手してやるぜ。

なんだこのスレの状態は　_|￣|○
無知な人間ばかりじゃないか　_|￣|○

ここにいる香具師らは/.Jで中途半端な知識をひけらかしてうだうだ言ってる輩と同じ匂いがするな。

なんかこう言う時代が来たのかなぁ、って感じ

スレのレベルが極端に下がってんな…_|￣|○

強制ID激しくキボンヌ

>>948
質問スレに高度さなんざ求めんな。

そういう次元じゃないと思うぞ。
基本のキだし

というか...
初心者に理解できるように説明してないからだろうな（w

初心者スレじゃないしなぁ

だが、初心者ｽﾚでCSSの質問をすると
ここに回されるのは事実だ。

そろそろ次スレッドの用意を。

732 ：Name_Not_Found ：04/01/19 03:22 ID:???
>>6のFAQ
>overflow プロパティは擬似フレームも作成できる
>　http://alt.s31.xrea.com/tips/overflow.html
>　http://alt.s31.xrea.com/files/frame.html
またまた移転した。↓
　http://kobit.info/tips/overflow.html
　http://kobit.info/files/frame.html

規格書の和訳見れる人いる？

>>956
ちゃんと見られるけど？
http://www.y-adagio.com/public/standards/tr_css2/toc.html
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html#minitoc

>>956

>>3の和訳ならOperaで見られたけど・・・？

>>924-925
禁則処理はCSS3の課題です。
line-break:strict;はWinIEでのみ先取実装中。
cf. http://east.portland.ne.jp/~sigekazu/css/international.htm#line
他のブラウザではいまのところ<span class="NoLineBreak">――</span>とかやって
.NoLineBreak {white-space:nowrap;}とでもするしかない。

>>957
http://www.w3.org/Consortium/Translation/Japanese
http://www.w3.org/Style/css2-updates/translations.html
のリンクが死んでますね。

初心者が口にする紋切り型FAQ。

「〜はできますか？」
　　仕様書やリファレンスを読んでください。
「〜ができません」
　　できなくて当たり前だったり。
「〜のサイトみたいに」
　　人の真似をして楽しいですか。
「これってバグですか？」
　　仕様書やバグ辞典を読めば解かります。
「質問の仕方が悪かったようですね」
　　レトリックを身に付けてください。
「初心者なんで」
　　何時まで初心者でいるつもりですか。
「できました！」
　　おめでとうございます。
「ひと通り調べました」
　　ほとんどの場合は嘘。
「よくわかりません」
　　まったくの思考停止状態。
「わかりました」
　　本当にわかっていますか？

>>961
お前さんは、そのうちどんな質問に対しても
「ﾃﾝﾌﾟﾚのﾘﾝｸ周れば解る」とか言い出しそうだな。

________
|　　　 |
| 画像1 | aaaaaaa
| | aaaaaaa
|_______|

_________
| 画像2 |
| |
|________|

という事をしたいのですが、2点ほど出来ずに頭抱えています。
1つはテキスト(画像1の隣にくるaaaaの部分)なんですが、
テキスト部が画像1に対して中央に来るようにしたいため、画像1に
vertical-align:middleを指定、そして回り込み指定もしているので
同様に画像1にfloat:leftを指定しています。が、vertical-align=middleが
効きません。middleに限らず何も効いていないようです。floatとvertical-align
を2つ同時に使用する事は出来ないのでしょうか。尚、画像1はimg width/height
を使用しています。

もう1つは、white-space:nowrapを画像2に指定しているのですが、
windowが大きくなると画像2がテキスト部の下に表示されてしまいます。
因みに画像1/テキストの次に<br>を入れて画像2を入れています。

>>961さんの仰る事はごもっともだと思います。自分を鑑みてみても
正にその通り・・・自分でも鬱入ってしまっている位です・・・

あぁ、画像ズレちゃっていますがもちろんキッシリ□画像の隣にテキストです。
念のため。

floatとvertical-alignはその性質上相容れるものではない
BRで改行させてレイアウトを取っているようだが、当然正しい使い方ではない
今はたまたま思い通りに見えているだけ
解決策は色々あるが、具体的なソースを見ないとあまり適切は指示は出来ない
imgにdisplay:blockを指定したり色々試してみてね

画像1を float した段階で、画像1は通常フローから切り離され
単独で浮動ボックスを形成するので、もはや画像1とは別のボックスと
化したテキスト部分には vertical-align が効かないってことじゃないかな。

2点目は↓こういう話だと思うんだけど
┌───┐
│　 　 　 │aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
│画像１ │aaaa<br>
│　 　 　 │┌───┐
└───┘│　 　 　 │
　 　 　 　 　 │画像２ │
　 　 　 　 　 │　 　 　 │
　 　 　 　 　 └───┘
画像2に対して white-space:nowrap は意味がないでしょ。
やるなら、画像2を <div> か何かで囲んで、それに対して
clear: left を指定する。画像2を単に display: block しただけでは
この状態は解消されないと思う。

>>963
とにかくＨＴＭＬソースを出して下さい。

vertical-alignはテキスト、即ちインライン要素に対して効かせるもの、ブロックレベル要素の垂直位置は動かせません。

>>693
テキストはpadding-topかmargin-topで高さを調節してやればいいんじゃない？
画像のサイズはあらかじめわかっているわけだし、何px指定すればテキストが
中央あたりにくるかは予想できるだろうし。

clear: leftってデフォルトで左に寄ってしまう仕様を解除するというタグですよね？
それ使うとどこに行ってしまうのでしょうか？

/* CSS･スタイルシート質問スレッド【27】 */
http://pc2.2ch.net/test/read.cgi/hp/1074845459/l50

ローカル・ルールのＣＳＳスレッドへのリンク、ＵＲＬ更新するにはどうしたらいいんだっけ？

>>969
clearはfloatを解除するプロパティーです。（タグに非ず）
知らないことが出てきたら>>4を見て勉強しませう。

>それ使うとどこに行ってしまうのでしょうか？
訊く前に、自分で試したのかな。

>>970
他のスレなんかもとっくにリンク切れになってるからほっとけば？

ならば他のスレッドもリンク切れを直しませう。

>>970
■ ローカルルール等リンク先更新総合スレッド 9
http://qb3.2ch.net/test/read.cgi/operate/1071312042/

>>974
やってみた。
http://qb3.2ch.net/test/read.cgi/operate/1071312042/375


　/* CSS･スタイルシート質問スレッド【27】 */
　http://pc2.2ch.net/test/read.cgi/hp/1074845459/l50

おつ。

( ；´Д｀)うめぇぇぇぇぇぇぇー!

梅&梅

梅（'ж'）すっぺぇ〜

このように書いて外部cssとしてhtmlに呼び出して背景画像を特定の位置に表示させた場合に、フレームページにて、スクロールさせると、内容がグチャグチャにひきづられたようになります。
解決策や、原因わかるかたお願いします。WinXP＋IE6.0です
#main {
background-image:url(../images/main.jpg);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 240px 221px;
}

>980
なんでbackgroundプロパティで纏めて指定しないんだ？
それはともかく、漏れが試した中では再現しなかったのでソースの要点と、
IEでだけなるのかMozillaやOperaでもなるのか
追記してくれるとありがたい。

埋め。

埋め炉！！！

楳

小梅ちゃん

{position:absolute; bottom:0px; left:0px;}
で左下に画像を配置してみたんですが、IE6、Mac版IE5.17、ネットスケープ7（Mac、Win両方）等で確認すると、どのブラウザでも何故か下に10ピクセル程度の隙間ができてしまい困ってます。BODYにmargin、padding共に0px指定してます。

IE6以外では{position:fixed｝にすると解決するんですが、IE6ではfixedを認識してくれないようで、ムチャクチャになってしまいます（さすがにIE6を無視することもできません）。
何かいい方法ないでしょうか。