Responsive Width Element with Padding – CSS How-to

Padding Extends Beyond Parent Element

Have you ever had an element in your responsive website design which needed some padding, but you couldn’t add it because it broke the design? There’s a solution to that problem. Normally, the element in question will just add padding to the outside of itself, often expanding well beyond the space it is supposed to take up. But there is … Read More

Padding or Margin Only Affects First Line of Text – CSS

A common problem when formatting your website with CSS is that the first line of text in a paragraph, header, or link is affected by margin or padding while the remaining lines are not. It may even appear as though the first line is indented in some cases while none of the others are. Solution for padding or margin only … Read More

Maintain Aspect Ratio for HTML Element Using Only CSS in a Responsive Design

There is an easy way to make a div or other element square or any other shape while still being responsive, using ONLY CSS. I actually stumbled upon this solution myself, and then saw a formal write-up of it by @marcolago here. The solution is actually extremely simple, and you will kick yourself for not figuring it out. This little … Read More