ottenere larghezza di un elemento div

Question

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; 


} 

Come faccio a determinare la dimensione in pixel/EMS che l'elemento div sta prendendo in modo che possa rendere lo sfondo immagine postad.gif per essere della stessa larghezza?

Giusto per essere chiari, non voglio determinare la larghezza in modo dinamico, ma voglio solo sapere quanto spazio ci sta prendendo in modo che possa disegnare un'immagine di sfondo in PS.

Answer 1

Se siete interessati a misurare la larghezza di un elemento in una pagina è possibile utilizzare misurare addon su Firefox:

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

Answer 2

Se sei a tuo agio con jQuery, si può semplicemente utilizzare $ ("#postanad"). larghezza().

Answer 3

Il CSS non è un "linguaggio di programmazione". Non è possibile prendere decisioni, raccogliere dati o manipolare qualsiasi cosa che il linguaggio non è stato progettato per fare. Se vuoi farlo, javascript è la scelta migliore.

Che cosa esattamente vuoi che accada con lo sfondo? Potremmo essere in grado di aiutarti a ottenere una soluzione CSS solo se conosciamo i tuoi requisiti.

Answer 4

Il div in questione viene ridisposto in modo dinamico? Perché se no, la cosa più semplice è impostare l'altezza e la larghezza nello stile #header #postanad.

Answer 5

Il modo jQuery, come @ orthod0ks, sarebbe utilizzare la funzione width(). Il modo CSS sarebbe quella di dichiarare una width e height

O, un altro modo CSS sarebbe quello di:

Si può anche mettere uno sfondo sul div (come background: red;), prendere uno screenshot e incollare in PS per vedere quanto è grande.

Infine, Firefox ha un plugin chiamato (MeasureIt). È piuttosto utile per determinare le dimensioni delle cose in termini di pixel. Quindi dovresti esaminarlo se entrambe le soluzioni non sono praticabili per te.

Buona fortuna!