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

952 ：Name_Not_Found：2006/03/25(土) 17:00:07 ID:???

とりあえず、divに生でtestって書くのはｲｸﾅｲ。

953 ：Name_Not_Found：2006/03/25(土) 18:27:26 ID:???

重なるって何がだろう。

954 ：Name_Not_Found：2006/03/25(土) 18:50:45 ID:???

>>952
そうなの？知らなかった。
<h3> あたりでも追加するよ

>>953
上の<li><a href="hogehoge.html" title="リンク">リンク</a></li>ってあたりに
下の<li><a href="hogehoge.html" title="はじめての方へ">はじめての方へ</a></li>
が重なる。なぜか下のが上に行っちゃう・・・

955 ：Name_Not_Found：2006/03/25(土) 18:53:49 ID:???

>>953
http://zetubou.mine.nu/itoshiki/nozomu/zetubou21778.jpg
一応、画像アップロードした。
954で説明したよりもっと下に下がってました。

956 ：Name_Not_Found：2006/03/25(土) 19:16:16 ID:???

>>955
で、これをどうしたいの？
2列に並べる予定？

957 ：Name_Not_Found：2006/03/25(土) 19:18:53 ID:???

Gecko/20050922のSylera/2.2.7と、
Gecko/20060130のBagel/0.3.2、SeaMonkey/1.0でチェックしてみたがずれない。
Firefoxは重いから居れてないのでスマン。
だが、Geckoエンジン使ってるので違いが出ないと思うんだけどなぁ。

多分ここに書いたソース以外に原因がある予感。

958 ：Name_Not_Found：2006/03/25(土) 19:22:22 ID:???

>>956
普通に縦にしたいのですが・・・（上のソースを普通にIEやNNやOperaなどで見てるのと同じように
Firefoxでも見れるようにしたいのです。）

959 ：Name_Not_Found：2006/03/25(土) 19:27:30 ID:???

>>958
いろいろ突っ込みたいとこだが、.sideのheight:1%;って何？

960 ：Name_Not_Found：2006/03/25(土) 19:27:34 ID:???

>>956
また画像UPした。
http://zetubou.mine.nu/itoshiki/nozomu/zetubou21780.jpg
NNでもずれてた・・・NN起動したつもりがIE系タブブラウザだったorz

961 ：Name_Not_Found：2006/03/25(土) 19:27:43 ID:???

Geckoのバージョンとかにもよるんじゃ。
Geckoのバグか、その他の部分のソースの影響かわからんしなぁ。

962 ：Name_Not_Found：2006/03/25(土) 19:27:57 ID:???

>>958
画像じゃなくて、html と css をアップロードしなさい。
本人が関係無いと思って削ってる所がおかしいとかは、良くある話だ。

963 ：Name_Not_Found：2006/03/25(土) 19:29:45 ID:???

>>959
それだ！解決した・・・
突っ込みどころ満載でつか？もっと突っ込んでください。

964 ：Name_Not_Found：2006/03/25(土) 19:30:15 ID:???

>>962
まだ作り直し途中なので削ってないです。

965 ：Name_Not_Found：2006/03/25(土) 19:37:02 ID:???

font-sizeは絶対値指定は止めた方がいいぞ。
%とかで指定しとくのがお勧め。
あと、marginは最初に
*{margin:0; padding:0;}
って指定してブラウザごとの取り方の誤差を削っておくと楽。

それと、個人的に!importantは嫌いｗ

966 ：Name_Not_Found：2006/03/25(土) 19:43:30 ID:???

>>963
ul.listの2重の指定margin: 0px 0px 0px 0px!important; margin-left: -2px!important; 、
list-style: none!importantってIEは？、しかもlist-style-typeが普通、とかさ。
まあがんがれ。

967 ：Name_Not_Found：2006/03/25(土) 21:00:20 ID:???

基本から勉強したほうがいいと思うよ

968 ：Name_Not_Found：2006/03/25(土) 22:32:11 ID:???

>>966
ってIEは？って意味がわからないんですけど・・・

969 ：Name_Not_Found：2006/03/25(土) 22:33:16 ID:???

>>965
*{margin:0; padding:0;}
* は一つ一つのIDやClassを書かないといけないよね？

970 ：Name_Not_Found：2006/03/25(土) 22:33:47 ID:???

>>966
関係ないのに話に入るが
!important って最後につけると意味あるの？？

971 ：970：2006/03/25(土) 22:35:56 ID:???

>>966
あと一つ、まだまだスタイルが未熟で疑問が出てきた
none って値にするのとないのは全く同じ？？

972 ：Name_Not_Found：2006/03/25(土) 22:38:08 ID:???

デフォルトの値を継承する

973 ：Name_Not_Found：2006/03/25(土) 22:41:39 ID:???

