Thank you very much, for the advise and the example.<br>It works exellent.<br><br><br><br><br><div><span class="gmail_quote">2007/10/4, Tim Schaub &lt;<a href="mailto:tschaub@openplans.org">tschaub@openplans.org</a>&gt;:</span>
<blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">Hey-<br><br>Leandro R wrote:<br>&gt; Hello!!!<br>&gt; Is there any chance to put a Panel (a collection of buttons in my case)
<br>&gt; outside the Map.<br>&gt; I have tried with the &#39;div&#39; option, but doesn&#39;t work for me.<br>&gt; Am I doing something wrong?.<br><br>A couple things.<br><br>Any time you do *anything* that requires a custom layout/style (for me
<br>this means always), use a separate link tag to point to the OL default<br>style.&nbsp;&nbsp;That is<br><br>&lt;link rel=&quot;stylesheet&quot; href=&quot;../theme/default/style.css&quot; type=&quot;text/css&quot; /&gt;<br><br>This stops the dynamic stylesheet loading that breaks the cascading
<br>nature of CSS.<br><br>Second, if you extend the default styles, you&#39;ll need to add a class<br>name to your panel element.&nbsp;&nbsp;That is<br><br>&lt;div id=&quot;panel&quot; class=&quot;olControlPanel&quot;&gt;&lt;/div&gt;
<br><br>The alternative is to copy the olControlPanel style into a declaration<br>that references your #panel element.<br><br>I just put up a quick example that demonstrates this (see [1] and [2]).<br><br>Hope that helps,
<br>Tim<br><br>[1]<br><a href="http://trac.openlayers.org/browser/trunk/openlayers/examples/editingtoolbar-outside.html">http://trac.openlayers.org/browser/trunk/openlayers/examples/editingtoolbar-outside.html</a><br><br>
or after the svn update occurs<br><br>[2] <a href="http://openlayers.org/dev/examples/editingtoolbar-outside.html">http://openlayers.org/dev/examples/editingtoolbar-outside.html</a><br><br><br>&gt; Thanks<br>&gt; Here is the page:
<br>&gt;<br>&gt; &lt;style type=&quot;text/css&quot;&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; #map {<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;width: 650px;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height: 550px;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;border: 1px solid black;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; .olControlPanel div {
<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; display: block;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; float: left;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; margin: 3px;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width: 24px;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height: 24px;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; background-color:red;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }...
<br>&gt;<br>&gt; &lt;script type=&quot;text/javascript&quot;&gt;<br>&gt; var panel = new OpenLayers.Control.Panel({div:$(&#39;panel&#39;)});<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; panel.addControls([<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new OpenLayers.Control.MouseDefaults
(), // DragPan +<br>&gt; MouseWheel<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new OpenLayers.Control.ZoomBox(),<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new OpenLayers.Control.ZoomToMaxExtent()<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ]);<br>&gt; map.addControl(panel);<br>&gt;
<br>&gt; &lt;body onload=&quot;init()&quot;&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp; &lt;table&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td style=&quot;width:40px&quot; valign=&quot;middle&quot; rowspan=&quot;3&quot;&gt;&lt;div<br>&gt; id=&quot;panzoombar&quot;&gt;&lt;/div&gt;&lt;/td&gt;
<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td colspan=&quot;3&quot; align=&quot;right&quot;&gt;&lt;div id=&quot;panel&quot;&gt;&lt;/div&gt;&lt;/td&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td colspan=&quot;3&quot;&gt;&lt;div id=&quot;map&quot;&gt;&lt;/div&gt;&lt;/td&gt;
<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td align=&quot;left&quot; style=&quot;font-size:0.8em;<br>&gt; font-family:Verdana&quot;&gt;&lt;div id=&quot;scale&quot;&gt;&lt;/div&gt;&lt;/td&gt;<br>
&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td align=&quot;right&quot; style=&quot;font-size: 0.8em;<br>&gt; font-family:Verdana&quot;&gt;&lt;div id=&quot;position&quot;&gt;&lt;/div&gt;&lt;/td&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/tr&gt;<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/table&gt;
<br>&gt;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div id=&quot;nodelist&quot;&gt;&lt;/div&gt;<br>&gt; &lt;/body&gt;<br>&gt;<br>&gt; !DSPAM:4033,4703e79c210551804284693!<br>&gt;<br>&gt;<br>&gt; ------------------------------------------------------------------------
<br>&gt;<br>&gt; _______________________________________________<br>&gt; Users mailing list<br>&gt; <a href="mailto:Users@openlayers.org">Users@openlayers.org</a><br>&gt; <a href="http://openlayers.org/mailman/listinfo/users">
http://openlayers.org/mailman/listinfo/users</a><br>&gt;<br>&gt;<br>&gt; !DSPAM:4033,4703e79c210551804284693!<br><br>_______________________________________________<br>Users mailing list<br><a href="mailto:Users@openlayers.org">
Users@openlayers.org</a><br><a href="http://openlayers.org/mailman/listinfo/users">http://openlayers.org/mailman/listinfo/users</a><br></blockquote></div><br>