Jump to content

My HTML charts get scrambled when exiting edit mode and going to preview mode

Recommended Posts

i recently added some html code in code blocks to one of my pages everything was looking perfect for a while but then a week or 2 later in the preview mode of my site the whole page became messes up and the charts would be scrambled i linked some pictures of how it looks in edit mode (supposed to look) and how it looks in preview mode. below is one of my chart code and if anyone has any knowledge let me know if you can find a mistake of possibly a solution. 

<html>
<head>
<style>
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 3px;
}

tr:nth-child(even) {
  background-color: #AC8A38;
}
</style>
</head>
<body>
<h2>Gold Payouts</h2>
<table>
  <tr>
    <th>Amount of Pure Gold
    <th>Karat gold >5% Purity</th>
   
  </tr>
  <tr>
    <td>1g-30g</td>
    <td>90%</td>
  
  </tr>
  <tr>
    <td>30g-75g</td>
    <td>91%</td>
  
  </tr>
  <tr>
    <td>75g-200g</td>
    <td>92%</td>
   
  </tr>
  <tr>
    <td>200g-500g</td>
    <td>93.5%</td>
  
  </tr>
  <tr>
    <td>500g+</td>
    <td>95%</td>
  
  </tr>

after save.PNG

edit.PNG

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.