Author: Saim Khalid

The overflow Property CSS overflow property specifies how to handle the content that overflows the boundaries of its container. It can be used to clip the content, add scrollbars, or display an ellipsis. The property only works for block-level elements with a specified height or width. Syntax The syntax for the CSS overflow property is as follows: overflow: visible…

The visibility Property CSS visibility property allows you to show or hide an element without changing the layout of a document, while hidden elements take up space. The visibility property can be used to create a variety of effects, such as hiding elements that are not yet ready to be displayed, or hiding elements that are only relevant to…

Dropdown is a user interface element that includes a list of options. It allows the user to choose one value from a list by hovering or clicking on a trigger element. It is typically used in navigation menus, forms, and other interactive components of a website. Dropdown menu is created using HTML’s unordered list (<ul>) and list…

CSS display: inline-block CSS inline-block is a value for the display property that allows elements to be formatted as block boxes that are laid out as inline boxes. Inline block elements start on the same line but take up multiple lines depending on the height and width of the element. Display inline vs inline-block vs block Values Here is…

Scrollbars are UI elements that allow users to navigate through long content that doesn’t fit entirely within the visible area. They consist of vertical or horizontal bars with a draggable thumb, enabling users to move the content up and down or left to right. It is important to test your scrollbar styling in different browsers…

CSS dimension define the size and space occupied by elements on a webpage. The dimension properties like height, width, max-height, max-width, line-height and many more are used to define width, height of HTML elements in every screen sizes. In this tutorial we will learn how to manage dimension and layout of HTML elements in varying…

CSS outline creates lines around the outside of an element’s border, without affecting its size or layout. It means adding an outline won’t affect the element’s size or the positioning of adjacent elements. Types of Outline Properties CSS provides following outline properties to style the HTML elements. The outline-style Property CSS outline-style property specifies the style for…

CSS cursor property determines the appearance of the mouse cursor when hovering over an element to which this property is applied. Its main purpose is to improve usability by visually representing certain functions. Syntax cursor: value; Property Values Value Description auto The displayed cursor is determined by the user agent based on the current context. This is…

CSS padding is used to create extra space between the border of the element and its contents. In this chapter we will learn different types of padding and properties associated with it. What is CSS Padding? In CSS, padding is a property that is used to create additional spacing inside the boundary of an element. The…

Lists are useful as they present the information in a structured and organized manner. Lists improve the readability and comprehension of content on a web page. So, if the content is listed, it is easy to follow. Lists are commonly used to display items, steps, options, or any other type of related information that should…