I was having a debate with a friend the other day, and we came across an interesting example. The question at hand is whether the container has a width of 500px or 580px. When we say "content," we are referring to the space between the sides of the banner picture and a straight line that runs through all the text.
We tried looking in the inspect window, but we couldn't pinpoint where the width should be indicated.
The website is structured using tables because it is designed for email newsletters.
Here's an example where the width is specified in the html:
<!-- Top Picture Start -->
<table class="row background-color__blue">
<tr>
<td class="center img-position" align="center">
<center>
<table class="container">
<tr>
<td class="wrapper last">
<table class="twelve columns">
<tr>
<td>
<a class="remove-banner-space" href="http://google.dk"><img width="580" height="300" src="http://d21vu35cjx7sd4.cloudfront.net/dims3/MMAH/crop/586x293%2B0%2B95/resize/580x290%5E/quality/90/?url=http%3A%2F%2Fs3.amazonaws.com%2Fassets.prod.vetstreet.com%2F4a%2Ff0%2Fc29d3f434ae6abd19f5433140124%2Fborder-collie-AP-XO4EXW-590sm52314.jpg" alt="Test" /></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<!-- Top Picture End -->
In the CSS, the width should also be set to 580px:
table.container {
background: #fefefe;
width: 580px;
margin: 0 auto;
Margin: 0 auto;
text-align: inherit;
}