web-dev-qa-db-ja.com

div要素の幅を取得する

HTML：

<a id="postanad"  href="postad.php">Make a Post</a>

CSS：

#header #postanad {
    position: absolute;
    top: 50px;
    left: 250px ;
    background: #000 url(postad.gif) repeat-x 0% 100%;    
    font: bold 19px Tahoma, 'trebuchet MS', Sans-serif; 
    padding: 5px;


}

背景画像postad.gifを同じ幅にするために、div要素が取っているピクセル/ emのサイズをどのように決定しますか？

明確にするために、幅を動的に決定するのではなく、PSで背景画像を描画できるようにするためにどれだけのスペースが必要かを知りたいだけです。

csswidth
11
gyaani_guy

ページ上の要素の幅を測定することに関心がある場合は、FirefoxでMeasure ITアドオンを使用できます。

https://addons.mozilla.org/en-US/firefox/addon/539/

0
Chandu

JQueryに慣れている場合は、$（ "＃postanad"）。width（）を使用できます。

10
atfergs

CSSは「プログラミング言語」ではありません。言語で設計されていないものについては、実際に意思決定をしたり、データを収集したり、操作したりすることはできません。それをしたい場合は、javascriptが最適です。

バックグラウンドで正確に何をしたいですか？お客様の要件がわかっている場合は、CSSのみのソリューションをご提供できる可能性があります。

2
Gordon Gustafson

@ orthod0ksが言ったようなjQueryの方法は、width（）関数を使用することです。 CSSの方法は、widthとheightを宣言することです。

または、CSSの別の方法は次のとおりです。

Divに背景（background: red;など）を付け、スクリーンショットを取り、PSに貼り付けて、その大きさを確認することもできます。

最後に、Firefoxには（MeasureIt）というプラグインがあります。ピクセル単位で物事のサイズを判断するのに便利です。したがって、両方の解決策が実行可能でない場合は、それを検討する必要があります。

幸運を！

0
Amit

誰かが単純なJavaScriptを使用してdivの幅を取得したい場合：

document.getElementById('div_id').clientWidth;

より多くの可能性については一見してください ここ 。

0
and-bri

問題のdivは動的に再描画されていますか？そうでない場合、最も簡単なのは、＃header #postanadスタイルで高さと幅を設定することです。

0
stoneMonkey77