While using ArcGIS Online's browser map, I attempted to add HTML and CSS code to various plotted points to display a stylized table in a dialog box or small window upon clicking a point. Initially, the table appeared and functioned correctly. However, after saving the layer, removing it, and reloading it, only the raw CSS code and an unstyled table were visible.
Upon consulting the ArcGIS help page on supported HTML, I discovered that the browser version does not support the "style" tag (external, internal, or inline), resulting in its removal from the code. This lack of support caused the table to lose its styling upon reloading.
The page suggests using "div" and "span" as alternatives, but I have been unsuccessful in getting them to function properly. Is there a solution that will allow me to achieve my desired result?
Visit ArcGIS Online Supported HTML Page
Full code below:
<style type="text/css"> (this style tag doesn't work and is automatically filtered out)
.datagrid table {
border-collapse: collapse;
text-align: left;
width: 1280px;
}
.datagrid {
font: normal 12px/150% Arial, Helvetica, sans-serif;
background: #fff;
overflow: hidden;
border: 1px solid #006699;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.datagrid table td,
.datagrid table th {
padding: 12px 10px;
}
...
[Long CSS code continues here]
...
</style> (this style tag doesn't work and is automatically filtered out)
<div class="datagrid">
<table style="text-align:center">
<thead>
<tr>
<th style="text-align:center">header</th>
<th style="text-align:center">header</th>
<th style="text-align:center">header</th>
</tr>
</thead>
...
[Long HTML code continues here]
...
</table>
</div>