rikke

changing the structure of the Legend dijit

Discussion created by rikke on Jan 12, 2011
Latest reply on Jan 19, 2011 by lowgas
Hi Everyone,

I am trying to modify the legend widget so that the swatch and label are shown on one line (i.e. adjacent to eachother). The default dijit places the swatch below the label.

In this example, it is shown as I would like it:
http://help.arcgis.com/en/webapi/javascript/arcgis/demos/widget/widget_legend.html

The problem I am having is that the design is not controlled by CSS/styling, but has a completely different HTML structure. In checking the code of the sample above, I can see that the HTML structure is:
[HTML]<tr>
  <td>SWATCH</td>
  <td>
    <table>
      <tr>
         <td>LABEL</td>
      </tr>
    </table>
  </td>
</tr>[/HTML]

however, in the default dijit, it is drawn as:
[HTML]<tr>
  <td>LABEL</td>
</tr>
<tr>
  <td>SWATCH</td>
</tr>[/HTML]

Strange, since as far as I can tell, the default and demo both use the same dijit! Does anyone know how I can setup the legend to match the demo?

Thanks,
Richard.

Outcomes