Comma-separated list Here’s a neat little trick that allows you to create a comma-separated list using just an HTML unordered list and a couple of lines of CSS. ul > li:not(:last-child):after { content: “, “; } In order for this to work you need to make sure to set the display property of the li tag to inline-block. <ul> <li>First […]
Category: Images
CSS External links
1. External links Styling external links can be done in several ways. One way to do this is by adding an extra class to all the external links. This is cumbersome and unnecessary since this can be done very easily by only using CSS. Let’s take a look at the following selector. a[href*=”//”]:not([href*=”yourwebsite.com”]) { /* […]
Resize an image in HTML
Preserving the aspect ratio while resizing images When you specify both height and width, the image might lose its aspect ratio. You can preserve the aspect ratio by specifying only width and setting height to auto using CSS property. img { width: 400px, height: auto } This will render a 400px wide image. The height is adjusted accordingly to preserve the aspect ratio […]