すまん、意味を取り違えた
list-style: none
これはリストマークを表示しない

974 ：Name_Not_Found：2006/03/25(土) 22:42:21 ID:???

うざい。テンプレサイトいけ

975 ：Name_Not_Found：2006/03/25(土) 23:39:35 ID:???

　　／：》：､∩
　　（===○=）/ 　ウンコ漏れました
＿_ /　　⇔ /
＼⊂ノ￣￣￣＼
||ヽ||￣￣￣￣||
　...||￣￣￣￣||

976 ：Name_Not_Found：2006/03/25(土) 23:51:37 ID:???

自分で食べろ

977 ：Name_Not_Found：2006/03/26(日) 11:37:44 ID:???

#linksLeftBox {
float: left;
width: 195px;
}
#linksLeft {
margin-bottom: 20px;
margin-left: 10px; /* shadow */
}
.sidetitle2 {
margin: 0px 0px 0px -5px;
padding: 4px 3px 3px 22px;
border-top: 1px solid #666699;
border-bottom: 1px solid #666699;
font-size:9px;
letter-spacing: 0.05em;
width: auto;
text-align: left;
background-image: url("./img/background2.gif");
background-attachment: fixed;
background-color: #F2F4FC;
}
ul.list1 {
list-style: none;
margin: 0px 0px 0px 0px;
padding: 15px 22px 18px 22px;
width: auto;
font-size: 10px;
line-height: 150%;
}

978 ：Name_Not_Found：2006/03/26(日) 11:38:14 ID:???

ul.list1 li {
margin: 0px;
padding: 0px 0px 3px 12px;
list-style: none;
background-image: url("./img/menupoint.gif");
background-repeat: no-repeat;
background-position: 0pt;
}
.blog {
margin: 0px 5px 0px 200px;
padding: 22px 0 20px 0;
}
#footer {
font-size:10px;
FONT-FAMILY:Verdana,Arial,"ＭＳＰゴシック",Osaka;
width:100%;
line-height:150%;
margin:0px 5px;
padding:20px 0px;
text-align : center;
border-top: #949495 1px solid;
}

<div id="linksLeftBox">
<div id="linksLeft">

<BR>
<div class="sidetitle2">
<h4>testtest</h4>
</div>

979 ：Name_Not_Found：2006/03/26(日) 11:39:04 ID:???

<ul class="list1">
<li>testtesttest</li>
<li>testtesttest</li>
<li>testtesttest</li>
<li>testtesttest</li>
<li>testtesttest</li>
<li>testtesttest</li>
</ul>

</div>
</div>

<div class="blog">

本文・・・<BR>
本文・・・<BR>
本文・・・<BR>

</div>

<div id="footer">
Copyright ©
</div>

footerが本文の下に行ってしまう。
testtestと本文の下に行かせたいのだが
floatでうまくいきません。

980 ：Name_Not_Found：2006/03/26(日) 11:47:31 ID:???

>979
#footer {
clear:both;
}

981 ：Name_Not_Found：2006/03/26(日) 12:08:34 ID:???

<div id="banner">
<a href="http://www.hogehoge.com/" accesskey="1">hogehogehogehogehogehogehogehogehogehoge</a>
</div>

#banner {
margin: 0 5px;
padding: 20px 0 20px 200px;
text-align: left;
border-bottom: 1px solid black;
background-image: url("http://www.google.co.jp/images/logo_sm.gif");
background-attachment: fixed;
background-repeat: no-repeat;
background-position: 20px center;
}

左から20pxの位置、上下の真ん中に背景を表示させたいのですが
IEだと思い通りにちゃんと表示されます。
FirefoxとOperaだとどこかに隠れてるのか表示されません。
NNだとやたら左上に表示されます。

982 ：981：2006/03/26(日) 12:09:07 ID:???

分かる方どうか教えてください。

983 ：Name_Not_Found：2006/03/26(日) 12:30:27 ID:???

>>982
分かる方って・・・まあいいか。
fixedはいらない。

984 ：Name_Not_Found：2006/03/26(日) 14:17:47 ID:/ThAfAwL

次スレッド立てる人、要注意！

>>1
>【CSS検証】>>2
……って、落ちてるけど？

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

985 ：Name_Not_Found：2006/03/26(日) 14:47:30 ID:???

以下のようなHTMLに次のレスのようなCSSを適用しているのですが、
MacのFirefoxやSafariでは問題が無いのに、WinのIE6だとid="navi"
の高さが下のid="content"の内容量に応じて変化します。
どのブラウザで見ても、id="navi"を高さ30px;で固定したいのですが、
分かる方いらっしゃったら教えてください。
はげしくｶﾞｲｼｭﾂっぽいですがどうかよろしくお願いします。
（散々ぐぐりました）

