[PR]ネットとスマホ まとめておトク!

現在wordpressでサイトを作っているんですがimg画像の大きさを指定するのに
width指定の方は大きさが変わるんですがheightの指定が無視されて困っています。
CSSの設定でheightだけ無効にするような方法があるのでしょうか。
よろしくお願いいたします。

このQ&Aに関連する最新のQ&A

A 回答 (2件)

img要素は置換インライン要素で、そのサイズは置換される要素のサイズに依存する。


 ここは良いですよね。

画像 640px×480px を用意して・・
<img src="[URL]" width="420" height="360" alt="テスト画像">
のような、HTML要素の属性として指定されていると、これに従います。

 詳細度は0ですから、スタイルシートで指定されていると上書きされます。
[ユーザーの最重要宣言]>[著者の最重要宣言]>著者の宣言>ユーザーの宣言>ブラウザの指定

 同じ詳細度だと、後出のもので上書きされます。

>heightの指定が無視されて困っています。CSSの設定でheightだけ無効
 heightが無効になっているので、「無視される」でよいのでは???

  質問の意味が不明です。

 
    • good
    • 0

これだけの情報ですとなんとも状況がわかりませんね。



設定自体ではそのようなことになるかもしれませんが、
可能性はいろいろとあるので一概には言えません。

デベロッパーツールで確認はしていますでしょうか。

この回答への補足

自己解決しました。
ありがとうございました。

補足日時:2014/07/31 11:17
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

QCSSでボックスのheightが0になる

http://css-happylife.com/

上のサイト(私のサイトではないです)で、

<div id="contentsInner">
<div id="main">
</div>
<div id="sub">
</div>
</div>

という部分があります。
CSSはだいたい下のような感じです。

#contentsInner {
margin:0pt auto;
position:relative;
width:910px;
}
#main {
float:left;
overflow:hidden;
width:500px;
}
#sub {
float:right;
margin-top:20px;
padding:8px 0pt 8px 10px;
width:390px;
}

Firebugで確認したところ、
#mainの大きさは500 x 1552
#subの大きさは390 x 1305
に対し、
#contentsInnerの大きさは910 x 0
と、高さが0になっています。
もちろん、#contentsInnnerに背景画像を設定しても
表示されることはありません。
ブラウザもheight=0と認識しているようです。

なぜ高さが0になってしまっているのでしょうか。
このバグ?の対策を教えてください。
よろしくお願いします。

http://css-happylife.com/

上のサイト(私のサイトではないです)で、

<div id="contentsInner">
<div id="main">
</div>
<div id="sub">
</div>
</div>

という部分があります。
CSSはだいたい下のような感じです。

#contentsInner {
margin:0pt auto;
position:relative;
width:910px;
}
#main {
float:left;
overflow:hidden;
width:500px;
}
#sub {
float:right;
margin-top:20px;
padding:8px 0pt 8px 10px;
width:390px;
}

Firebugで確認したところ、
#mainの大きさは50...続きを読む

Aベストアンサー

http://www.y-adagio.com/public/standards/tr_css2/visudet.html#q16
こちらにあるようにfloadしているボックスの高さは無視されますので、
バグでもなんでもなくて正しい挙動です。
(古いIEではこれを無視しないという誤った挙動をしていました。現在でも互換モードではその動作を継承します。)

http://www.geocities.jp/multi_column/float/05.html
http://www.fsiki.com/archive/css-doc/float.html
こちらが対処のヒントになると思います。

Qテーブルセル余白(例えば左側だけ、上側だけ、など)

こんにちは。
宜しくお願いいたします。

テーブル内のコードに、cellpadding="5" は
セル余白が上下左右のすべて、5ピクセル空きますが、

左側だけ5ピクセル、とか、上側だけ5ピクセル、のように
指定方向のみ、余白を作ることは可能でしょうか。

その場合のHTML記述を教えてください。

また、ここで質問させていただいている「指定方向への余白指定」と
全体余白指定の「cellpadding="XX"」は同時に使って
良いものでしょうか。
素人質問ですみません。
宜しくお願いいたします。

Aベストアンサー

1つのセルだけなら、下記で。
<td style="padding: 5px 10px 20px 30px;">
上の例は、上が 5px。 右が 10px。下が 20px。 左が 30px。
適当に数値変更してください。
cellpadding="5" と style="padding: 5px;"は同じになるはず。
<td style="padding: 5px;">

両方使うとどうなるかは、試して下さい。
cellpadding をここ数年利用していないので・・・

複数個所利用するなら、NO.1さんを参考に HEAD内に下記を入れて試してみましょう。
<style type="text/css">
<!--
td {padding: 5px 10px 20px 30px;}
-->
</style>

Q外側のdivの高さを入れ子のdivの高さに自動的に合わせたい

外側のdivの高さを入れ子のdivの高さに自動的に合わせたい

添付画像のようなコンテンツを作成しています。
外側のdiv(contents_box)内にcontents_imgとcontents_textのdivを配置しています。
このcontents_imgとcontents_textの高さに合わせて外側のcontents_boxも自動的に変動させたいのですが、どのようにしたら良いのでしょう?
高さをautoですとただの棒のようになってしまい、ダメでした。
どうぞよろしくお願い致します。

xhtml

<div id="contents_box">
<div id="contents_img">ここに画像</div>
<div id="contents_text"> ここにテキスト</div>
</div>

css
#contents_box {
height: auto;
width: 805px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #333;
}

