Found 7800 Articles for Front End Technology

Why does div display: table-row ignore margin?

Tanmay Chandhok
Updated on 18-Jan-2023 13:11:07
You might have come across a situation when several div elements are together and are next to each other with the property as display: table-cell and there is no margin between them. If you want to set a margin between them, you will need to add margin by adding margin externally. In this article, we are going to have a look why does the display: table--row ignores margin and how can we add margin if we want to add it. How to add the margin to the table? You might be thinking if we add margin externally in the table-row ... Read More

Maintenance with CSS

Tanmay Chandhok
Updated on 18-Jan-2023 12:44:30
CSS is widely known as the cascading style sheets and is used to style the elements which are created using the HTML tags and is responsible for the look and feel of the webpage. We can use CSS to change the color of the text, change the background, add any image or give space between texts. We can create many ways to display a single piece of content. In this article, we are going to explain the ease of maintenance with CSS and what are the benefits of the CSS. Advantages of CSS Following are the advantages of using CSS ... Read More

Em vs Rem units in CSS?

Tanmay Chandhok
Updated on 18-Jan-2023 14:08:43
You might have observed 2 options while setting the size of the elements using CSS properties, one an absolute unit and the other a relative unit. The absolute unit is identical and is fixed and its size can be set with cm, mm, px. On the other hand, relative unit is relative to something else which can be a parent element or any other element. In this tutorial, we are going to have a look at the comparison between the em and rem units in CSS. The Em unit The em unit makes it possible to change the size of ... Read More

Creating an Advanced Loading Screen in CSS

Tanmay Chandhok
Updated on 18-Jan-2023 17:37:15
While browsing through different pages in a website, it is essential that the developer add a loading screen to the website; so that there is enough time for the website to traverse between webpages. A loading screen is an effective way, where the user can wait while the page of the website loads/initialize. How to create the loading screen? To create a loading screen, we can use HTML and CSS. Firstly, we will be creating a div element in which a heading tag is given, that shows the percentage. Then we will be using CSS properties like the border-radius to ... Read More

Difference between Auto-fit vs Auto-fill property in CSS grid

Tanmay Chandhok
Updated on 18-Jan-2023 13:07:01
A responsive webpage is a necessary key point which has to be always kept in mind while developing a website. The grid module enables the developer to design webpages easily without using a lot of positioning, as the id module provides a grid type layout system in which there are rows and columns. The auto-fill property The auto-fill property is used to fill the rows with possible columns, the column which is added will occupy the space and the other column will be empty. The auto-fill property is an important property of the CSS grid and is mostly used so ... Read More

How to align block elements to the center?

Tanmay Chandhok
Updated on 18-Jan-2023 14:25:15
The margin property in CSS can be used to centre a block element like a div horizontally. We can set the width of the element, so that, it prevents the container from stretching out. The block elements take the full space line which force other elements to take up the next line as the block elements have 100% of the container. Aligning the block elements to the center Any element that begins a new line on a web page is considered as a block-level element. For example, header tags, div, etc. These block elements take the full width of the ... Read More

Extract unique objects by attribute from an array of objects in JavaScript

Rushi Javiya
Updated on 17-Jan-2023 09:54:24
We will learn to extract unique objects by attribute from an array of objects in this tutorial. Sometimes, we need to filter objects from the array of objects based on a particular attribute. For example, we have an id as a key to identify the object. So, we need to ensure that the array contains only a single object with a single id. If two or more objects contain the same primary key value, it can cause the problem of uniquely identifying objects. Here, we will learn different approaches to filter all unique objects from the array based on a ... Read More

Explore the concept of JavaScript Function Scope and different types of JavaScript Functions

Rushi Javiya
Updated on 17-Jan-2023 09:50:37
In JavaScript, various scopes allow us to access the functions and variables from different places in our code. We will learn about the function scope in this tutorial. Also, we will explore the different types of function expressions in JavaScript. Function Scope When we create a new function in JavaScript, it also creates the scope for that particular function. It means that whatever variables we declare inside the function or define the nested function inside it, we can only access it inside the function block. If we try to access the variables defined inside the function block from outside the ... Read More

Explain the purpose of the ‘in’ operator in JavaScript

Rushi Javiya
Updated on 17-Jan-2023 09:46:28
This tutorial will teach about the ‘in’ operator in JavaScript. There are many operators available in JavaScript, such as arithmetic operators to perform mathematical operations, assignment operators, equality operators, etc. The ‘in’ operator is also one of them, which we can use to find properties from the object. Before we start, let me ask you a question. Have you ever needed to check for the existence of the object's properties while coding with JavaScript? If yes, how did you deal with it? The answer is simple you can use the ‘in’ operator, which returns the Boolean value based on whether ... Read More

Explain the concepts of functional programming in JavaScript

Rushi Javiya
Updated on 17-Jan-2023 09:43:02
There are mainly two programming paradigms: The imperative programming paradigm and the declarative programming paradigm. Functional programming is a subtype of the declarative paradigm. The paradigm word refers to the approach to solving a particular problem. Functional programming has been in use for the last decades but came in the trend after 2015 when the last main revised version of JavaScript was released. There are many benefits to using functional programming, which we will discuss in this tutorial. Different Concepts of Functional Programming and their benefits Functional programming works as mathematical function works. It allows developers to develop software based ... Read More