---HTML---
<body>
<table id="layout" align="center">
<tr>
<td id="navi" rowspan="2">
メニューが入っています
</td>
<td id="logo">
<h1>ロゴが入っています（画像）</h1>
</td>
</tr>
<tr>
<td id="content">
コンテンツが入っています
</td>
</tr>
<tr>
<td id="footer" colspan="2">
フッターが入っています
</td>
</tr>
</table>
</body>

986 ：985：2006/03/26(日) 14:49:06 ID:???

---CSS---
body {
margin: 0px;
font-size: 12px;
line-height: 1.5;
color: #333333;
}

img{
border-width: 0px;
}

#layout{
width: 700px;
}

#navi{
width: 145px;
vertical-align: top;
text-align: left;
}

つづく

987 ：985：2006/03/26(日) 14:50:15 ID:???

#logo{
margin: 0px;
padding: 0px;
height: 30px;
text-align: right;
}

h1{
margin: 0px;
}

#content{
padding: 5px;
width: 555px;
background-color: #cccccc;
background-position: top right;
background-repeat: no-repeat;
vertical-align: top;
}

#footer{
width: 700px;
height: 50px;
background-color: #000000;
vertical-align: middle;
text-align: center;
}

以上

988 ：985：2006/03/26(日) 14:52:50 ID:???

高さが変わってしまって困ってるのはid="logo"でした。ｽﾐﾏｾﾝ
どのブラウザで見てもid="logo"が同じ高さになるようにしたいです。
よろしくお願いします。

989 ：Name_Not_Found：2006/03/26(日) 15:06:13 ID:???

>>988
h1の文字の大きさに影響されてしまってるんだと思う。
h1の文字の大きさをfont-size: 100%;みたいな感じで指定してみ。

あと、paddingとmarginをいちいち0指定するのは面倒でしょ？
最初の行に
*{margin:0; padding:0;}
って書いておくと楽チン。

990 ：Name_Not_Found：2006/03/26(日) 15:11:03 ID:???

>>983
fixedを削除しました。
FirefoxとOperaでは正常になりましたが
NNだと左上から動いてません。

991 ：Name_Not_Found：2006/03/26(日) 15:11:33 ID:???

うち無理だった。
誰かスレ立てよろしく。

>>984を>>2に追加を忘れないでおくれ。

992 ：985：2006/03/26(日) 15:13:25 ID:mMIY0hNs

>>989
ありがとうございます。
やってみましたがダメでした。
試しにh1タグを外したりid="logo"のセル内を空にしてみたのですが
症状は一緒でした。id="content"の中身の量に応じて30px～100px
くらいの範囲でid="logo"の高さが変わります。

993 ：Name_Not_Found：2006/03/26(日) 15:22:24 ID:???

>>992
<td id="navi" rowspan="2"> だからなんでは？
IEだけ均等に配置してしまうとか。

994 ：985：2006/03/26(日) 15:27:22 ID:???

>>993
もしそうだとするとこのレイアウトでは回避方法は無いという
ことになりますよね？
均等にはなってないんですが、id="logo"が100pxくらいの時
下のid="content"は500pxとかだったり・・・
<div>でやった方が良いんでしょうか・・・

995 ：Name_Not_Found：2006/03/26(日) 15:28:44 ID:???

>>990
判りにくいから、名前欄に最初の質問時の番号入れてね。
そりゃ内容が1行しかないdivに指定してるからでしょ。
bodyに指定すれば？

996 ：Name_Not_Found：2006/03/26(日) 15:34:08 ID:???

>>992
うちでは同じに表示されてるぞ。
ttp://zetubou.mine.nu/itoshiki/nozomu/zetubou21827.png

弄ったのは最初の行に
*{margin:0; padding:0;}
を居れて、残りはこれだけ。
h1{
margin: 0px;
font-size: 100%;
}

中身がはみ出ると当然指定した高さより大きくなるから、
h1の文字が大きいと当然30pxに収まるわけが無い。

997 ：Name_Not_Found：2006/03/26(日) 15:43:43 ID:???

>>996
そういう事ではないと思うんだが・・・・

998 ：Name_Not_Found：2006/03/26(日) 15:48:49 ID:???

ソースも流れもきちんと見てないけど
「本当に高さを指定したいのは tr なんです（＞＜）」っていうお話？

次スレまだないね。俺は立てられなかった。

999 ：Name_Not_Found：2006/03/26(日) 15:53:39 ID:???

>>997
h1{background-image:url("./test.jpg")}
って感じってこととか？
うーん…わからんので、
わかるお前さんがちゃきちゃきっと答えたってくれ。

1000 ：Name_Not_Found：2006/03/26(日) 15:54:21 ID:qZmPdTbn

1000なら寝る

1001 ：１００１：Over 1000 Thread

このスレッドは１０００を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。