Style for sample: Dynamically create layer list

EdwardGriffin — Tue, 24 Sep 2013 03:39:56 GMT

Hi

I am developing a Web Map that uses a modified version of this sample:

https://developers.arcgis.com/en/javascript/jssamples/map_explicitlayerlist.html

I can get the code to work fine but I can not change the style at all.

For some reason when you add side panels etc they all just stack up on each other

Here is the code which specifies the style. Any help would be gratefully received. I'm sure it is something very simple - like something in the script that is specifying the style

[HTML]<style>
    html, body {
      height: 98%;
      width: 99%;
      margin: 1%;
    }

    #rightPane {
      width: 15%;
    }

    #leftPane {
     width: 15%;
     }

    #legendPane {
      border: solid #97DCF2 1px;
    }

    #indicatorPane {
      border: solid #97DCF2 1px;
    }

</style>[/HTML]

[HTML]<body class="claro">

<div id="content"
     data-dojo-type="dijit.layout.BorderContainer"
     data-dojo-props="design:'headline', gutters:true"
     style="width: 100%; height: 100%; margin: 0;">

<div id="rightPane"
       data-dojo-type="dijit.layout.ContentPane"
       data-dojo-props="region:'right'">

    <div data-dojo-type="dijit.layout.AccordionContainer">
      <div data-dojo-type="dijit.layout.ContentPane" id="legendPane"
           data-dojo-props="title:'Legend', selected:true">

      </div>
      <div data-dojo-type="dijit.layout.ContentPane"
           data-dojo-props="title:'Pane 2'">
        This pane could contain tools or additional content
      </div>
    </div>

</div>

    <div id="leftPane"
       data-dojo-type="dijit.layout.ContentPane"
       data-dojo-props="region:'left'">

    <div data-dojo-type="dijit.layout.ContentPane" id="indicatorPane"
           data-dojo-props="title:'Indicator List'">
<img src="http://www.health.govt.nz/sites/all/themes/tropical_sunset/images/moh-default-logo.png" align="middle">

        <br />
    <br />
        NZHS Indicators:<br><br>
     <br />
    Layer List : <span id="layer_list"></span><br />
    <br />

      </div>
</div>
<div id="map"
       data-dojo-type="dijit.layout.ContentPane"
       data-dojo-props="region:'center'"
       style="overflow:hidden;">

</div>
</div>
</body>[/HTML]

topic Style for sample: Dynamically create layer list in ArcGIS JavaScript Maps SDK Questions

Style for sample: Dynamically create layer list