How to find the width of the content area of a component

Often you need to know exactly how wide to make an image to fit within a column or component on a web page.
To do this you need to know just how wide the content area is within that component to size your image. To be able to measure a page or measure a component:
 
  1. Create your page and add a component. Position the component on the page
  2. Insert a table, right click - table properties and make sure the width is set to 100% wide with a 1pixel border, into the content area of that component and save the component
  3. Install the plugin MeasureIt for Firefox or MearsureIt for Chrome (Note: this works more reliably in Firefox)
  4. measure the width of the table to calculate the total width of your content area. You do this by simply selecting the ruler icon in the top right of your browser
    ruler.jpg
    and drawing across the full width of your table
    dimensions2.jpg
  5. Note down the pixel width somewhere safe for future reference