#contents_img {
height: auto;
width: 300px;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 0px;
float: left;
}

#contents_text {
height: auto;
width: 485px;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 10px;
margin-left: 10px;
float: right;
text-align: justify;
}

外側のdivの高さを入れ子のdivの高さに自動的に合わせたい

添付画像のようなコンテンツを作成しています。
外側のdiv(contents_box)内にcontents_imgとcontents_textのdivを配置しています。
このcontents_imgとcontents_textの高さに合わせて外側のcontents_boxも自動的に変動させたいのですが、どのようにしたら良いのでしょう?
高さをautoですとただの棒のようになってしまい、ダメでした。
どうぞよろしくお願い致します。

xhtml

<div id="contents_box">
<div id="contents_img">ここに画像</div>
<div ...続きを読む

Aベストアンサー

クリアーしていないって事かな・・・ 色々方法はあるけど。
----------------

<div id="contents_box">
<div id="contents_img">ここに画像</div>
<div id="contents_text"> ここにテキスト</div>
<hr /> <!-- 追加 -->
</div>



#contents_box {
width: 805px;
}
#contents_box hr { clear: both;} /* 追加 */

#contents_img {
width: 300px;
margin: 10px 0;
float: left;
}

#contents_text {
width: 485px;
margin: 10px 0;
float: right;
text-align: justify;
}

Qテーブルの行の高さを指定する時全てのtdタグに?

スタイルシートでテーブルの行の高さを指定する時は、
全てのtdタグにスタイルシートを指定するべきか、
1つだけ(一番左だけ)指定すればいいのかわからないので押してください。


全てのtdタグに指定しても、一つのtdタグに指定しても、結局はその行の高さは指定した高さになります。

コードを書く上でどちらが適切か教えてください。
--------------------------------------------------


<style type="text/css">

td.test {height: 50px;}

</style>

<body>

1の例<br>(2列ともclass="test"を入れた)<br>

<table border=1>
<tr><td class="test">1</td><td class="test">2</td></tr>
<tr><td class="test">3</td><td class="test">4</td></tr>
</table>

<br><br>

2の例<br>(一番左の列だけclass="test"をいれた)<br>

<table border=1>
<tr><td class="test">1</td><td>2</td></tr>
<tr><td class="test">3</td><td>4</td></tr>
</table>

<br><br>

3の例<br>(スタイルシートは何も指定していない)<br>

<table border=1>
<tr><td>1</td><td>2</td></tr>
<tr><td>3</td><td>4</td></tr>
</table>

スタイルシートでテーブルの行の高さを指定する時は、
全てのtdタグにスタイルシートを指定するべきか、
1つだけ(一番左だけ)指定すればいいのかわからないので押してください。


全てのtdタグに指定しても、一つのtdタグに指定しても、結局はその行の高さは指定した高さになります。

コードを書く上でどちらが適切か教えてください。
--------------------------------------------------


<style type="text/css">

td.test {height: 50px;}

</style>

<body>

1の例<br>(2列ともclass="test"を入れた...続きを読む

Aベストアンサー

テーブルの行の高さ、なので <tr> タグに指定するのが素直でしょうか。

<style>
table tr { height:1em; } /* 全ての行に適用 */
table tr.test { height:3em; } /* 特定の行のみ適用 */
</style>

<table border>
<tbody>
<tr> <td> 1 <td> 2
<tr> <td> 3 <td> 4
<tr class=test> <td> 5 <td> 6
</table>

Qpingでポートの指定

pingでIPアドレスを指定して、通信できるかどうかというのは
よく使いますが、pingでポートを指定して応答するかどうかは調べられるのでしょうか?

よろしくお願いします

Aベストアンサー

pingを含むICMPというプロトコルは、OSIの7レイヤで言うところのL2(同一セグメント内通信)とL3(IPルーティングされた通信)の両方にまたがる、ちょっと珍しいプロトコルです。

IPアドレスは指定できますが、別サブネットに属するIPアドレスに到達できればL3通信、できなければゲートウェイと呼ばれる同一サブネットに属する中継装置からの回答を得るという点でL2(MAC通信ではなく、同一セグメント内通信という意味)通信です。

ポート番号はL4で使用されるアドレスですから、L4機能の疎通確認はping(を含むICMP)ではできません。

FTPの疎通確認であれば、クライアントからサーバに対するTCP/21通信(FTP-CMD)が可能であること(サーバからクライアントへのTCP/21からの応答を含む)+サーバからクライアントに対するTCP/20通信(FTP-DATA)が可能であること(クライアントからサーバへのTCP/21からの応答を含む)が必要でしょう。

監視ソフトによるものであれば、
・クライアントからサーバへのログイン(TCP/21)
・クライアントからサーバへのlsの結果(TCP/20)
で確認すればよいでしょう。

pingを含むICMPというプロトコルは、OSIの7レイヤで言うところのL2(同一セグメント内通信)とL3(IPルーティングされた通信)の両方にまたがる、ちょっと珍しいプロトコルです。

IPアドレスは指定できますが、別サブネットに属するIPアドレスに到達できればL3通信、できなければゲートウェイと呼ばれる同一サブネットに属する中継装置からの回答を得るという点でL2(MAC通信ではなく、同一セグメント内通信という意味)通信です。

ポート番号はL4で使用されるアドレスですから、L4機能の疎通確認はping(を含む...続きを読む


人気Q&Aランキング

おすすめ情報