AnsweredAssumed Answered

HTML code issue

Question asked by michael.pletcher_noaa on Jul 31, 2018
Latest reply on Jul 31, 2018 by ressinger-esristaff

I recently used HTML to create a few simple charts for the side bar of my Story Map. This caused the design of the location pop-ups to display incorrectly in my main stage. Anybody know how I could potentially fix this? Here's what my code looks like for one of my side bar sections:

 

<ul>
<li>20 acres of beach were lost in a single day along coastlines in Baltimore County, representing about 15% of total beach loss in a single year.</li>
<li>Storm surge levels reached 8.15 feet at Fort McHenry near Baltimore, causing damage to many waterfront properties. </li>
<li>400 people were rescued from low-lying areas during the storm.</li>
<li>300 buildings were destroyed, mainly due to storm surge, and hundreds of trees were downed throughout the duration of the storm.</li>
<li>During the storm, Baltimore&#39;s Inner Harbor flooded, prompting boat owners to help evacuate 35 people in flooded homes.</li>
</ul>

<p> </p>

<p>The 8.15 ft. river gauge reading from the Patapsco River at Fort McHenry was a new record, surpassing the previous record by nearly half a foot. The graph below is measured data from the Fort McHenry Patapsco River gauge during Isabel.</p>

<p> </p>

<p> </p>

<div class="image-container"><img alt="" src="https://www.arcgis.com/sharing/rest/content/items/d4095bb3794a4e498e8f641b99d2492a/resources/Baltimore%20River%20Gauge%20Graph__1532435107158__w1200.png?token=dcPyNs9cel6FZqGP8X6K-WdpHu8NQvixoan7toiULlroKn6dLosboTNrnY4RjSz3rkBiSkVZUvC8KcEeSuPaWE7Bez52NltkEal4fzgAtAT_7mm0AvqAlVBQqVKl1xoKiq6EEM4r1PAwUWGsJdyPfRNTBbNPFGjBReOO7LwB-uLAtJtA51dp-FlNF5lUguGE7LMlUV_SpK0OaxkbNC2wwocM1Iuxpey76gfVrEelepI." /></div>

<p><span style="font-size:14px"><span style="color:#0000FF"><em>Graph showing water levels for the Patapsco River gauge at Fort McHenry, MD just outside Baltimore for the duration of Isabel. Storm surge reached a new record of 8.15 feet at this location.</em></span></span></p>

<p> </p>

<p>When comparing Isabel&#39;s record crest to previous record crests, it is clear in the chart below showing the top 5 crests that Baltimore does not see significant tidal events often. As mentioned earlier, the area had not been affected by a storm as strong as Isabel since the 1933 Chesapeake-Potomac hurricane, which is the previous record crest that Isabel broke.</p>

<p> </p>
<style type="text/css">table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
table#t01 {
width: 100%;
background-color: #f1f1c1;
}
</style>
<table>
<tbody>
<tr>
<th>Crest (ft.)</th>
<th>Date</th>
</tr>
<tr>
<td>8.15</td>
<td>09/19/2003</td>
</tr>
<tr>
<td>7.69</td>
<td>08/23/1933</td>
</tr>
<tr>
<td>6.39</td>
<td>08/13/1955</td>
</tr>
<tr>
<td>5.50</td>
<td>10/15/1954</td>
</tr>
<tr>
<td>5.30</td>
<td>
<p>08/04/1915</p>
</td>
</tr>
</tbody>
</table>

<p> </p>

<p><span style="color:#800080"><span style="font-size:12px"><em>(Image at right: Storm surge damage in Havre de Grace, a suburb of Baltimore. Image courtesy of FEMA.)</em></span></span></p>

Outcomes