Having trouble with the box-sizing property on aside elements? Check out the code snippets and screenshot below for more information.
Here is the HTML snippet:
<aside>
<h2 class="widgettitle">No active widgets</h2>
There are no active widgets in this area.
</aside>
...
The CSS snippet is as follows:
#footer .top aside {
float: left;
margin-bottom: 30px;
padding-right: 30px;
width: 25%;
box-sizing: border-box;
}
Even though box-sizing is applied, there seems to be an issue with padding. Take a look at the image to see the problem in action.
Image: