My coding structure appears as follows:
<article>
<header>
<hgroup>
<h1>Foo </h1>
<h2>Bar</h2>
<h3>1337</h3>
</hgroup>
</header>
<table>
// etc
</table>
</article>
I am aiming for the article element to include a border, margin, and padding:
article {
border: 1px solid black;
padding: 10px;
margin: 10px;
}
The width of the table varies (on different pages), as well as the viewport for each user. What CSS should I implement to ensure that the article element always 'wraps' around the table, maintaining uniform padding?
The default behavior for an article (or div) is 100% width, which can be either too large or too small based on the context.