How-to articles, tricks, and solutions about HTML

In this tutorial, we'll demonstrate how to align a button to the right with CSS. For that purpose, you need to use the CSS float property with its “right” value.

In this tutorial, find out how it is possible to style a list with dashes instead of bullet points. Use the :before pseudo-element with the content property.

Read this tutorial to find out how you can make the middle element stay centered regardless of the widths of the siblings. This can be done by using Flexbox.

In this tutorial, find some methods of creating an HTML table with a fixed header and scrollable body. Here, we suggest using some methods. See examples.

In this tutorial, we’ll explain how to create a two-column <div> layout with the right column having a fixed width. Here, you can find some examples.

In this tutorial, we’ll demonstrate how it is possible to disable form fields with some CSS. For that, you can use the pointer-events property set to “none”.

In this tutorial, you’ll see how to set the default HTML form focus. This can be done without Javascript. For that, use the HTML “autofocus” attribute.

In this tutorial, you will find some examples of using the HTML <fieldset> element. Besides, you can find out why in general we need the <fieldset> element.

In this snippet, you’ll see how to make the text bold by using the <strong> or <b> tags. Also, you can use the CSS font-weight property in the HTML part.

In this snippet, we’ll show how you can set an equivalent of the “cover” value of the background-size property for the <img> tag. Use the object-fit property.

In this snippet, we’ll demonstrate how to allow only positive numbers in the input number type. You can use the “min” attribute to specify restrictions.

In this snippet, we’re going to show how to deal with the problem connected with page break when you print a large HTML table. Use some CSS properties.

In this snippet, we’re going to show how you can display an ordered list with nested counters by using CSS. See some methods of overcoming this problem.

In this snippet, we’re going to demonstrate some ways of forcing the HTML <dt> and <dd> elements stay on the same line. You can use the CSS float property.

In this snippet, you can see how to add and display different symbols, such as infinity ampersand and other symbols. For that, you need to use HTML Entities.

In this snippet, you can see how to remove the focus around a button on click. To solve this problem, you use the CSS outline property with the “none” value.

In this snippet, you can find out how to control the space between bullets and <li> elements. You can use the HTML <span> element and the CSS left property.

The “required” attribute works only on empty values. In this snippet, we’ll show how to apply it to the HTML <select> element. Read and find some examples.

In this snippet, we’ll demonstrate how to force the content of the HTML <div> element to stay on the same line. Use the overflow and white-space properties.

In this snippet, we’re going to demonstrate how you can remove the default arrow icon from a dropdown list. For that, you can use the appearance property.

In this snippet, we’re going to demonstrate how to style the even, odd, or both the even and odd items of an unordered list. See examples with each of them.

In this snippet, we’ll demonstrate how to add an onclick event in CSS. The best way of creating an onclick effect is using the well-known checkbox hack.

In this snippet, you can find out how it is possible to open a link from the HTML <iframe> element in the parent window. For that, you can use the <base> element.

In this snippet, you can find two methods of making a text input non-editable. Use either the HTML “readonly” attribute or add the CSS pointer-events property.

In this snippet, we’ll show how to add a vertical line on the left and right sides, as well as how to center it and how to add a vertical line before a text.